From bdd92438275867c9904cb8d1ec5e1f6c930f706b Mon Sep 17 00:00:00 2001
From: Nick Gambino <35090461+gambinish@users.noreply.github.com>
Date: Wed, 18 Dec 2024 08:54:55 -0800
Subject: [PATCH] fix: Token details should not display zero balance for tokens
 without marketData (#29299)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## **Description**

On main asset list, if a token doesn't have marketData, we do not
display the fiat value. On tokenDetails we were falling back to zero
balance (this is incorrect)

This PR adds a fix to not fallback to zero balance, and to instead
simply omit the value.

[![Open in GitHub
Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/29299?quickstart=1)

## **Related issues**

Fixes: https://github.com/MetaMask/metamask-extension/issues/29244

## **Manual testing steps**

1. Add a memcoin without marketData
2. Validate that no fiat value is shown on main asset list
3. Validate that no fiat value is shown on token details (should not
display zero value)
4. Ensure nothing results in `NaN` value.

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before**

<img width="355" alt="Screenshot 2024-12-17 at 1 39 10 PM"
src="https://github.com/user-attachments/assets/3c561498-9ee7-403e-97ff-adf16bf6beda"
/>

<img width="358" alt="Screenshot 2024-12-17 at 1 39 26 PM"
src="https://github.com/user-attachments/assets/c19062d9-7082-46f1-b3e9-8264e9ba3749"
/>

### **After**

<img width="360" alt="Screenshot 2024-12-17 at 1 34 09 PM"
src="https://github.com/user-attachments/assets/80240d57-e875-4418-9574-81ecca7c2690"
/>

<img width="357" alt="Screenshot 2024-12-17 at 1 34 26 PM"
src="https://github.com/user-attachments/assets/852e2cab-0a8b-413b-97ea-35ad725f3add"
/>

## **Pre-merge author checklist**

- [x] I've followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask
Extension Coding
Standards](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [x] I've completed the PR template to the best of my ability
- [x] I’ve included tests if applicable
- [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [x] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.
---
 .../asset/components/__snapshots__/asset-page.test.tsx.snap | 4 +---
 ui/pages/asset/components/asset-page.tsx                    | 6 ++++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/ui/pages/asset/components/__snapshots__/asset-page.test.tsx.snap b/ui/pages/asset/components/__snapshots__/asset-page.test.tsx.snap
index dc3cf4c408de..6a55226a42cb 100644
--- a/ui/pages/asset/components/__snapshots__/asset-page.test.tsx.snap
+++ b/ui/pages/asset/components/__snapshots__/asset-page.test.tsx.snap
@@ -223,9 +223,7 @@ exports[`AssetPage should render a native asset 1`] = `
               <p
                 class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--text-align-end mm-box--color-text-default"
                 data-testid="multichain-token-list-item-secondary-value"
-              >
-                $0.00
-              </p>
+              />
             </div>
             <div
               class="mm-box mm-box--display-flex mm-box--flex-direction-row mm-box--justify-content-space-between"
diff --git a/ui/pages/asset/components/asset-page.tsx b/ui/pages/asset/components/asset-page.tsx
index aef098bfd9d2..c26f2d025f70 100644
--- a/ui/pages/asset/components/asset-page.tsx
+++ b/ui/pages/asset/components/asset-page.tsx
@@ -168,7 +168,7 @@ const AssetPage = ({
 
   // Market and conversion rate data
   const baseCurrency = marketData[chainId]?.[address]?.currency;
-  const tokenMarketPrice = marketData[chainId]?.[address]?.price || 0;
+  const tokenMarketPrice = marketData[chainId]?.[address]?.price || undefined;
   const tokenExchangeRate =
     type === AssetType.native
       ? currencyRates[symbol]?.conversionRate
@@ -284,7 +284,9 @@ const AssetPage = ({
           chainId={chainId}
           symbol={symbol}
           image={image}
-          tokenFiatAmount={showFiat ? tokenFiatAmount : null}
+          tokenFiatAmount={
+            showFiat && tokenMarketPrice ? tokenFiatAmount : null
+          }
           string={balance?.toString()}
         />
         <Box