From 313ec80990ac4549bb39bb189acdcc6eeab46dc9 Mon Sep 17 00:00:00 2001
From: Micaela Estabillo <micaela.estabillo@consensys.net>
Date: Mon, 7 Apr 2025 15:06:37 -0700
Subject: [PATCH 1/2] chore: add accountId param to useMultichainBalances

---
 ui/hooks/useMultichainBalances.ts | 40 +++++++++++++++++++++----------
 1 file changed, 28 insertions(+), 12 deletions(-)

diff --git a/ui/hooks/useMultichainBalances.ts b/ui/hooks/useMultichainBalances.ts
index 49dd78f368a3..d358ed3bbaf4 100644
--- a/ui/hooks/useMultichainBalances.ts
+++ b/ui/hooks/useMultichainBalances.ts
@@ -19,11 +19,16 @@ import {
   getMultichainCoinRates,
 } from '../selectors/multichain';
 import { AssetType } from '../../shared/constants/transaction';
-import { getSelectedEvmInternalAccount } from '../selectors/selectors';
+import {
+  getInternalAccount,
+  getSelectedEvmInternalAccount,
+} from '../selectors/selectors';
 import { useMultichainSelector } from './useMultichainSelector';
 
 // TODO replace this with getMultichainAssets
-const useNonEvmAssetsWithBalances = (): (
+const useNonEvmAssetsWithBalances = (
+  accountId?: string,
+): (
   | Omit<TokenWithBalance, 'address' | 'chainId' | 'primary' | 'secondary'> & {
       chainId: `${string}:${string}`;
       decimals: number;
@@ -35,7 +40,6 @@ const useNonEvmAssetsWithBalances = (): (
       symbol: string;
     }
 )[] => {
-  const nonEvmAccount = useSelector(getLastSelectedNonEvmAccount);
   // non-evm tokens owned by non-evm account, includes native and non-native assets
   const assetsByAccountId = useSelector(getAccountAssets);
   const assetMetadataById = useSelector(getAssetsMetadata);
@@ -50,12 +54,12 @@ const useNonEvmAssetsWithBalances = (): (
   const assetRates = useSelector(getAssetsRates);
 
   const nonEvmTokensWithFiatBalances = useMemo(() => {
-    if (!nonEvmAccount?.id) {
+    if (!accountId) {
       return [];
     }
 
-    const assetIds = assetsByAccountId?.[nonEvmAccount.id];
-    const balancesByAssetId = nonEvmBalancesByAccountId?.[nonEvmAccount.id];
+    const assetIds = assetsByAccountId?.[accountId];
+    const balancesByAssetId = nonEvmBalancesByAccountId?.[accountId];
     if (!balancesByAssetId || !assetIds) {
       return [];
     }
@@ -94,23 +98,35 @@ const useNonEvmAssetsWithBalances = (): (
     assetRates,
     assetsByAccountId,
     nativeRates,
-    nonEvmAccount?.id,
+    accountId,
     nonEvmBalancesByAccountId,
   ]);
 
   return nonEvmTokensWithFiatBalances;
 };
 
-// This hook is used to get the balances of all tokens and native tokens across all chains
-// This also returns the total fiat balances by chainId/caipChainId
-export const useMultichainBalances = () => {
+/**
+ * This hook is used to get the balances of all tokens and native tokens across all chains
+ * This also returns the total fiat balances by chainId/caipChainId
+ *
+ * @param accountId - the accountId to use for the token list, if not provided, the selected account will be used
+ */
+export const useMultichainBalances = (accountId?: string) => {
   // EVM data
   const selectedAccount = useSelector(getSelectedEvmInternalAccount);
+  const requestedAccount = useSelector((state) =>
+    getInternalAccount(state, accountId ?? ''),
+  );
+  const evmAccount = accountId ? requestedAccount : selectedAccount;
+
   const evmBalancesWithFiatByChainId = useSelector((state) =>
-    getTokenBalancesEvm(state, selectedAccount.address),
+    getTokenBalancesEvm(state, evmAccount?.address),
   );
   // Non-EVM data
-  const nonEvmBalancesWithFiatByChainId = useNonEvmAssetsWithBalances();
+  const nonEvmAccount = useSelector(getLastSelectedNonEvmAccount);
+  const nonEvmBalancesWithFiatByChainId = useNonEvmAssetsWithBalances(
+    accountId ?? nonEvmAccount?.id,
+  );
 
   // return TokenWithFiat sorted by fiat balance amount
   const assetsWithBalance = useMemo(() => {

From 2f31aca26782133b684a9df028a5095160f088cf Mon Sep 17 00:00:00 2001
From: Micaela Estabillo <micaela.estabillo@consensys.net>
Date: Mon, 7 Apr 2025 15:08:19 -0700
Subject: [PATCH 2/2] fix: pass dest accountId to useMultichainBalances

---
 ui/hooks/bridge/useTokensWithFiltering.ts       | 4 +++-
 ui/pages/bridge/prepare/prepare-bridge-page.tsx | 8 +++++++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/ui/hooks/bridge/useTokensWithFiltering.ts b/ui/hooks/bridge/useTokensWithFiltering.ts
index 1d0d4d12e085..b504a8d2b766 100644
--- a/ui/hooks/bridge/useTokensWithFiltering.ts
+++ b/ui/hooks/bridge/useTokensWithFiltering.ts
@@ -53,17 +53,19 @@ type FilterPredicate = (
  * @param tokenToExclude.symbol
  * @param tokenToExclude.address
  * @param tokenToExclude.chainId
+ * @param accountId - the accountId to use for the token list
  */
 export const useTokensWithFiltering = (
   chainId?: ChainId | Hex | CaipChainId,
   tokenToExclude?: null | Pick<BridgeToken, 'symbol' | 'address' | 'chainId'>,
+  accountId?: string,
 ) => {
   const topAssetsFromFeatureFlags = useSelector((state: BridgeAppState) =>
     getTopAssetsFromFeatureFlags(state, chainId),
   );
 
   const { assetsWithBalance: multichainTokensWithBalance } =
-    useMultichainBalances();
+    useMultichainBalances(accountId);
 
   const cachedTokens = useSelector(selectERC20TokensByChain);
 
diff --git a/ui/pages/bridge/prepare/prepare-bridge-page.tsx b/ui/pages/bridge/prepare/prepare-bridge-page.tsx
index 09ef30e9780a..664834cd48da 100644
--- a/ui/pages/bridge/prepare/prepare-bridge-page.tsx
+++ b/ui/pages/bridge/prepare/prepare-bridge-page.tsx
@@ -208,7 +208,13 @@ const PrepareBridgePage = () => {
   const {
     filteredTokenListGenerator: toTokenListGenerator,
     isLoading: isToTokensLoading,
-  } = useTokensWithFiltering(toChain?.chainId ?? fromChain?.chainId, fromToken);
+  } = useTokensWithFiltering(
+    toChain?.chainId ?? fromChain?.chainId,
+    fromToken,
+    selectedDestinationAccount !== null && 'id' in selectedDestinationAccount
+      ? selectedDestinationAccount.id
+      : undefined,
+  );
 
   const { flippedRequestProperties } = useRequestProperties();
   const trackCrossChainSwapsEvent = useCrossChainSwapsEventTracker();