perf(predict): use stable sports market keys

[ghgoodreau]

Description

The Trending SportsTab FlashList used each market's array index as its key. Refreshing or reordering the paginated live feed could therefore bind an existing key to a different market, causing unnecessary re-renders and incorrect cell recycling.

The key now combines the active sport key with the stable market ID. A regression test verifies that a market keeps the same key when its list position changes.

Changelog

CHANGELOG entry: null

Related issues

Fixes: #31318

Manual testing steps

Feature: Stable SportsTab market rows

  Scenario: Sports markets reorder after a refresh
    Given the SportsTab displays a paginated list of prediction markets

    When a market moves to a different list position
    Then its FlashList key remains tied to its market ID

Automated coverage: yarn jest app/components/Views/TrendingView/tabs/SportsTab.test.tsx --runInBand --coverage=false

Screenshots/Recordings

Before

N/A - Internal performance change with no visual output.

After

N/A - Internal performance change with no visual output.

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.

Performance checks (if applicable)

• I've tested on Android
  • N/A: No platform-specific behavior; automated regression coverage validates the change.
  • Ideally on a mid-range device; emulator is acceptable
• I've tested with a power user scenario
  • N/A: This render optimization does not depend on account or token scale.
  • Use these power-user SRPs to import wallets with many accounts and tokens
• I've instrumented key operations with Sentry traces for production performance metrics
  • N/A: No new operation or production trace boundary is introduced.
  • See trace() for usage and addToken for an example

For performance guidelines and tooling, see the Performance Guide.

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

Low Risk
Localized list keying and test-only changes in Trending Sports; no auth, data, or API behavior changes.

Overview
SportsTab’s “All sports” FlashList no longer keys rows by array index. Keys are now all_sports-{active sport}-{market id}, so refresh or pagination reordering does not remap keys to different markets.

A regression test asserts the same market keeps an identical key when its index changes. The test suite describe block was broadened from the predictions carousel-only scope to SportsTab overall.

^{Reviewed by Cursor Bugbot for commit 97b1a83. Bugbot is set up for automated code reviews on this repo. 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: SmokeWalletPlatform, SmokePredictions
• Selected Performance tags: None (no tests recommended)
• Risk Level: low
• AI Confidence: 90%

click to see 🤖 AI reasoning details

E2E Test Selection:
The PR contains two changed files:

1. SportsTab.tsx: A single-line bug fix changing the keyExtractor in a FlashList from index-based (index) to ID-based (item.id) keys. This improves list reconciliation stability when items reorder but has no visible functional impact on user flows.

2. SportsTab.test.tsx: Unit test updates — renames the describe block and adds a new test verifying the keyExtractor behavior.

Impact Assessment:

• The SportsTab is part of the TrendingView, which is covered by SmokeWalletPlatform (Trending discovery tab, Sports section).
• The Sports tab displays prediction markets (Polymarket sports markets), making SmokePredictions relevant since it covers prediction market integration including the Sports section within Trending.
• No shared components (navigation, modals, confirmations, Engine, controllers) are affected.
• No performance-sensitive paths are changed — the keyExtractor fix actually improves list rendering stability.
• Risk is low: isolated change to a list key function with no behavioral changes to user flows.

Tag selection rationale:

• SmokeWalletPlatform: Covers Trending tab where SportsTab lives.
• SmokePredictions: Sports tab shows prediction markets; SmokePredictions description notes changes to Predictions views affect Trending.

No additional dependent tags are required per the tag descriptions for these two tags in this context.

Performance Test Selection:
The change is a single-line keyExtractor fix from index-based to ID-based keys in a FlashList. While this technically improves list reconciliation, it does not introduce any new performance-sensitive code paths, data fetching, or rendering logic that would warrant performance test execution. No performance test tags are applicable.

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