From 32a3ad4400890625dee6457f50553c1d25b7d408 Mon Sep 17 00:00:00 2001
From: Kieran O'Neill <hello@kieranoneill.com>
Date: Sat, 3 Feb 2024 17:37:05 +0200
Subject: [PATCH] feat: remove zero when focusing on the send asset input
 (#153)

---
 .../send-assets/thunks/submitTransactionThunk.ts    |  8 +++++---
 .../modals/SendAssetModal/SendAmountInput.tsx       | 13 ++++++++++---
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/src/extension/features/send-assets/thunks/submitTransactionThunk.ts b/src/extension/features/send-assets/thunks/submitTransactionThunk.ts
index 5836641c..cd20a650 100644
--- a/src/extension/features/send-assets/thunks/submitTransactionThunk.ts
+++ b/src/extension/features/send-assets/thunks/submitTransactionThunk.ts
@@ -53,8 +53,10 @@ const submitTransactionThunk: AsyncThunk<
 > = createAsyncThunk<string, string, AsyncThunkConfig>(
   SendAssetsThunkEnum.SubmitTransaction,
   async (password, { getState, rejectWithValue }) => {
-    const amountInStandardUnits: string | null =
-      getState().sendAssets.amountInStandardUnits;
+    const amountInStandardUnits: string =
+      getState().sendAssets.amountInStandardUnits.length > 0
+        ? getState().sendAssets.amountInStandardUnits
+        : '0';
     const asset: IAssetTypes | INativeCurrency | null =
       getState().sendAssets.selectedAsset;
     const fromAddress: string | null = getState().sendAssets.fromAddress;
@@ -73,7 +75,7 @@ const submitTransactionThunk: AsyncThunk<
     let privateKeyService: PrivateKeyService;
     let suggestedParams: SuggestedParams;
 
-    if (!amountInStandardUnits || !asset || !fromAddress || !toAddress) {
+    if (!asset || !fromAddress || !toAddress) {
       logger.debug(
         `${SendAssetsThunkEnum.SubmitTransaction}: required fields not completed`
       );
diff --git a/src/extension/modals/SendAssetModal/SendAmountInput.tsx b/src/extension/modals/SendAssetModal/SendAmountInput.tsx
index 1181a7d1..01080505 100644
--- a/src/extension/modals/SendAssetModal/SendAmountInput.tsx
+++ b/src/extension/modals/SendAssetModal/SendAmountInput.tsx
@@ -106,10 +106,16 @@ const SendAmountInput: FC<IProps> = ({
       })
     );
   };
+  const handleOnChange = (valueAsString: string | undefined) =>
+    onValueChange(valueAsString || '');
+  const handleOnFocus = (event: FocusEvent<HTMLInputElement>) => {
+    // remove the padded zero
+    if (event.target.value === '0') {
+      onValueChange('');
+    }
+  };
   const handleMaximumAmountClick = () =>
     onValueChange(maximumTransactionAmountInStandardUnit.toString());
-  const handleOnChange = (valueAsString: string | undefined) =>
-    onValueChange(valueAsString || '0');
   // renders
   const renderMaximumTransactionAmountLabel = () => {
     let symbol: string = '';
@@ -216,7 +222,8 @@ const SendAmountInput: FC<IProps> = ({
           focusBorderColor={primaryColor}
           onBlur={handleOnBlur}
           onChange={handleOnChange}
-          size="md"
+          onFocus={handleOnFocus}
+          size="lg"
           value={value || undefined}
           w="full"
         >