fix(ramp): use ScrollView from react-native-gesture-handler in PaymentMethodSelectorModal

[wachunei]

Description

The ScrollView in PaymentMethodSelectorModal was imported from react-native instead of react-native-gesture-handler, causing the scroll functionality to not work when used inside a BottomSheet component.

This fix changes the import source to use ScrollView from react-native-gesture-handler, which is required for proper gesture handling and scrolling within bottom sheets that use gesture handlers.

Changelog

CHANGELOG entry: Fixed payment method selector modal scroll not working

Related issues

Fixes:

Manual testing steps

Feature: Payment Method Selector Modal Scrolling

  Scenario: user scrolls through payment methods in the modal
    Given the user is on the Buy/Sell flow with multiple payment methods available
    
    When user opens the payment method selector modal
    And user scrolls down through the list of payment methods
    Then the list should scroll smoothly
    And all payment methods should be accessible via scrolling

Screenshots/Recordings

Before

pm_before.mov

After

pm_after.mov

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.

---

Note

Switches PaymentMethodSelectorModal to use ScrollView from react-native-gesture-handler and updates snapshots accordingly.

• Ramp UI:
  • Replace ScrollView import in app/components/UI/Ramp/Aggregator/components/PaymentMethodSelectorModal/PaymentMethodSelectorModal.tsx from react-native to react-native-gesture-handler for proper scrolling inside BottomSheet.
• Tests:
  • Update snapshots in .../PaymentMethodSelectorModal/__snapshots__/PaymentMethodSelectorModal.test.tsx.snap to reflect RCTScrollView gesture-handler props.

^{Written by Cursor Bugbot for commit 30a37e0. This will update automatically on new commits. Configure here.}

[github-actions]

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.

[github-actions]

🔍 Smart E2E Test Selection

• Selected E2E tags: SmokeRamps
• Risk Level: low
• AI Confidence: 90%

click to see 🤖 AI reasoning details

The change is a simple import swap - switching ScrollView from 'react-native' to 'react-native-gesture-handler'. This is a common fix for gesture handling issues when ScrollView is nested inside modals that use gesture handlers. The change is in the PaymentMethodSelectorModal component which is part of the Ramp/Aggregator flow (on/off ramp - buy/sell crypto functionality).

The snapshot changes confirm this is purely a UI implementation detail change - the new ScrollView adds gesture handler props (handlerTag, handlerType, onGestureHandlerEvent, onGestureHandlerStateChange) but the visual output and functionality remain the same.

This is a low-risk change because:

1. It's a well-known pattern for fixing scroll issues in modals
2. The snapshot tests already pass (updated snapshots)
3. The change is isolated to a single modal component
4. No business logic is affected

Only SmokeRamps tag is needed as this directly affects the ramp (buy/sell) payment method selection flow.

View GitHub Actions results

[wachunei]

bugbot run

[cursor]

✅ Bugbot reviewed your changes and found no bugs!

---

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

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

See analysis details on SonarQube Cloud