Skip to content

feat: new swaps keypad#25845

Merged
GeorgeGkas merged 20 commits intomainfrom
new-swaps-keypad
Feb 13, 2026
Merged

feat: new swaps keypad#25845
GeorgeGkas merged 20 commits intomainfrom
new-swaps-keypad

Conversation

@GeorgeGkas
Copy link
Copy Markdown
Contributor

@GeorgeGkas GeorgeGkas commented Feb 9, 2026 •
edited by cursor bot
Loading

Description

Implement new swaps keypad UI.

Changelog

CHANGELOG entry: revamp swaps keypad

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/SWAPS-3970, https://consensyssoftware.atlassian.net/browse/SWAPS-3972, https://consensyssoftware.atlassian.net/browse/SWAPS-3973

Manual testing steps

Ensure the acceptance criteria tests pass.

Screenshots/Recordings

Before

After

Pre-merge author checklist

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.

Note

Medium Risk
Changes user input/confirmation UI flow for swaps/bridge amounts and updates many tests, which can impact core transaction initiation behavior if edge cases (focus/close/refresh states) are missed.

Overview
Updates BridgeView to use the new SwapsKeypad bottom-sheet experience: keypad is opened/closed via refs, closes on outside tap, and can show either GaslessQuickPickOptions (when amount is empty/0) or a confirm CTA inside the keypad.

Adjusts layout/styling to accommodate the bottom sheet (e.g., quote area alignment and new keypadBottomSheet styles) and adds a new test id CONFIRM_BUTTON_KEYPAD.

Refactors and trims BridgeView tests to match the new UI behavior (keypad rendered outside the scroll view, confirm button may appear in multiple places, mock reset to avoid leakage), and removes several now-obsolete validation/continue-button test cases.

Written by Cursor Bugbot for commit a9afae9. This will update automatically on new commits. Configure here.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Feb 10, 2026

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-commenter
Copy link
Copy Markdown

codecov-commenter commented Feb 11, 2026 •
edited
Loading

Codecov Report

❌ Patch coverage is 94.16058% with 8 lines in your changes missing coverage. Please review.
✅ Project coverage is 81.13%. Comparing base (8930bc1) to head (a9afae9).
⚠️ Report is 23 commits behind head on main.

Files with missing lines Patch % Lines
...pp/components/UI/Bridge/Views/BridgeView/index.tsx 83.33% 4 Missing ⚠️
.../UI/Bridge/components/SwapsConfirmButton/index.tsx 95.45% 0 Missing and 2 partials ⚠️
...ponents/UI/Bridge/components/SwapsKeypad/index.tsx 94.73% 1 Missing ⚠️
...ents/UI/Bridge/components/TokenInputArea/index.tsx 80.00% 1 Missing ⚠️
Additional details and impacted files 
@@            Coverage Diff             @@
##             main   #25845      +/-   ##
==========================================
- Coverage   81.14%   81.13%   -0.01%     
==========================================
  Files        4390     4391       +1     
  Lines      113425   113421       -4     
  Branches    24383    24348      -35     
==========================================
- Hits        92035    92029       -6     
- Misses      15000    15012      +12     
+ Partials     6390     6380      -10

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@GeorgeGkas GeorgeGkas marked this pull request as ready for review February 11, 2026 15:11
@GeorgeGkas GeorgeGkas requested a review from a team as a code owner February 11, 2026 15:11
cursor[bot]
cursor bot reviewed Feb 11, 2026
View reviewed changes
Copy link
Copy Markdown

@cursor cursor bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 1 potential issue.

infiniteflower
infiniteflower reviewed Feb 11, 2026
View reviewed changes
Copy link
Copy Markdown
Contributor

@infiniteflower infiniteflower left a comment •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Small thing I noticed, but when you switch tokens, the keyboard pops in and out.

Screen.Recording.2026-02-11.at.2.54.30.PM.mov

infiniteflower
infiniteflower previously approved these changes Feb 11, 2026
View reviewed changes
@GeorgeGkas GeorgeGkas added the team-swaps-and-bridge Swaps and Bridge team label Feb 12, 2026
ghgoodreau
ghgoodreau previously approved these changes Feb 12, 2026
View reviewed changes
@davibroc davibroc requested a review from a team as a code owner February 13, 2026 02:32
@davibroc davibroc requested a review from ghgoodreau February 13, 2026 06:43
@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Feb 13, 2026

