feat: MultichainBalanceController (#12599)

## **Description**
Builds off of the work done in [this
PR](MetaMask/core#4965).

- This PR adds the ability to see your non EVM token balance and the
fiat token rates (Solana and Bitcoin accounts)
- This is achieved by using the RatesController and the
MultichainBalanceController
- This PR also extract the balance logic from the PortfolioBalance PR
into the useMultichainBalances hook
- creates the selectors for multichain non evm

This PR DOES NOT...
1. show the correct native token balance in the account picker. This
will be done in a [following
PR](MetaMask/accounts-planning#697) that
builds off of this work.
2. enable token details for these non evm assets. (for now it will
simply show no data)

## **Related issues**

Fixes: MetaMask/accounts-planning#696

## **Manual testing steps**

1. checkout this branch
3. open .js.env
4. set export METAMASK_BUILD_TYPE="flask" // flask
5. source .js.env
6. yarn setup
7. yarn start:ios
8. create/import a wallet
9. open the account menu actions
10. you should see that you can add a BTC and BTC Testnet account
11. click Add a new Bitcoin account (Beta)
12. a popup with a suggested name should appear click confirm
13. the newly selected account should be your Bitcoin account and the
network picker should show the Bitcoin logo the network should not be
clickable
14. Optionally, create a testnet account and fund it with this faucet:
https://bitcoinfaucet.uo1.net/
15. If you have a balance, you should see the fiat balance rendered on
the wallet
16. if not you have a balance, then you should see a 0 fiat balance.
17. If you change your selected currency (settings/general) and then
return to the main wallet view, the balance should update based on the
new fiat currency.
18. The token list should also list your account balance in both fiat
and and the native token balance.
19. the token displayed should be the BTC logo and not have any network
badge above it (like the eth account does)
20. now add a bitcoin TestNet account.
21. the portfolio balance should show the native token balance not the
fiat balance.
22. repeat the above steps but this time add a new Solana account. If
your Solana account has a balance, it should be rendered on the home
page in fiat. If not you should see a 0 balance.
23. we do not currently support Solana testnet accounts.


## **Screenshots/Recordings**

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

### **Before**

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

### **After**


https://github.com/user-attachments/assets/12d4bfeb-608f-4744-9c0a-459163eb0dba



<img
src="https://github.com/user-attachments/assets/f8428b91-fb45-433d-921e-3824845a71ef"
height="400" height="600"/>



## **Pre-merge author checklist**

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

Author: owencraston

app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentage.stories.tsx

@@ -1,11 +1,9 @@
 import React from 'react';
 import { Provider } from 'react-redux';
-import AggregatedPercentage, {
-  AggregatedPercentageProps,
-} from './AggregatedPercentage';
+import AggregatedPercentage from './AggregatedPercentage';
 import { createStore } from 'redux';
 import initialBackgroundState from '../../../../util/test/initial-background-state.json';
-
+import { AggregatedPercentageProps } from './AggregatedPercentage.types';
 const mockInitialState = {
   wizard: {
     step: 1,

app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentage.tsx

@@ -15,13 +15,7 @@ import {
   FORMATTED_PERCENTAGE_TEST_ID,
 } from './AggregatedPercentage.constants';
 import { DECIMALS_TO_SHOW } from '../../../../components/UI/Tokens/constants';
-
-export interface AggregatedPercentageProps {
-  ethFiat: number;
-  tokenFiat: number;
-  tokenFiat1dAgo: number;
-  ethFiat1dAgo: number;
-}
+import { AggregatedPercentageProps } from './AggregatedPercentage.types';
 
 const isValidAmount = (amount: number | null | undefined): boolean =>
   amount !== null && amount !== undefined && !Number.isNaN(amount);
@@ -32,13 +26,7 @@ const AggregatedPercentage = ({
   tokenFiat1dAgo,
   ethFiat1dAgo,
   privacyMode = false,
-}: {
-  ethFiat: number;
-  tokenFiat: number;
-  tokenFiat1dAgo: number;
-  ethFiat1dAgo: number;
-  privacyMode?: boolean;
-}) => {
+}: AggregatedPercentageProps) => {
   const { styles } = useStyles(styleSheet, {});
 
   const currentCurrency = useSelector(selectCurrentCurrency);

app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentage.types.ts

@@ -0,0 +1,7 @@
+export interface AggregatedPercentageProps {
+  ethFiat: number;
+  tokenFiat: number;
+  tokenFiat1dAgo: number;
+  ethFiat1dAgo: number;
+  privacyMode?: boolean;
+}

app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentageCrossChains.tsx

@@ -17,13 +17,7 @@ import {
   TokensWithBalances,
 } from '../../../../components/hooks/useGetFormattedTokensPerChain';
 import { getFormattedAmountChange, getPercentageTextColor } from './utils';
-
-export interface AggregatedPercentageProps {
-  ethFiat: number;
-  tokenFiat: number;
-  tokenFiat1dAgo: number;
-  ethFiat1dAgo: number;
-}
+import { AggregatedPercentageCrossChainsProps } from './AggregatedPercentageCrossChains.types';
 
 export const getCalculatedTokenAmount1dAgo = (
   tokenFiatBalance: number,
@@ -40,16 +34,7 @@ const AggregatedPercentageCrossChains = ({
   privacyMode = false,
   totalFiatCrossChains,
   tokenFiatBalancesCrossChains,
-}: {
-  privacyMode?: boolean;
-  totalFiatCrossChains: number;
-  tokenFiatBalancesCrossChains: {
-    chainId: string;
-    nativeFiatValue: number;
-    tokenFiatBalances: number[];
-    tokensWithBalances: TokensWithBalances[];
-  }[];
-}) => {
+}: AggregatedPercentageCrossChainsProps) => {
   const crossChainMarketData: MarketDataMapping = useSelector(
     selectTokenMarketData,
   );

app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentageCrossChains.types.tsx

@@ -0,0 +1,12 @@
+import { TokensWithBalances } from '../../../../components/hooks/useGetFormattedTokensPerChain';
+
+export interface AggregatedPercentageCrossChainsProps {
+  privacyMode?: boolean;
+  totalFiatCrossChains: number;
+  tokenFiatBalancesCrossChains: {
+    chainId: string;
+    nativeFiatValue: number;
+    tokenFiatBalances: number[];
+    tokensWithBalances: TokensWithBalances[];
+  }[];
+}