Description

Adds a Bank and card section to the redesigned Pay With bottom sheet so users can pay a confirmation with a fiat payment method (Debit/Credit card, Apple Pay, Google Pay, etc.) in addition to crypto. The new section wraps the existing useFiatPaymentHighlightedActions hook so it inherits the same gating and selection behavior the legacy PayWithModal already uses for fiat methods — same data source, same controller writes, new UI surface.
When a user taps a fiat method, the controller's selectedPaymentMethodId updates and the bottom sheet closes. Tapping an already-selected fiat row just dismisses the sheet without deselecting. The section renders above the existing Crypto section.
When the new bottom sheet is enabled, the legacy PayWithModal no longer surfaces fiat highlighted items — it continues to serve as the underlying token picker reachable via "Other assets". The Bank and card section becomes the single source of truth for fiat payment methods in this flow.
A few related fixes that surfaced during integration:

• Mutually-exclusive selection between fiat and crypto. When a fiat method is selected, crypto rows in the same sheet no longer show a checkmark. This mirrors the existing legacy modal behavior so selection semantics stay consistent between the old and new pickers.
• Sheet dismissal coordination. Both pay-token and fiat-payment changes can dismiss the sheet; a shared latch ensures only one dismissal fires per controller write, preventing the sheet from popping the screen behind it when both values change at once.
• Icon color consistency. Fiat payment method icons now render with the same token color as other secondary icons in the sheet for visual parity.

Changelog

CHANGELOG entry: null

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/CONF-1364

Manual testing steps

Feature: my feature name

  Scenario: user [verb for user action]
    Given [describe expected initial app state]

    When user [verb for user action]
    Then [describe expected outcome]

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.

Performance checks (if applicable)

• I've tested on Android
  • Ideally on a mid-range device; emulator is acceptable
• I've tested with a power user scenario
  • Use these power-user SRPs to import wallets with many accounts and tokens
• I've instrumented key operations with Sentry traces for production performance metrics
  • See trace() for usage and addToken for an example

For performance guidelines and tooling, see the Performance Guide.

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.