fix

MetaMask · Nov 18, 2021 · b221dc7 · b221dc7
1 parent ef43fde
commit b221dc7
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 6 deletions.
diff --git a/ui/components/app/edit-gas-fee-popover/network-status/network-status.js b/ui/components/app/edit-gas-fee-popover/network-status/network-status.js
@@ -9,6 +9,13 @@ import StatusSlider from './status-slider';
 
 const NetworkStatus = () => {
   const { gasFeeEstimates } = useGasFeeContext();
+  let estBaseFee;
+  if (gasFeeEstimates?.estimatedBaseFee) {
+    // estimatedBaseFee is not likely to be below 1, value .01 is used as test networks sometimes
+    // show have small values for it and more decimal places may cause UI to look broken.
+    estBaseFee = parseFloat(gasFeeEstimates?.estimatedBaseFee);
+    estBaseFee = estBaseFee < 0.01 ? 0.01 : estBaseFee.toFixed(2);
+  }
 
   return (
     <div className="network-status">
@@ -24,8 +31,7 @@ const NetworkStatus = () => {
       <div className="network-status__info">
         <div className="network-status__info__field">
           <span className="network-status__info__field-data">
-            {gasFeeEstimates?.estimatedBaseFee &&
-              `${gasFeeEstimates?.estimatedBaseFee} GWEI`}
+            {estBaseFee && `${estBaseFee} GWEI`}
           </span>
           <span className="network-status__info__field-label">Base fee</span>
         </div>

diff --git a/ui/components/app/edit-gas-fee-popover/network-status/network-status.test.js b/ui/components/app/edit-gas-fee-popover/network-status/network-status.test.js
@@ -20,10 +20,10 @@ jest.mock('../../../../store/actions', () => ({
 }));
 
 const MOCK_FEE_ESTIMATE = {
-  estimatedBaseFee: '.000005',
+  estimatedBaseFee: '50.0112',
 };
 
-const renderComponent = () => {
+const renderComponent = (props) => {
   const store = configureStore({
     metamask: {
       nativeCurrency: ETH,
@@ -38,6 +38,7 @@ const renderComponent = () => {
       selectedAddress: '0xAddress',
       featureFlags: { advancedInlineGas: true },
       gasFeeEstimates: MOCK_FEE_ESTIMATE,
+      ...props,
     },
   });
 
@@ -56,10 +57,22 @@ describe('NetworkStatus', () => {
     expect(screen.queryByText('Priority fee')).toBeInTheDocument();
   });
 
-  it('should renders current base fee value', () => {
+  it('should renders current base fee value rounded to 2 decimal places', () => {
     renderComponent();
     expect(
-      screen.queryByText(`${MOCK_FEE_ESTIMATE.estimatedBaseFee} GWEI`),
+      screen.queryByText(
+        `${parseFloat(MOCK_FEE_ESTIMATE.estimatedBaseFee).toFixed(2)} GWEI`,
+      ),
     ).toBeInTheDocument();
   });
+
+  it('should .01 as estimates base fee if estimated base fee is < .01', () => {
+    renderComponent({
+      gasFeeEstimates: {
+        estimatedBaseFee: '0.0012',
+      },
+    });
+    console.log(document.body.innerHTML);
+    expect(screen.queryByText('0.01 GWEI')).toBeInTheDocument();
+  });
 });