Description

This PR adds a dot separator (•) between the price and variation text in token rows on the homepage, aligning with the price • variation format used in TokenListItemV2.

1. What is the reason for the change?

• Token rows in the Cash section and Popular Tokens section did not follow the same layout as token list items
• TokenListItemV2 displays price and variation as $1.00 • +5.25% (or similar)
• The MUSD row in Cash and the Popular Token rows were missing this separator

2. What is the improvement/solution?

• Insert the Unicode bullet (\u2022) between the price and variation
• Update PopularTokenRow so price and percentage display as price • variation
• Update CashGetMusdEmptyState for the MUSD empty state
• Adjust test assertions in PopularTokenRow.test.tsx to match the new format

Changelog

CHANGELOG entry: Fixed token row display on homepage to show price and variation separated by a dot for consistency with token list items

Related issues

Fixes: TMCU-569

Manual testing steps

Feature: Homepage token row display consistency

  Scenario: user views token rows with price and variation
    Given the user is on the Homepage
    And the Cash section shows MUSD or Popular Tokens shows tokens with price/variation
    When the user views the token row
    Then price and variation are separated by a dot (•)
    And the layout matches TokenListItemV2 (e.g. "$1.00 • 3% bonus" or "$1,234.56 • +5.25%")

Screenshots/Recordings

Before

After

Pre-merge author checklist

• I've followed MetaMask Contributor Docs and MetaMask Mobile Coding Standards.
• I've completed the PR template to the best of my ability
• I've included tests if applicable
• I've documented my code using JSDoc format if applicable
• I've applied the right labels on the PR (see labeling guidelines). 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.