fix(ramps): use asset chainId to fetch correct token balance in useBalance cp-7.61.0 (MetaMask#23719)

## **Description**

The `useBalance` hook in the Ramp Aggregator was using
`selectContractBalances`, which returns token balances only for the
**currently selected network**. This caused incorrect behavior.

**Solution:** Changed the hook to use `selectContractBalancesPerChainId`
and access the correct chain's balances using the `asset.chainId`
parameter that is already passed to the hook.

## **Changelog**

CHANGELOG entry: Fixed incorrect token balance check in Ramp when
selecting tokens from non-active networks

## **Related issues**

Fixes:
https://consensyssoftware.atlassian.net/browse/TRAM-2875?atlOrigin=eyJpIjoiNDE5YjQ4YjQ3NGRkNGUzMGFkODUxNjI0M2QxMzlkNjUiLCJwIjoiaiJ9

Fixes MetaMask#23722

## **Manual testing steps**

```gherkin
Feature: Ramp token balance check

  Scenario: user sells USDC on Arbitrum while connected to different network
    Given user has 40 USDC on Arbitrum
    And user's wallet is connected to Mainnet

    When user navigates to Sell flow in Ramp
    And user selects USDC on Arbitrum as the asset to sell
    And user enters an amount less than their balance (e.g. 22)
    Then the "this amount is higher than your balance" error should NOT appear
    And the balance should correctly reflect the Arbitrum USDC balance
```

## **Screenshots/Recordings**

### **Before**

`balanceBN` was `null` for tokens on non-active networks, causing false
insufficient balance errors.
(quick amount selector isn't shown because amount is not being detected)
<img width="300" alt="image"
src="https://github.com/user-attachments/assets/6c45f7b0-f5d6-4dd5-a413-350a3fa2bf3f"
/>

### **After**

`balanceBN` correctly reflects the token balance on the asset's chain
regardless of the currently active network.

<img width="300" alt="image"
src="https://github.com/user-attachments/assets/987d5eba-e430-4a1a-b678-850a40259373"
/>


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

## **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]
> Compute token balances from the asset’s chain using per-chain
balances, fixing incorrect balances when the active network differs.
> 
> - **Ramp Aggregator `useBalance`**
(`app/components/UI/Ramp/Aggregator/hooks/useBalance.ts`):
> - Switch to `selectContractBalancesPerChainId` and index by the
asset’s `chainId` (via `toHex`) to retrieve correct per-chain ERC-20
balances.
> - Update balance computations (`balance`, `balanceBN`, `balanceFiat`)
to use chain-scoped balances and existing exchange rates.
> - Ensure native balance lookup uses `accountsByChainId[hexChainId]`
guard for the asset’s chain.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
2fa36f1. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

Co-authored-by: Pedro Pablo Aste Kompen <wachunei@gmail.com>

Author: AxelGes

app/components/UI/Ramp/Aggregator/hooks/useBalance.ts

@@ -6,7 +6,7 @@ import {
   selectCurrentCurrency,
 } from '../../../../../selectors/currencyRateController';
 import { selectSelectedInternalAccountFormattedAddress } from '../../../../../selectors/accountsController';
-import { selectContractBalances } from '../../../../../selectors/tokenBalancesController';
+import { selectContractBalancesPerChainId } from '../../../../../selectors/tokenBalancesController';
 import { selectContractExchangeRates } from '../../../../../selectors/tokenRatesController';
 import { safeToChecksumAddress } from '../../../../../util/address';
 import {
@@ -52,7 +52,7 @@ export default function useBalance(asset?: Asset) {
   const conversionRate = useSelector(selectConversionRate);
   const currentCurrency = useSelector(selectCurrentCurrency);
   const tokenExchangeRates = useSelector(selectContractExchangeRates);
-  const balances = useSelector(selectContractBalances);
+  const balancesPerChainId = useSelector(selectContractBalancesPerChainId);
 
   if (!asset || (!asset.address && !asset.assetId) || !selectedAddress) {
     return defaultReturn;
@@ -99,10 +99,13 @@ export default function useBalance(asset?: Asset) {
   } else if (asset.address) {
     const assetAddress = safeToChecksumAddress(asset.address);
     const exchangeRate = tokenExchangeRates?.[assetAddress as Hex]?.price;
+    // Use the asset's chainId to get balances for the correct chain
+    const hexChainId = asset.chainId ? toHex(asset.chainId) : undefined;
+    const chainBalances = hexChainId ? balancesPerChainId[hexChainId] : {};
     balance =
-      assetAddress && assetAddress in balances
+      assetAddress && chainBalances && assetAddress in chainBalances
         ? renderFromTokenMinimalUnit(
-            balances[assetAddress],
+            chainBalances[assetAddress],
             asset.decimals ?? 18,
           )
         : 0;
@@ -113,8 +116,8 @@ export default function useBalance(asset?: Asset) {
       currentCurrency,
     );
     balanceBN =
-      assetAddress && assetAddress in balances
-        ? hexToBN(balances[assetAddress])
+      assetAddress && chainBalances && assetAddress in chainBalances
+        ? hexToBN(chainBalances[assetAddress])
         : null;
   }