fix(ramps): ensure Buy tokens load on token selection screen on fresh install cp-7.68.0 (MetaMask#26952)

## **Description**

**Problem:** When users tap Buy and reach Token Selection (non-V2)
before geolocation and smart routing have run, the screen can show a
blank or incorrect state because `detectedGeolocation` and
`rampRoutingDecision` are not yet set. Previously, these ran only when
the FiatOrders component mounted (e.g. when the user entered a Ramp
flow), which could be too late.

**Solution:** Introduce a **RampsBootstrap** component that runs at app
root as soon as the app mounts:

1. **RampsBootstrap** (`app/components/UI/Ramp/RampsBootstrap.tsx`) –
New component that runs three hooks at app root:
   - `useDetectGeolocation()` – detect user region
- `useRampsSmartRouting()` – set ramp routing decision (AGGREGATOR /
DEPOSIT / etc.)
- `useHydrateRampsController()` – when V2 is enabled, ensure controller
init/hydrate runs early

2. **App.tsx** – Mount `<RampsBootstrap />` at the root (direct import
from `Ramp/RampsBootstrap`). Marked with a TODO to remove once V2 flag
is on for all users.

3. **Ramp index (FiatOrders)** – Remove the three hook calls
(`useDetectGeolocation`, `useRampsSmartRouting`,
`useHydrateRampsController`) from `FiatOrders` so they run only once at
app root in RampsBootstrap. `FiatOrders` continues to run
`useFetchRampNetworks()` and order polling.

By the time the user reaches Buy → Token Selection, geolocation and
routing are usually already set, improving non-V2 behavior.

## **Changelog**

CHANGELOG entry: Run Ramps geolocation, smart routing, and controller
hydrate at app root via RampsBootstrap so Token Selection (non-V2) has
region and routing ready sooner.

## **Related issues**

Fixes: MetaMask#26699

## **Manual testing steps**

```gherkin
Feature: Ramps bootstrap at app root

  Scenario: User opens app and navigates to Buy Token Selection (non-V2)
    Given the app has just started

    When the user taps Buy and reaches the Select token screen
    Then geolocation and smart routing have already run (bootstrap at app root)
    And the token list loads according to region and routing (no blank/empty due to missing geolocation)

  Scenario: V2 flow still works
    Given Ramps V2 is enabled

    When the user goes to Buy and Token Selection
    Then tokens load (Engine init plus bootstrap hydrate as before)
```

## **Screenshots/Recordings**

<div>
<a href="https://www.loom.com/share/b7b90cdc4a6645719d2bae04f28c2e3d">
      <p>Fix buy token loading issue - 26699 - Watch Video</p>
    </a>
<a href="https://www.loom.com/share/b7b90cdc4a6645719d2bae04f28c2e3d">
<img style="max-width:300px;"
src="https://cdn.loom.com/sessions/thumbnails/b7b90cdc4a6645719d2bae04f28c2e3d-c643ea7310eb57da-full-play.gif#t=0.1">
    </a>
  </div>
  
## **Pre-merge author checklist**

- [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
- [ ] 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.

## **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]
> **Medium Risk**
> Moves ramp bootstrap hooks (geolocation, smart routing, controller
hydration) to run at app startup, which can affect ramp availability
decisions and controller init timing across sessions. Risk is moderate
due to new side effects on app mount and potential extra network calls,
but changes are localized and covered by tests.
> 
> **Overview**
> Ensures ramp prerequisites are initialized *as soon as the app mounts*
by introducing `RampsBootstrap`, which runs geolocation detection, smart
routing, and ramps controller hydration and renders `null`.
> 
> Mounts `RampsBootstrap` at the `App` root (with a TODO to remove once
V2 is fully rolled out) and removes the same hook calls from
`FiatOrders`, preventing late/duplicate initialization when users reach
non-V2 Buy token selection. Adds unit tests for `RampsBootstrap` and
updates existing app/ramp tests to mock the new root-level component.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
0013f0e. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

Author: amitabh94

app/components/Nav/App/App.test.tsx

@@ -57,6 +57,8 @@ jest.mock('../../UI/Predict/hooks/usePredictToastRegistrations', () => ({
   usePredictToastRegistrations: jest.fn().mockReturnValue([]),
 }));
 
+jest.mock('../../UI/Ramp/RampsBootstrap', () => () => null);
+
 jest.mock('expo-sensors', () => ({
   Accelerometer: {
     setUpdateInterval: jest.fn(),

app/components/Nav/App/App.tsx

@@ -126,6 +126,7 @@ import ConfirmTurnOnBackupAndSyncModal from '../../UI/Identity/ConfirmTurnOnBack
 import AddNewAccountBottomSheet from '../../Views/AddNewAccount/AddNewAccountBottomSheet';
 import EligibilityFailedModal from '../../UI/Ramp/components/EligibilityFailedModal';
 import RampUnsupportedModal from '../../UI/Ramp/components/RampUnsupportedModal';
+import RampsBootstrap from '../../UI/Ramp/RampsBootstrap';
 import SwitchAccountTypeModal from '../../Views/confirmations/components/modals/switch-account-type-modal';
 import { AccountDetails } from '../../Views/MultichainAccounts/AccountDetails/AccountDetails';
 import { AccountGroupDetails } from '../../Views/MultichainAccounts/AccountGroupDetails/AccountGroupDetails';
@@ -1168,6 +1169,8 @@ const App: React.FC = () => {
 
   return (
     <WebSocketHealthToastProvider>
+      {/* TODO: Temporary fix for non-V2 Buy token selection; remove RampsBootstrap once V2 flag is on for all users. */}
+      <RampsBootstrap />
       <AppFlow />
       <Toast ref={toastRef} />
       <PerpsWebSocketHealthToast />

app/components/UI/Ramp/RampsBootstrap.test.tsx

@@ -0,0 +1,52 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import RampsBootstrap from './RampsBootstrap';
+
+const mockUseDetectGeolocation = jest.fn();
+const mockUseRampsSmartRouting = jest.fn();
+const mockUseHydrateRampsController = jest.fn();
+
+jest.mock('./hooks/useDetectGeolocation', () => ({
+  __esModule: true,
+  default: (...args: unknown[]) => mockUseDetectGeolocation(...args),
+}));
+
+jest.mock('./hooks/useRampsSmartRouting', () => ({
+  __esModule: true,
+  default: (...args: unknown[]) => mockUseRampsSmartRouting(...args),
+}));
+
+jest.mock('./hooks/useHydrateRampsController', () => ({
+  __esModule: true,
+  default: (...args: unknown[]) => mockUseHydrateRampsController(...args),
+}));
+
+describe('RampsBootstrap', () => {
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('calls useDetectGeolocation on mount', () => {
+    render(<RampsBootstrap />);
+
+    expect(mockUseDetectGeolocation).toHaveBeenCalledTimes(1);
+  });
+
+  it('calls useRampsSmartRouting on mount', () => {
+    render(<RampsBootstrap />);
+
+    expect(mockUseRampsSmartRouting).toHaveBeenCalledTimes(1);
+  });
+
+  it('calls useHydrateRampsController on mount', () => {
+    render(<RampsBootstrap />);
+
+    expect(mockUseHydrateRampsController).toHaveBeenCalledTimes(1);
+  });
+
+  it('renders null', () => {
+    const { toJSON } = render(<RampsBootstrap />);
+
+    expect(toJSON()).toBeNull();
+  });
+});

app/components/UI/Ramp/RampsBootstrap.tsx

@@ -0,0 +1,21 @@
+import useDetectGeolocation from './hooks/useDetectGeolocation';
+import useHydrateRampsController from './hooks/useHydrateRampsController';
+import useRampsSmartRouting from './hooks/useRampsSmartRouting';
+
+/**
+ * Ramps app bootstrap: runs geolocation detection, smart routing, and controller
+ * hydration as soon as the app mounts so that by the time the user reaches Buy →
+ * Token Selection (non-V2), detectedGeolocation and rampRoutingDecision are
+ * often already set.
+ *
+ * V2: RampsController is initialized by Engine (rampsControllerInit); no UI
+ * init. Mount at app root.
+ */
+function RampsBootstrap(): null {
+  useDetectGeolocation();
+  useRampsSmartRouting();
+  useHydrateRampsController();
+  return null;
+}
+
+export default RampsBootstrap;

app/components/UI/Ramp/index.test.tsx

@@ -14,11 +14,6 @@ import getAggregatorAnalyticsPayload from './Aggregator/utils/getAggregatorAnaly
 
 const mockNavigate = jest.fn();
 
-jest.mock('./hooks/useHydrateRampsController', () => ({
-  __esModule: true,
-  default: jest.fn(),
-}));
-
 jest.mock('@react-navigation/native', () => {
   const actual = jest.requireActual('@react-navigation/native');
   return {

app/components/UI/Ramp/index.tsx

@@ -33,9 +33,6 @@ import stateHasOrder from './utils/stateHasOrder';
 import Routes from '../../../constants/navigation/Routes';
 import getOrderAnalyticsPayload from './utils/getOrderAnalyticsPayload';
 import { NativeRampsSdk } from '@consensys/native-ramps-sdk';
-import useDetectGeolocation from './hooks/useDetectGeolocation';
-import useHydrateRampsController from './hooks/useHydrateRampsController';
-import useRampsSmartRouting from './hooks/useRampsSmartRouting';
 import { RampsOrderStatus } from '@metamask/ramps-controller';
 import { isRampsUnifiedV2Enabled } from './utils/isRampsUnifiedV2Enabled';
 import { showV2OrderToast } from './utils/v2OrderToast';
@@ -141,10 +138,7 @@ const styles = StyleSheet.create({
 });
 
 function FiatOrders() {
-  useHydrateRampsController();
   useFetchRampNetworks();
-  useDetectGeolocation();
-  useRampsSmartRouting();
   const dispatch = useDispatch();
   const dispatchThunk = useThunkDispatch();
   const navigation = useNavigation();