feat: integrate selected token functionality into crypto payment section#30029
Conversation
…nfig and adjust renderTrailing function
…sk/metamask-mobile into vs/pay-with-bottom-sheet-skeleton
|
CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes. |
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## vs/pay-with-crypto-section #30029 +/- ##
=============================================================
Coverage ? 81.56%
=============================================================
Files ? 5355
Lines ? 142350
Branches ? 32473
=============================================================
Hits ? 116102
Misses ? 18303
Partials ? 7945 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
…ed on transaction metadata
🔍 Smart E2E Test Selection
click to see 🤖 AI reasoning detailsE2E Test Selection:
These changes directly affect the EIP-7702 gas fee token selection flow and the "Pay With" bottom sheet UI used in confirmations. The existing E2E tests The changes are scoped to the confirmations pay subsystem - no other areas (accounts, networks, browser, snaps, etc.) are affected. The refactoring moves logic between files but the behavioral change is the new auto-dismiss behavior when a token is selected and the new selected-token row display in the crypto section. No dependent tags are required per the tag descriptions since this doesn't involve swap/bridge flows, stake flows, or Solana transactions. Performance Test Selection: |
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, have a team admin enable autofix in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit 5ba9b00. Configure here.
| chainId: preferredToken.chainId, | ||
| }); | ||
| navigation.goBack(); | ||
| }, [navigation, preferredToken, selectToken]); |
There was a problem hiding this comment.
Double goBack when preferred token row changes selection
Medium Severity
When a user taps the preferred token row and it differs from the currently selected token, handlePreferredTokenPress calls selectToken (which synchronously updates payToken in Redux via setPayToken → EngineService.flushState()) and then calls navigation.goBack(). Because the bottom sheet component remains mounted during its closing animation, useDismissOnPayTokenChange detects the payToken change on the next render and fires a second navigation.goBack(), potentially popping the confirmation screen behind the bottom sheet.
Additional Locations (1)
Reviewed by Cursor Bugbot for commit 5ba9b00. Configure here.
|





Description
Extends the Crypto section of the redesigned Pay with bottom sheet so the user-selected token from the existing Other assets picker is reflected back as its own row the next time the bottom sheet opens.
When the selected pay token diverges from the auto-selected preferred candidate, both rows render: the preferred token row (no checkmark) and a separate user-selected token row (with the checkmark). When the user re-selects the preferred token, the bottom sheet collapses back to a single row — preferred with the checkmark. Tapping the preferred token row inside the bottom sheet selects it directly, with an idempotency guard that avoids refiring gas-fee estimates when the row is already selected.
Scoped to the current transaction only: no new persistence layer is introduced. The selection lives on
TransactionPayController's per-transaction state — the same source the existingPayWithModalalready writes to viasetPayToken. Origin (user vs automatic) is derived by comparingpayTokento the automatic candidate fromuseAutomaticTransactionPayToken.The bottom sheet now dismisses itself whenever a token is selected, so the only path that leaves the picker open is the header X. Two paths covered:
onPresscallsselectTokenand thennavigation.goBack(). Idempotent taps (already-selected) still dismiss — a token-row tap is treated as a "done picking" signal.PayWithModal: newuseDismissOnPayTokenChange()hook snapshotspayTokenon mount and callsnavigation.goBack()whenever the value diverges. Wired intoPayWithBottomSheet. The modal still closes itself first via its existinghandleTokenSelectpath, then the sheet sees the change and pops, returning the user to the confirmation screen.No double-dismiss: the row-tap path goes through
setPayTokentoo, but the section hook callsgoBack()first, so by the time the effect re-runs the route is already popped.Changelog
CHANGELOG entry:
Related issues
Fixes: https://consensyssoftware.atlassian.net/browse/CONF-1360
Manual testing steps
Screenshots/Recordings
WhatsApp.Video.2026-05-12.at.11.21.27.mp4
Before
After
Pre-merge author checklist
Performance checks (if applicable)
trace()for usage andaddTokenfor an exampleFor performance guidelines and tooling, see the Performance Guide.
Pre-merge reviewer checklist
Note
Medium Risk
Changes the confirmation pay-token selection UX and navigation behavior by adding new token-selection state handling and automatically dismissing the bottom sheet when the transaction pay token updates. Risk is moderate because it touches transaction pay-token resolution/comparison logic and route dismissal flow.
Overview
The Pay With bottom sheet now auto-dismisses when the active transaction
payTokenchanges (newuseDismissOnPayTokenChange, wired intoPayWithBottomSheet) so selecting a token in the underlying modal collapses back to the confirmation screen.The crypto section now shows a separate user-selected token row (when it differs from the automatic/preferred candidate), allows tapping the preferred-token row to reselect it (with an idempotent
selectTokenhelper), and centralizes token matching + preferred-token fallback resolution via newisMatchingPayTokenandresolvePreferredPayTokenutilities (including mUSD mainnet fallback formoneyAccountWithdraw). Tests were updated/added to cover the new rows, presses, and dismissal behavior.Reviewed by Cursor Bugbot for commit 5ba9b00. Bugbot is set up for automated code reviews on this repo. Configure here.