From a384f2eeb49c44c03808a0720caee5e84d90186d Mon Sep 17 00:00:00 2001
From: Alex <alex0394@hotmail.com>
Date: Wed, 18 May 2022 00:40:08 -0400
Subject: [PATCH 1/2] added maximumSignificantDigits to 4 for amount

---
 .../field-input/amount-field-input.tsx        | 21 +++++--------------
 1 file changed, 5 insertions(+), 16 deletions(-)

diff --git a/packages/react-app/src/components/field-input/amount-field-input.tsx b/packages/react-app/src/components/field-input/amount-field-input.tsx
index cd349c1f..aadae59b 100644
--- a/packages/react-app/src/components/field-input/amount-field-input.tsx
+++ b/packages/react-app/src/components/field-input/amount-field-input.tsx
@@ -11,7 +11,6 @@ import { arrayDistinctBy } from 'src/utils/array.util';
 import { getTokenInfo } from 'src/utils/contract.util';
 import { GUpx } from 'src/utils/style.util';
 import { Logger } from 'src/utils/logger';
-import { floorNumber } from 'src/utils/math.utils';
 import { includesCaseInsensitive } from 'src/utils/string.util';
 import { isAddress } from 'src/utils/web3.utils';
 import styled from 'styled-components';
@@ -83,7 +82,6 @@ type TokenBadgeProp = {
   token?: TokenModel;
   amount?: number | false;
   usdValue?: number | false;
-  decimalsCount?: number;
 };
 
 const TokenAmountBadge = React.memo(
@@ -99,13 +97,15 @@ const TokenAmountBadge = React.memo(
     },
     amount,
     usdValue,
-    decimalsCount,
   }: TokenBadgeProp) => {
     const copyCode = useCopyToClipboard();
     const label = useMemo(() => {
       let temp = '';
       if (amount !== false && amount !== undefined) {
-        temp += `${floorNumber(amount ?? 0, decimalsCount).toLocaleString()} `;
+        const amountFormat = new Intl.NumberFormat('en-IN', { maximumSignificantDigits: 4 }).format(
+          amount,
+        );
+        temp += `${amountFormat} `;
       }
       temp += `${token.symbol}`;
       if (usdValue) {
@@ -151,7 +151,6 @@ type Props = {
   formik?: FormikContextType<any>;
   compact?: boolean;
   tooltip?: ReactNode;
-  maxDecimals?: number;
   disabled?: boolean;
   wide?: boolean;
   tokenEditable?: boolean;
@@ -174,7 +173,6 @@ function AmountFieldInput({
   formik,
   tooltip,
   compact = false,
-  maxDecimals,
   disabled = false,
   wide = false,
   tokenEditable = false,
@@ -185,7 +183,6 @@ function AmountFieldInput({
 }: Props) {
   let mounted = true;
   const { networkId } = getNetwork();
-  const [decimalsCount, setDecimalsCount] = useState(maxDecimals);
   const [tokens, setTokens] = useState<TokenModel[]>([]);
   const [searchTerm, setSearchTerm] = useState<string>();
   const [amount, setAmount] = useState<number | undefined>(value?.parsedAmount);
@@ -235,13 +232,6 @@ function AmountFieldInput({
     }
   }, [searchTerm, availableTokens, _hasFocused]);
 
-  useEffect(() => {
-    if (!isEdit) {
-      if (value?.parsedAmount && (!maxDecimals || maxDecimals > 0))
-        setDecimalsCount(maxDecimals ?? 4);
-    }
-  }, [maxDecimals, isEdit, value?.parsedAmount]);
-
   useEffect(() => {
     setAmount(value?.parsedAmount ?? 0);
     setToken(value?.token);
@@ -328,7 +318,7 @@ function AmountFieldInput({
               disabled={!token ? true : disabled}
             />
           ) : (
-            floorNumber(amount, decimalsCount).toLocaleString()
+            Intl.NumberFormat('en-IN', { maximumSignificantDigits: 4 }).format(amount)
           ))}
       </AmountTokenWrapperStyled>
     </FieldInput>
@@ -349,7 +339,6 @@ function AmountFieldInput({
           token={token}
           amount={tagOnly && amount}
           usdValue={showUsd && value?.usdValue}
-          decimalsCount={decimalsCount}
         />
       ) : (
         <AutoCompleteWrapperStyled wide={wide}>

From 158fdb3653fb6aa5148f6ad096c2c2cdf97badd6 Mon Sep 17 00:00:00 2001
From: Alex <alex0394@hotmail.com>
Date: Wed, 18 May 2022 15:46:06 -0400
Subject: [PATCH 2/2] replace maximumSignificativeDigits with
 maximumFractionDigits

---
 .../src/components/field-input/amount-field-input.tsx     | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/react-app/src/components/field-input/amount-field-input.tsx b/packages/react-app/src/components/field-input/amount-field-input.tsx
index aadae59b..7f002d78 100644
--- a/packages/react-app/src/components/field-input/amount-field-input.tsx
+++ b/packages/react-app/src/components/field-input/amount-field-input.tsx
@@ -102,9 +102,9 @@ const TokenAmountBadge = React.memo(
     const label = useMemo(() => {
       let temp = '';
       if (amount !== false && amount !== undefined) {
-        const amountFormat = new Intl.NumberFormat('en-IN', { maximumSignificantDigits: 4 }).format(
-          amount,
-        );
+        const amountFormat = new Intl.NumberFormat('en-US', {
+          maximumFractionDigits: 4,
+        }).format(amount);
         temp += `${amountFormat} `;
       }
       temp += `${token.symbol}`;
@@ -318,7 +318,7 @@ function AmountFieldInput({
               disabled={!token ? true : disabled}
             />
           ) : (
-            Intl.NumberFormat('en-IN', { maximumSignificantDigits: 4 }).format(amount)
+            Intl.NumberFormat('en-US', { maximumFractionDigits: 4 }).format(amount)
           ))}
       </AmountTokenWrapperStyled>
     </FieldInput>