Description

Extends the predictMarketHighlights remote feature flag to accept series IDs in addition to market IDs, and renders series-resolved crypto up/down highlights in horizontally-scrolling carousels via a new compact card variant.

Why

Recurring crypto up/down markets (e.g. "BTC Up or Down — 5 Minutes") expose a new market every N minutes. A market-ID pin in predictMarketHighlights therefore goes stale within a single time slot — once the market resolves, the pin disappears, and there is no way to express "always pin the currently-live BTC Up/Down 5m market." Resolving from a series at request time fixes this: the pin automatically rotates to whatever slot is live when the feed is fetched.

Schema change (additive, backward compatible)

export interface PredictMarketHighlight {
  category: string;
  markets?: string[]; // was required, now optional
  series?: string[];  // NEW
}

• Existing LD flag values that only use markets continue to work unchanged. Both fields are now optional; entries with neither are skipped.
• The controller's highlight block fetches getMarketsByIds(markets) and getMarketSeries(seriesId) in parallel via Promise.all, then resolves each series response to its currently-live market via the existing findLiveMarket() (with findNearestMarket() as a fallback when no future market is in the fetch window).
• Resolved series markets pass through the same status === 'open' filter and are marked with isHighlighted: true, identical to the market-ID path.
• Order: market-ID highlights are prepended first, then series-resolved highlights, then the regular feed. Existing flag values that only use markets keep their original ordering. Dedupe is unified across both paths so a market reachable via both markets and series appears exactly once.

Compact carousel variant

PredictCryptoUpDownMarketCard now has two render variants, keyed off the existing isCarousel prop that PredictMarket forwards to its sibling cards (PredictMarketSingle, PredictMarketMultiple, PredictMarketSportCard):

• Full (isCarousel=false, the default) — the existing sparkline + target-line / target-price treatment used on PredictFeed, PredictHome, the wallet home carousel, and search.
• Compact (isCarousel=true) — drops the sparkline and target labels and switches to a height: 100% + flex-column + justifyContent: 'space-between' layout that mirrors PredictMarketSingle / PredictMarketMultiple so the card sits flush with its neighbours in HorizontalCarousel. This is the variant the 5 TrendingView carousel tabs (Now, Macro, RWAs, Crypto, Sports) render for series-resolved highlights.

The compact path also gates useCryptoUpDownChartData and useCryptoTargetPrice with enabled: !isCompact, so the chart historical fetch and live-price websocket subscription don't run for cards that never display them.

Resilience

• Per-series fetch failures are caught locally with a DevLogger.log, so one unhealthy series entry can't take down a healthy batch.
• The series fetch reuses the canonical SERIES_MAX_EVENTS (50) for limit. The provider returns markets in endDate ASC order, and a fast recurrence (5m) can produce ~12 past events inside the past buffer alone — too low a limit would clip the live slot.
• getMarketsByIds keeps its existing fail-hard contract; the previously misleading test "handles getMarketsByIds failure gracefully" (which actually only tested an empty-array result) was renamed accordingly, and a real rejection-propagation test was added.

Test coverage

• 8 new tests in PredictController.test.ts (live-market resolution, mixed markets+series ordering, nearest-market fallback, empty-series skip, closed-market status filter, throw-silent on single series, partial-batch failure, dedupe across paths)
• 1 shape-passthrough test in resolvePredictFeatureFlags.test.ts
• 4 new tests in PredictCryptoUpDownMarketCard.test.tsx covering the compact variant (sparkline not rendered, both chart queries gated with enabled: false, compact skeleton renders, buy sheet still opens)
• All tests in the touched suites pass.

Changelog

CHANGELOG entry: Added support for pinning the currently-live market of a recurring series (e.g. BTC Up/Down 5m) via the predictMarketHighlights remote feature flag.

Related issues

Fixes: PRED-950

Manual testing steps

Both scenarios assume the predictMarketHighlights LaunchDarkly variation is updated to the new shape. The series ID 10684 corresponds to the Polymarket Gamma BTC Up/Down 5m series (also hardcoded as BTC_UP_DOWN_5M_SERIES_ID in app/components/UI/Predict/constants/btcUpDown5mSeries.ts).

Feature: Series-id highlights in predictMarketHighlights

  Scenario: A series-id highlight resolves to the currently-live market on PredictFeed
    Given the predictMarketHighlights flag is set to
      """
      {
        "enabled": true,
        "minimumVersion": "7.63.0",
        "highlights": [
          { "category": "crypto", "series": ["10684"] }
        ]
      }
      """
    When the user opens the Predict tab and switches to the "Crypto" feed tab
    Then the currently-live BTC Up/Down 5m market is pinned at the top of the feed
    And the pin auto-rotates to the next live slot when the current one resolves
    And the card renders in the full variant (with sparkline + target labels)

  Scenario: A series-id highlight renders the compact variant in TrendingView carousels
    Given the same flag configuration as above
    When the user opens the Explore page and views the "Crypto" or "Now" tab carousel
    Then the BTC Up/Down series card IS pinned in the Explore carousel
    And it renders as the compact variant (no sparkline, same height as its neighbours)
    And no chart-history fetch or live-price websocket subscription is opened for that card

  Scenario: Existing market-id highlights are unaffected
    Given the predictMarketHighlights flag is set to
      """
      {
        "enabled": true,
        "highlights": [
          { "category": "trending", "markets": ["451614"] }
        ]
      }
      """
    When the user opens PredictFeed → Trending and Explore → Now
    Then market 451614 is pinned at the top on both surfaces (market-id path is unchanged)

Screenshots/Recordings

Before

N/A

After

N/A

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
  • Ideally on a mid-range device; emulator is acceptable
• I've tested with a power user scenario
  • 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
  • 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.