fix: rm network confirmation modal on trending

[sahar-fehri]

Description

PR to remove network confirmation modal on trending flow

Changelog

CHANGELOG entry: Remove the network confirmation modal on trending flow

Related issues

Fixes:

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

Screen.Recording.2026-01-19.at.15.43.00.mov

After

Screen.Recording.2026-01-19.at.15.40.24.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

Removes confirmation UI from trending flow and streamlines navigation; minor Tokens screen lifecycle tweak.

• Trending: Replace NetworkModal flow with direct add via useAddPopularNetwork when a network isn't added; then navigate to Asset. On add failure, do not navigate. Simplifies component state and markup. Tests updated to mock useAddPopularNetwork, await async flows, and cover failure cases.
• Tokens: Use useFocusEffect to force a re-render on screen focus to pick up network changes; refactor conditional rendering into memoized tokenContent for clearer loading/empty/list states.

^{Written by Cursor Bugbot for commit a210d1c. 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.

[cursor]

Cursor Bugbot has reviewed your changes and found 3 potential issues.

[cursor]

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

[cursor]

Cursor Bugbot has reviewed your changes and found 2 potential issues.

[cursor]

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

[cursor]

Missing guard against rapid taps during async operation

Medium Severity

The handlePress callback is now async but lacks protection against rapid consecutive taps. Previously, the modal provided implicit protection — once shown, subsequent taps couldn't trigger navigation. Now, if a user taps rapidly before the first addPopularNetwork completes, multiple async handlers can run in parallel since networkConfigurations[caipChainId] won't reflect the pending addition. This could trigger duplicate addPopularNetwork calls and multiple navigation.navigate calls, potentially causing unexpected UX behavior.

 

[Prithpal-Sooriya]

Is this valid? Should we wrap in a debounce?

[github-actions]

🔍 Smart E2E Test Selection

• Selected E2E tags: SmokeWalletPlatform
• Risk Level: medium
• AI Confidence: 85%

click to see 🤖 AI reasoning details

The changes affect two main areas:

1. Tokens Component (app/components/UI/Tokens/index.tsx): Added a useFocusEffect hook to force re-render when the component comes back into focus, ensuring network changes are picked up when returning from the trending flow. This is a defensive change to ensure proper state synchronization.

2. TrendingTokenRowItem Component: Replaced the NetworkModals confirmation dialog with direct network addition using the useAddPopularNetwork hook. This is a UX change that removes the confirmation step when adding a network from the trending token flow.

The E2E tests in e2e/specs/trending/ are tagged with SmokeWalletPlatform, which covers the trending feature functionality. The changes to the Tokens component are specifically to support the trending flow's network switching behavior.

The risk is medium because:

• The changes modify user-facing behavior (removing confirmation modal)
• The token list refresh logic is modified
• However, the changes are well-scoped and have corresponding unit tests
• The useAddPopularNetwork hook is already used elsewhere in the codebase (NetworkSelector, NetworkMultiSelector)

No other tags are needed as:

• The changes don't affect confirmations, accounts, identity, network abstractions, trade, card, rewards, perps, ramps, predictions, or Flask/Snaps functionality
• The trending feature tests are covered under SmokeWalletPlatform

View GitHub Actions results

[sonarqubecloud]

Quality Gate passed

Issues
3 New issues
0 Accepted issues

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

See analysis details on SonarQube Cloud

[Prithpal-Sooriya]

1 cursor comment:
https://github.com/MetaMask/metamask-mobile/pull/24888/changes#r2705223862