chore(runway): cherry-pick fix(card): delegation issues (#22249)

- fix(card): delegation issues (#22058)

<!--
Please submit this PR as a draft initially.
Do not mark it as "Ready for review" until the template has been
completely filled out, and PR status checks have passed at least once.
-->

## **Description**

<!--
Write a short description of the changes included in this pull request,
also include relevant motivation and context. Have in mind the following
questions:
1. What is the reason for the change?
2. What is the improvement/solution?
-->

This PR addresses several issues affecting the Card experience, ensuring
proper asset display, navigation flow, and data consistency across
components.

Fixes
- Fixed an issue where assets were not loading correctly after opening
the Card Home screen.
- Corrected balance handling on the Change Asset Bottom Sheet — it now
displays `availableBalance` for enabled tokens and the user’s total
balance for disabled ones.
- Restored asset icons on all asset-related bottom sheets.
- Fixed incorrect titles on the Spending Limit screen:
- Selecting a token that isn’t enabled now correctly shows “Change token
and network.”
- Pressing “Manage spending limit” on Card Home now correctly shows
“Enable token.”
- Resolved concurrency issues caused by promise caching in the
`useLoadCardData` hook.

## **Changelog**

<!--
If this PR is not End-User-Facing and should not show up in the
CHANGELOG, you can choose to either:
1. Write `CHANGELOG entry: null`
2. Label with `no-changelog`

If this PR is End-User-Facing, please write a short User-Facing
description in the past tense like:
`CHANGELOG entry: Added a new tab for users to see their NFTs`
`CHANGELOG entry: Fixed a bug that was causing some NFTs to flicker`

(This helps the Release Engineer do their job more quickly and
accurately)
-->

CHANGELOG entry: Fixed issue where assets failed to load after opening
the Card Home screen.
CHANGELOG entry: Fixed balance display on the Change Asset Bottom Sheet
to correctly show availableBalance for enabled tokens and user balance
for disabled tokens.
CHANGELOG entry: Restored missing asset icons on asset bottom sheets.
CHANGELOG entry: Fixed incorrect Spending Limit title when selecting a
token that’s not enabled (now shows “Change token and network”).
CHANGELOG entry: Fixed incorrect Spending Limit title when pressing
“Manage spending limit” on Card Home (now shows “Enable token”).
CHANGELOG entry: Resolved concurrency and caching issues in
useLoadCardData hook.

## **Related issues**

Fixes:

## **Manual testing steps**

```gherkin
Feature: my feature name

  Scenario: user [verb for user action]
    Given [describe expected initial app state]

    When user [verb for user action]
    Then [describe expected outcome]
```

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before**

<!-- [screenshots/recordings] -->

### **After**

<!-- [screenshots/recordings] -->

## **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]
> Improve Card balances and UX (pull-to-refresh, spending limit
progress), refactor delegation flow with confirmation and caching,
enhance asset selection and data fetching with cache/timeout, and clear
caches on logout/auth errors.
> 
> - **Card Home UI**:
> - Replace `useAssetBalance` with batched `useAssetBalances` and update
balance fallbacks.
> - Add pull‑to‑refresh, spending limit progress bar, and close‑limit
warning with actions.
> - Improve navigation for managing spending limit; hide Solana-specific
options; show error toast on enable failure.
> - **Spending Limit**:
> - Refactor delegation flow: SIWE signing, tx confirmation wait, cache
clearing, success/error toasts, navigation blocking; add
`UserCancelledError`.
> - **Asset Selection Bottom Sheet**:
> - Use `useAssetBalances` for fiat/token balances and icons;
filter/sort tokens; priority update with cache invalidation; Solana
footer link.
> - **Data Fetching & Caching**:
> - Add `useGetDelegationSettings` and `useGetCardExternalWalletDetails`
with caching and timeouts.
> - Fix `useLoadCardData` concurrency; add
`fetchAllData`/`refetchAllData` and authenticated data wiring.
>   - Clear all card caches on auth errors/logout.
> - **SDK/Utils**:
> - Simplify ethers provider usage; remove unused network mapper; add
`mapCaipChainIdToChainName` and safer chainId utils.
> - **Copy/UX**:
>   - Update warning dismiss label; add `enable_card_error` locale.
> - **Tests**:
> - Add/expand comprehensive unit/integration tests and snapshots across
new hooks, components, and flows.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
69808b6. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->


[0b3c740](0b3c740)

Co-authored-by: Bruno Nascimento <brunonascimentodev@gmail.com>
Co-authored-by: João Loureiro <175489935+joaoloureirop@users.noreply.github.com>

Author: 3 people

app/components/UI/Card/Views/CardHome/CardHome.test.tsx

@@ -320,6 +320,18 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                           "paddingBottom": 32,
                         }
                       }
