chore: update ways to earn supported networks

[sophieqgu]

Description

https://consensyssoftware.atlassian.net/browse/RWDS-753
Add Monad as supported network in Rewards Ways to Earn bottom sheet

Changelog

CHANGELOG entry: Add Monad as supported network in Rewards Ways to Earn

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

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.

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

Adds MONAD to supported swap networks and switches list item keys to chainId in Rewards Ways to Earn.

• Rewards UI – Supported Networks (app/components/UI/Rewards/components/Tabs/OverviewTab/WaysToEarn/SwapSupportedNetworksSection.tsx)
  • Add NETWORKS_CHAIN_ID.MONAD to SWAP_SUPPORTED_CHAIN_IDS.
  • Use stable React keys by switching list item key from index to network.chainId when rendering supportedNetworks.

^{Written by Cursor Bugbot for commit fc81a1e. 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: SmokeRewards
• Risk Level: low
• AI Confidence: 85%

click to see 🤖 AI reasoning details

The changed file SwapSupportedNetworksSection.tsx is a UI component within the Rewards feature that displays a list of supported networks for earning rewards through swaps.

Analysis of the change:

1. File Context: This is a component under app/components/UI/Rewards/components/Tabs/OverviewTab/WaysToEarn/ which is specifically for displaying information about ways to earn rewards.

2. Component Function: The component shows network information (name, avatar, and optional boost badge like "+100%" for Linea) for networks that support earning rewards through swaps. It includes networks like Ethereum Mainnet, Linea, Optimism, BSC, Polygon, Base, Arbitrum, Solana, Avalanche, zkSync Era, Sei, and Monad.

3. Usage: The component is imported and used in WaysToEarn.tsx component, specifically displayed within the bottom sheet modal when users tap on the "Swaps" way to earn. It's a read-only informational component showing supported networks.

4. No Git Diff Available: While I couldn't retrieve the git diff, reading the file shows it's a self-contained UI component that:

   • Displays network information from selectors
   • Shows which networks support rewards for swaps
   • Has special handling for displaying a boost badge for Linea Mainnet
   • Fallbacks to PopularList if network config is missing

5. Test Coverage: There's an E2E test file at e2e/specs/rewards/rewards.spec.ts with the @SmokeRewards tag that tests the rewards feature including onboarding and activity display.

Impact Assessment:

• Direct Impact: Rewards UI - specifically the information displayed about supported swap networks
• User Impact: Low - This is an informational display component within a modal that shows network support
• Risk Level: Low - The component is isolated to the Rewards feature and doesn't affect core functionality like actual swapping or network switching

Tag Selection Rationale:

• SmokeRewards: Selected because this is a Rewards feature component and existing E2E tests cover rewards functionality
• Not SmokeSwaps: While related to swaps conceptually (it shows swap-supported networks), this is purely informational UI within the Rewards feature, not affecting actual swap functionality
• Not SmokeNetworkExpansion: Though it lists networks, it's not changing network configuration or adding new networks to the wallet

The change is contained within the Rewards feature area and warrants testing the Rewards smoke tests to ensure the UI displays correctly.

View GitHub Actions results

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

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

See analysis details on SonarQube Cloud