🔍 Smart E2E Test Selection

  • Selected E2E tags: SmokeTrade, SmokeConfirmations
  • Selected Performance tags: @PerformanceSwaps
  • Risk Level: high
  • AI Confidence: 92%
click to see 🤖 AI reasoning details

E2E Test Selection:
This PR introduces significant UI/UX changes to the Bridge/Swap flow in MetaMask Mobile:

  1. Major BridgeView Refactoring: The keypad is now rendered in a BottomSheetDialog instead of inline, with new ref-based open/close control. This fundamentally changes how users interact with the swap/bridge amount entry.

  2. New Components Extracted:

    • SwapsKeypad: New component wrapping keypad in BottomSheetDialog
    • SwapsConfirmButton: Extracted confirm button logic from BridgeView
    • GaslessQuickPickOptions: New percentage quick pick buttons
    • New hooks: useBridgeViewOnFocus and useRenderQuoteExpireModal

  3. E2E Test Infrastructure Updates:

    • QuoteView page object: Added tapSourceAmountInput(), dismissKeypad() methods
    • Updated selectors for new UI elements (RATE, KEYPAD_DELETE_BUTTON)
    • Shared setupSpotPricesMock function for swap/bridge tests
    • Global setupAccountsV2SupportedNetworksMock added to MockServerE2E
    • New bridge API mock for getTxStatus

  4. E2E Test Spec Changes:

    • bridge-action-smoke.spec.ts: Updated flow to tap source input, enter amount, dismiss keypad before confirming
    • gasless-swap.spec.ts: Updated assertions and added spot prices mock
    • swap-deeplink-smoke.spec.ts: Updated to use new selectors
    • gas-fee-tokens-eip-7702.spec.ts: Updated gas fee token selection assertions

SmokeTrade is required because:

  • Bridge and swap functionality tests are directly affected
  • The test specs in tests/smoke/swap/ are modified
  • The UI flow for entering amounts and confirming swaps/bridges has changed

SmokeConfirmations is required because:

  • The gas-fee-tokens-eip-7702.spec.ts test is modified
  • Per tag description, swap/bridge flows require confirmations
  • The SwapsConfirmButton component handles transaction submission

Performance Test Selection:
The changes significantly modify the swap/bridge UI flow, including moving the keypad to a BottomSheetDialog and extracting components. This could impact swap flow performance due to: 1) New BottomSheetDialog rendering for keypad, 2) Component extraction may affect render cycles, 3) New hooks (useBridgeViewOnFocus, useRenderQuoteExpireModal) add lifecycle effects. The @PerformanceSwaps tag should verify that swap execution times and quote fetching remain performant with the new UI architecture.

View GitHub Actions results

@sonarqubecloud
Copy link
Copy Markdown

sonarqubecloud bot commented Feb 13, 2026

Quality Gate Passed Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
96.2% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

@GeorgeGkas GeorgeGkas enabled auto-merge February 13, 2026 10:50
@GeorgeGkas GeorgeGkas added this pull request to the merge queue Feb 13, 2026
Merged via the queue into main with commit 0ee626e Feb 13, 2026
91 of 92 checks passed
@GeorgeGkas GeorgeGkas deleted the new-swaps-keypad branch February 13, 2026 11:13
@github-actions github-actions bot locked and limited conversation to collaborators Feb 13, 2026
@metamaskbot metamaskbot added the release-7.67.0 Issue or pull request that will be included in release 7.67.0 label Feb 13, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Reviewers

@cursor cursor[bot] cursor[bot] left review comments

@davibroc davibroc davibroc approved these changes

@SteP-n-s SteP-n-s SteP-n-s approved these changes

@infiniteflower infiniteflower Awaiting requested review from infiniteflower

@ghgoodreau ghgoodreau Awaiting requested review from ghgoodreau

Assignees

No one assigned

Labels

release-7.67.0 Issue or pull request that will be included in release 7.67.0 size-XL team-swaps-and-bridge Swaps and Bridge team

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

7 participants

@GeorgeGkas @codecov-commenter @davibroc @ghgoodreau @infiniteflower @SteP-n-s @metamaskbot