Description

Adds wallet balance context to the Card CARD_VIEWED event when the user opens the Spending limit (or enable-token) flow, and aligns row affordance icons with a down chevron on the settings-style rows.

Why: Product and analytics need to understand Linea mUSD exposure, which card-supported asset has the highest fiat balance for the current account, and which asset is top across the whole wallet (EVM networks plus Solana) at screen view time—without inferring this from other screens.

What changed:

• useSpendingLimit.ts
  • Calls useTokensWithBalance twice: card chain IDs (CARD_CHAIN_IDS) for walletTokens, and all configured EVM chain IDs plus Solana (via selectEvmNetworkConfigurationsByChainId and cardNetworkInfos.solana.caipChainId) for allWalletTokens.
  • On MetaMetricsEvents.CARD_VIEWED, adds:
    • musd_linea_balance: fiat amount for mUSD on Linea on the selected account, or 0 if absent.
    • top_card_chain_asset: network:symbol (e.g. linea:musd) for the highest fiat token among card-supported balances (allTokens intersection), or null if none / unsupported-only (e.g. top balance not in card list).
    • top_wallet_chain_asset / top_wallet_asset_balance: highest fiat token across all wallet tokens and its fiat value (or null / 0 when applicable). Network label uses caipChainIdToNetwork where mapped, otherwise the CAIP chain id string.
  • Introduces toNetworkAsset to normalize network:symbol for analytics.
  • Analytics effect runs after wallet token hooks; dependency array intentionally limited (with eslint comment) so the viewed snapshot stays stable at mount.
• SpendingLimit.tsx: Account, Token, and Spending limit row trailing icons ArrowRight → ArrowDown for clearer expand/dropdown affordance.
• useSpendingLimit.test.ts: Tests for musd_linea_balance, top_card_chain_asset (including empty list, non-card-supported top token), and top_wallet_chain_asset / top_wallet_asset_balance; clarifies default selector mock comment.

Changelog

CHANGELOG entry: Card Spending limit screen analytics include Linea mUSD fiat balance, top card-supported asset by fiat, and top wallet-wide asset by fiat when the screen is viewed.

Related issues

Fixes:

Manual testing steps

Feature: Spending limit viewed analytics and row icons

  Scenario: CARD_VIEWED includes balance properties
    Given I open Spending limit (or enable flow) with a known Linea mUSD balance and other tokens
    When the screen is tracked as viewed
    Then CARD_VIEWED includes musd_linea_balance, top_card_chain_asset, top_wallet_chain_asset, and top_wallet_asset_balance consistent with the selected account and supported tokens

  Scenario: Row chevrons
    When I view the Spending limit settings rows (Account, Token, Spending limit)
    Then each row shows a down chevron affordance instead of a right arrow

Screenshots/Recordings

Optional: capture the three rows showing down chevrons. For analytics, verify in debug/logs or analytics tooling that CARD_VIEWED payloads include the new properties.

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.