trim nano_account in filters

running-coder · Jan 22, 2024 · c24f5c0 · c24f5c0
1 parent c3c2582
commit c24f5c0
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 4 deletions.
diff --git a/src/App.css b/src/App.css
@@ -105,7 +105,6 @@ a:hover {
 }
 
 .truncate {
-  display: block;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;

diff --git a/src/components/utils/index.ts b/src/components/utils/index.ts
@@ -80,7 +80,7 @@ export const BLOCK_REGEX = /[0-9A-F]{64}/;
 export const isValidAccountAddress = (address: string): boolean =>
   new RegExp(`^${ACCOUNT_REGEX.toString().replace(/\//g, "")}$`, "i").test(address);
 
-export const getAccountAddressFromText = (text: string): string | null => {
+export const getAccountAddressFromText = (text: string): string => {
   const [, address] =
     text?.match(
       new RegExp(`[^sS]*?(${ACCOUNT_REGEX.toString().replace(/\//g, "")})[^sS]*?`, "i"),

diff --git a/src/pages/Account/History/Filters.tsx b/src/pages/Account/History/Filters.tsx
@@ -20,6 +20,7 @@ import moment from "moment";
 import { AccountHistoryFilterContext } from "api/contexts/AccountHistoryFilter";
 import { PreferencesContext, Theme } from "api/contexts/Preferences";
 import QuestionCircle from "components/QuestionCircle";
+import { getAccountAddressFromText, isValidAccountAddress } from "components/utils";
 import { TwoToneColors } from "components/utils";
 
 import Export from "./Export";
@@ -181,7 +182,24 @@ const Filters: React.FC = () => {
               </Select>
               <Controller
                 render={({ field }) => (
-                  <Input {...field} style={{ flexGrow: 1 }} placeholder="nano_" />
+                  <Input
+                    {...field}
+                    style={{ flexGrow: 1 }}
+                    placeholder="nano_"
+                    onPaste={e => {
+                      e.preventDefault();
+
+                      // @ts-ignore
+                      const paste = (e.clipboardData || window.clipboardData).getData("text");
+
+                      const account = getAccountAddressFromText(paste);
+                      if (isValidAccountAddress(account)) {
+                        setValue("sender", account);
+                      }
+
+                      setValue("sender", account);
+                    }}
+                  />
                 )}
                 control={control}
                 name="sender"
@@ -227,7 +245,23 @@ const Filters: React.FC = () => {
               </Select>
               <Controller
                 render={({ field }) => (
-                  <Input {...field} style={{ flexGrow: 1 }} placeholder="nano_" />
+                  <Input
+                    {...field}
+                    name="receiver"
+                    style={{ flexGrow: 1 }}
+                    placeholder="nano_"
+                    onPaste={e => {
+                      e.preventDefault();
+
+                      // @ts-ignore
+                      const paste = (e.clipboardData || window.clipboardData).getData("text");
+
+                      const account = getAccountAddressFromText(paste);
+                      if (isValidAccountAddress(account)) {
+                        setValue("receiver", account);
+                      }
+                    }}
+                  />
                 )}
                 control={control}
                 name="receiver"