use numeric before save in state

MetaMask · Feb 6, 2024 · b3f28fb · b3f28fb
1 parent 49435c8
commit b3f28fb
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 13 deletions.
diff --git a/...nents/app/advanced-gas-fee-popover/advanced-gas-fee-defaults/advanced-gas-fee-defaults.js b/...nents/app/advanced-gas-fee-popover/advanced-gas-fee-defaults/advanced-gas-fee-defaults.js
@@ -19,12 +19,21 @@ import { useGasFeeContext } from '../../../../contexts/gasFee';
 import { useAdvancedGasFeePopoverContext } from '../context';
 import { useI18nContext } from '../../../../hooks/useI18nContext';
 import { Checkbox, Box } from '../../../component-library';
+import { Numeric } from '../../../../../shared/modules/Numeric';
 
 const AdvancedGasFeeDefaults = () => {
   const t = useI18nContext();
   const dispatch = useDispatch();
-  const { gasErrors, maxBaseFee, maxPriorityFeePerGas } =
-    useAdvancedGasFeePopoverContext();
+  const {
+    gasErrors,
+    maxBaseFee: maxBaseFeeNumber,
+    maxPriorityFeePerGas: maxPriorityFeePerGasNumber,
+  } = useAdvancedGasFeePopoverContext();
+  const maxBaseFee = new Numeric(maxBaseFeeNumber, 10).toString();
+  const maxPriorityFeePerGas = new Numeric(
+    maxPriorityFeePerGasNumber,
+    10,
+  ).toString();
   const advancedGasFeeValues = useSelector(getAdvancedGasFeeValues);
   // This will need to use a different chainId in multinetwork
   const chainId = useSelector(getCurrentChainId);

diff --git a/...nts/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.js b/...nts/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.js
@@ -46,8 +46,13 @@ const validateBaseFee = (value, gasFeeEstimates, maxPriorityFeePerGas) => {
 const BaseFeeInput = () => {
   const t = useI18nContext();
 
-  const { gasFeeEstimates, estimateUsed, maxFeePerGas, editGasMode } =
-    useGasFeeContext();
+  const {
+    gasFeeEstimates,
+    estimateUsed,
+    maxFeePerGas: maxBaseFeeNumber,
+    editGasMode,
+  } = useGasFeeContext();
+  const maxFeePerGas = new Numeric(maxBaseFeeNumber, 10).toString();
   const {
     gasLimit,
     maxPriorityFeePerGas,
@@ -72,7 +77,7 @@ const BaseFeeInput = () => {
       return advancedGasFeeValues.maxBaseFee;
     }
 
-    return new Numeric(maxFeePerGas, 10)?.toString();
+    return maxFeePerGas;
   });
 
   const [baseFeeInPrimaryCurrency] = useCurrencyDisplay(
@@ -82,7 +87,7 @@ const BaseFeeInput = () => {
 
   const updateBaseFee = useCallback(
     (value) => {
-      setBaseFee(new Numeric(value, 10)?.toString());
+      setBaseFee(value);
     },
     [setBaseFee],
   );

diff --git a/...pp/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.test.js b/...pp/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.test.js
@@ -192,7 +192,7 @@ describe('BaseFeeInput', () => {
 
       fireEvent.change(input, { target: { value: LOW_BASE_FEE } });
 
-      expect(input.value).toBe('0.000000001');
+      expect(input.value).toBe('1e-9');
     });
   });
 });
diff --git a/...advanced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.js b/...advanced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.js
@@ -52,8 +52,16 @@ const PriorityFeeInput = () => {
   const advancedGasFeeValues = useSelector(getAdvancedGasFeeValues);
   const { gasLimit, setErrorValue, setMaxPriorityFeePerGas } =
     useAdvancedGasFeePopoverContext();
-  const { editGasMode, estimateUsed, gasFeeEstimates, maxPriorityFeePerGas } =
-    useGasFeeContext();
+  const {
+    editGasMode,
+    estimateUsed,
+    gasFeeEstimates,
+    maxPriorityFeePerGas: maxPriorityFeePerGasNumber,
+  } = useGasFeeContext();
+  const maxPriorityFeePerGas = new Numeric(
+    maxPriorityFeePerGasNumber,
+    10,
+  ).toString();
   const {
     latestPriorityFeeRange,
     historicalPriorityFeeRange,
@@ -69,7 +77,7 @@ const PriorityFeeInput = () => {
     ) {
       return advancedGasFeeValues.priorityFee;
     }
-    return new Numeric(maxPriorityFeePerGas, 10).toString();
+    return maxPriorityFeePerGas;
   });
 
   const { currency, numberOfDecimals } = useUserPreferencedCurrency(PRIMARY);
@@ -80,7 +88,7 @@ const PriorityFeeInput = () => {
   );
 
   const updatePriorityFee = (value) => {
-    setPriorityFee(new Numeric(value, 10)?.toString());
+    setPriorityFee(value);
   };
 
   useEffect(() => {

diff --git a/...ced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.test.js b/...ced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.test.js
@@ -178,7 +178,7 @@ describe('PriorityfeeInput', () => {
 
       fireEvent.change(input, { target: { value: LOW_PRIORITY_FEE } });
 
-      expect(input.value).toBe('0.000000001');
+      expect(input.value).toBe('1e-9');
     });
   });
 });
diff --git a/ui/store/actions.ts b/ui/store/actions.ts
@@ -3199,7 +3199,7 @@ export function detectNfts(): ThunkAction<
 }
 
 export function setAdvancedGasFee(
-  val: { chainId: Hex; maxBaseFee?: Hex; priorityFee?: Hex } | null,
+  val: { chainId: Hex; maxBaseFee?: string; priorityFee?: string } | null,
 ): ThunkAction<void, MetaMaskReduxState, unknown, AnyAction> {
   return (dispatch: MetaMaskReduxDispatch) => {
     dispatch(showLoadingIndication());