+                      refreshControl={
+                        <RefreshControlMock
+                          colors={
+                            [
+                              "#4459ff",
+                            ]
+                          }
+                          onRefresh={[Function]}
+                          refreshing={false}
+                          tintColor="#121314"
+                        />
+                      }
                       showsVerticalScrollIndicator={false}
                       style={
                         {
@@ -328,6 +340,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                         }
                       }
                     >
+                      <RCTRefreshControl />
                       <View>
                         <View
                           style={
@@ -413,6 +426,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                               }
                             >
                               <RNSVGSvgView
+                                address="0x78...x789"
                                 align="xMidYMid"
                                 bbHeight="100%"
                                 bbWidth="100%"
@@ -712,6 +726,55 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                       }
                                     />
                                   </RNSVGGroup>
+                                  <RNSVGText
+                                    content={null}
+                                    dx={[]}
+                                    dy={[]}
+                                    fill={
+                                      {
+                                        "payload": 4294967295,
+                                        "type": 0,
+                                      }
+                                    }
+                                    font={
+                                      {
+                                        "fontSize": "40px",
+                                        "fontWeight": 800,
+                                      }
+                                    }
+                                    propList={
+                                      [
+                                        "fill",
+                                      ]
+                                    }
+                                    rotate={[]}
+                                    x={
+                                      [
+                                        40,
+                                      ]
+                                    }
+                                    y={
+                                      [
+                                        500,
+                                      ]
+                                    }
+                                  >
+                                    <RNSVGTSpan
+                                      content="0x78...x789"
+                                      dx={[]}
+                                      dy={[]}
+                                      fill={
+                                        {
+                                          "payload": 4278190080,
+                                          "type": 0,
+                                        }
+                                      }
+                                      font={{}}
+                                      rotate={[]}
+                                      x={[]}
+                                      y={[]}
+                                    />
+                                  </RNSVGText>
                                   <RNSVGDefs>
                                     <RNSVGClipPath
                                       fill={
@@ -1439,6 +1502,18 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                           "paddingBottom": 32,
                         }
                       }
+                      refreshControl={
+                        <RefreshControlMock
+                          colors={
+                            [
+                              "#4459ff",
+                            ]
+                          }
+                          onRefresh={[Function]}
+                          refreshing={false}
+                          tintColor="#121314"
+                        />
+                      }
                       showsVerticalScrollIndicator={false}
                       style={
                         {
@@ -1447,6 +1522,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                         }
                       }
                     >
+                      <RCTRefreshControl />
                       <View>
                         <View
                           style={
@@ -1532,6 +1608,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                               }
                             >
                               <RNSVGSvgView
+                                address="0x78...x789"
                                 align="xMidYMid"
                                 bbHeight="100%"
                                 bbWidth="100%"
@@ -1831,6 +1908,55 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                       }
                                     />
                                   </RNSVGGroup>
+                                  <RNSVGText
+                                    content={null}
+                                    dx={[]}
+                                    dy={[]}
+                                    fill={
+                                      {
+                                        "payload": 4294967295,
+                                        "type": 0,
+                                      }
+                                    }
+                                    font={
+                                      {
+                                        "fontSize": "40px",
+                                        "fontWeight": 800,
+                                      }
+                                    }
+                                    propList={
+                                      [
+                                        "fill",
+                                      ]
+                                    }
+                                    rotate={[]}
+                                    x={
+                                      [
+                                        40,
+                                      ]
+                                    }
+                                    y={
+                                      [
+                                        500,
+                                      ]
+                                    }
+                                  >
+                                    <RNSVGTSpan
+                                      content="0x78...x789"
+                                      dx={[]}
+                                      dy={[]}
+                                      fill={
+                                        {
+                                          "payload": 4278190080,
+                                          "type": 0,
+                                        }
+                                      }
+                                      font={{}}
+                                      rotate={[]}
+                                      x={[]}
+                                      y={[]}
+                                    />
+                                  </RNSVGText>
                                   <RNSVGDefs>
                                     <RNSVGClipPath
                                       fill={