chore: remove bold weight on token list item v2 and adding comma separation to token price

Author: juanmigdr

app/components/UI/Predict/utils/format.test.ts

@@ -1618,6 +1618,22 @@ describe('format utils', () => {
         // Assert
         expect(result).toBe('$0.5678');
       });
+
+      it('truncates to 2 decimals for prices >= 1 with extra decimal places', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(2285.013);
+
+        // Assert
+        expect(result).toBe('$2,285.01');
+      });
+
+      it('truncates to 2 decimals for prices >= 1 with 4 decimal places', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(1.2345);
+
+        // Assert
+        expect(result).toBe('$1.23');
+      });
     });
 
     describe('Zero value', () => {

app/components/UI/Predict/utils/format.ts

@@ -114,15 +114,17 @@ export const formatPrice = (
  * - Uses subscript notation for values with 4+ leading zeros (e.g., 0.00000614 → $0.0₅614)
  * - The subscript indicates the number of leading zeros after the decimal point
  * - Returns "—" for zero values
- * - Uses min 2, max 4 decimal places for regular values
+ * - Values >= 1: exactly 2 decimal places (e.g. $2,285.01)
+ * - Values < 1: up to 4 decimal places (e.g. $0.1446)
  * @param price - The price value to format (string or number)
  * @param currencyCode - ISO 4217 currency code (e.g. 'USD', 'EUR'). Defaults to 'USD'.
  * @returns Formatted price string with currency symbol or "—" for zero
+ * @example formatPriceWithSubscriptNotation(2285.013) => "$2,285.01"
  * @example formatPriceWithSubscriptNotation(1.99) => "$1.99"
  * @example formatPriceWithSubscriptNotation(0.144566) => "$0.1446"
  * @example formatPriceWithSubscriptNotation(0.00000614) => "$0.0₅614"
  * @example formatPriceWithSubscriptNotation(0) => "—"
- * @example formatPriceWithSubscriptNotation(1.2345, 'EUR') => "€1.2345"
+ * @example formatPriceWithSubscriptNotation(1.2345, 'EUR') => "€1.23"
  */
 export const formatPriceWithSubscriptNotation = (
   price: string | number,
@@ -151,7 +153,7 @@ export const formatPriceWithSubscriptNotation = (
   const formattedNumber = new Intl.NumberFormat('en-US', {
     style: 'decimal',
     minimumFractionDigits: 2,
-    maximumFractionDigits: 4,
+    maximumFractionDigits: num >= 1 ? 2 : 4,
   }).format(num);
   return addSymbol(formattedNumber);
 };

app/components/UI/Tokens/TokenList/TokenListItemV2/TokenListItemV2.tsx

@@ -72,7 +72,7 @@ import {
 } from '../../../../../selectors/networkController';
 import { selectShowFiatInTestnets } from '../../../../../selectors/settings';
 import { getNativeTokenAddress } from '@metamask/assets-controllers';
-import { addCurrencySymbol } from '../../../../../util/number';
+import { formatPriceWithSubscriptNotation } from '../../../Predict/utils/format';
 import { safeToChecksumAddress } from '../../../../../util/address';
 import generateTestId from '../../../../../../wdio/utils/generateTestId';
 import { getAssetTestId } from '../../../../../../wdio/screen-objects/testIDs/Screens/WalletView.testIds';
@@ -631,7 +631,7 @@ export const TokenListItemV2 = React.memo(
                   asset.balanceFiat === TOKEN_RATE_UNDEFINED ||
                   hideFiatForTestnet
                     ? CLTextVariant.BodySM
-                    : CLTextVariant.BodyMDBold
+                    : CLTextVariant.BodyMDMedium
                 }
                 isHidden={privacyMode}
                 length={SensitiveTextLength.Medium}
@@ -662,11 +662,9 @@ export const TokenListItemV2 = React.memo(
                       twClassName="uppercase"
                     >
                       {tokenPriceInFiat && !hideFiatForScamWarning
-                        ? addCurrencySymbol(
+                        ? formatPriceWithSubscriptNotation(
                             tokenPriceInFiat,
                             currentCurrency,
-                            true,
-                            true,
                           )
                         : '-'}
                       {' \u2022 '}