…hart overlap on tab switch cp-7.81.0 (#31436)

## **Description**

<!-- mms-check: type=text required=true -->

This PR makes the Predict **game details** screen
(`PredictGameDetailsContent`) behave like the standard
`PredictMarketDetails` screen when switching between outcome-group chips
(game lines / exact score / halftime) or the Positions/Outcomes tabs. It
fixes two visual issues:

1. **Screen jumping on tab/chip change.** The component drove an
imperative `scrollTo` on every chip selection (plus a follow-up
`InteractionManager.runAfterInteractions` pass) to force the sticky
header to the top, propped up by a `windowHeight`-based `minHeight` on
the tab content. This caused the screen to jump downward on every
switch. The regular market details screen never does this — it relies
solely on the `ScrollView`'s `stickyHeaderIndices`. Removed the manual
scroll machinery (`scrollRef`, `stickyHeaderY`, `pendingChipScroll`, the
layout handler, and the effect) and the `minHeight` wrapper, so
switching chips/tabs now only swaps the content below the sticky header
and preserves scroll position.

2. **Chart overlapping the outcomes.** `PredictGameChartContent` used
`flex-1` on its loaded/error/empty containers. Inside a `ScrollView`,
`flex-1` collapses to zero height, so the fixed 200px chart `View`
overflowed downward onto the chip bar and the first outcome card.
Switched the containers to `w-full` so they size to their content —
matching the market details chart (`PredictDetailsChart`), which never
used `flex-1`.

Both changes are layout-only. Existing unit tests for `PredictGameChart`
and `PredictGameDetailsContent` (218 tests) pass unchanged, including
the `reserves chart height only while loading` test.

## **Changelog**

<!-- mms-check: type=changelog required=true -->

CHANGELOG entry: Fixed the Predict sports game details screen jumping
and the price chart overlapping the outcomes when switching between
markets

## **Related issues**

<!-- mms-check: type=issue-link required=true -->

Fixes: https://consensyssoftware.atlassian.net/browse/PRED-954

## **Manual testing steps**

<!-- mms-check: type=manual-testing required=true -->

```gherkin
Feature: Predict game details market/tab switching

  Scenario: Switching outcome-group chips does not jump or overlap the chart
    Given I open a sports game market with extended outcomes (e.g. game lines, exact score, halftime)
    And the price chart has loaded above the chip bar

    When I tap a different chip (e.g. "Exact Score")
    Then the screen does not jump to pin the chip bar to the top
    And the chart keeps its height and does not overlap the outcomes list
    And the outcomes for the selected chip render below the chip bar

  Scenario: Switching Positions/Outcomes tabs preserves scroll position
    Given I open a sports game market that shows the Positions/Outcomes tab bar

    When I switch between the Positions and Outcomes tabs
    Then the scroll position is preserved (no downward jump)
    And the chart does not overlap any content
```

## **Screenshots/Recordings**

<!-- mms-check: type=screenshot required=true -->

### **Before**

<!-- Attach the recording showing the screen jumping on tab/chip change
and the chart overlapping the first outcome card (e.g. "Mexico 0 - 3
South Africa"). -->

### **After**


https://github.com/user-attachments/assets/ce638894-f133-40ce-89c8-77b4d38868cc

<!-- Attach a recording switching between chips/tabs with no downward
jump and no chart overlap. -->

## **Pre-merge author checklist**

<!-- mms-check: type=checklist required=true -->

- [x] I've followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile
Coding
Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [x] I've completed the PR template to the best of my ability
- [x] I've included tests if applicable
- [x] I've documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [x] I've applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

#### Performance checks (if applicable)

- [x] I've tested on Android
  - Ideally on a mid-range device; emulator is acceptable
- [x] I've tested with a power user scenario
- Use these [power-user
SRPs](https://consensyssoftware.atlassian.net/wiki/spaces/TL1/pages/edit-v2/401401446401?draftShareId=9d77e1e1-4bdc-4be1-9ebb-ccd916988d93)
to import wallets with many accounts and tokens
- [x] I've instrumented key operations with Sentry traces for production
performance metrics
- See [`trace()`](/app/util/trace.ts) for usage and
[`addToken`](/app/components/Views/AddAsset/components/AddCustomToken/AddCustomToken.tsx#L274)
for an example

For performance guidelines and tooling, see the [Performance
Guide](https://consensyssoftware.atlassian.net/wiki/spaces/TL1/pages/400085549067/Performance+Guide+for+Engineers).

## **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.

<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> **Low Risk**
> Layout-only Tailwind and scroll wiring changes in Predict game details
UI with no auth, data, or business-logic impact.
> 
> **Overview**
> Fixes Predict **game details** layout when users switch outcome chips
or Positions/Outcomes tabs.
> 
> **Game details scroll behavior:** Removes imperative `scrollTo` on
chip change (`scrollRef`, `stickyHeaderY`, `pendingChipScroll`, layout
measurement, and `InteractionManager` follow-up) and drops the
`windowHeight`-based `minHeight` wrapper around tab content. Chip
selection now calls `handleChipSelect` directly, relying on `ScrollView`
`stickyHeaderIndices` like standard market details so scroll position is
preserved and the screen no longer jumps.
> 
> **Chart in `ScrollView`:** In `PredictGameChartContent`, replaces
`flex-1` with `w-full` on loaded, error, and empty chart containers so
height follows content instead of collapsing inside the scroll view,
preventing the fixed-height chart from overlapping the chip bar and
outcome list.
> 
> <sup>Reviewed by [Cursor Bugbot](https://cursor.com/bugbot) for commit
b15f4a1. Bugbot is set up for automated
code reviews on this repo. Configure
[here](https://www.cursor.com/dashboard/bugbot).</sup>
<!-- /CURSOR_SUMMARY -->