Description

The "Your balance" heading on the Money Hub screen (CashTokensFullView) was rendered between the screen header and the scrollable list, leaving it pinned at the top while content scrolled beneath it. This created a visually disconnected UX between the heading and the list.

The heading is now moved into each scrollable container so it scrolls naturally with the rest of the page:

• Funded path: passed as ListHeaderComponent of the FlashList inside <TokenList>.
• Empty-state path: rendered as the first child of the existing ScrollView.
• Skeleton path: rendered as the first child of the skeleton's ScrollView.

To reach FlashList's header slot from the screen, an additive listHeaderComponent prop was added to <Tokens> and <TokenList>, mirroring the existing listFooterComponent pattern (opt-in, no behavior change for existing callers). A small wrapEdgeNode helper deduplicates the -mx-4 padding-compensation that header and footer both need in isFullView mode.

Note: <Tokens> / <TokenList> belong to the wallet team. Touching them was the minimal way to reach FlashList's header slot — flagging for wallet-team awareness during review.

Changelog

CHANGELOG entry: Fixed a bug where the "Your balance" heading on the Money Hub stayed pinned to the top of the screen instead of scrolling with the content.

Related issues

Fixes: MUSD-779

Manual testing steps

```gherkin
Feature: Money Hub Your balance heading scrolls with content

Scenario: user with mUSD scrolls the Money Hub
Given the user has mUSD balance on at least one chain
And the user is on the Money Hub
When the user scrolls down
Then the "Your balance" heading scrolls off-screen with the rest of the content
When the user scrolls back to the top
Then the "Your balance" heading reappears in flow above the mUSD list

Scenario: user without mUSD scrolls the Money Hub empty state
Given the user has no mUSD balance
And the user is on the Money Hub
When the user scrolls down
Then the "Your balance" heading scrolls off-screen with the empty-state content
```

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.

Performance checks (if applicable)

• I've tested on Android
• I've tested with a power user scenario
• I've instrumented key operations with Sentry traces for production performance metrics

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.