working wip

Author: micaelae

shared/constants/bridge.ts

@@ -3,9 +3,14 @@ import {
   BRIDGE_DEV_API_BASE_URL,
   BRIDGE_PROD_API_BASE_URL,
   ChainId,
+  formatChainIdToCaip,
 } from '@metamask/bridge-controller';
 import { MultichainNetworks } from './multichain/networks';
-import { CHAIN_IDS, NETWORK_TO_NAME_MAP } from './network';
+import {
+  CHAIN_ID_TO_NETWORK_IMAGE_URL_MAP,
+  CHAIN_IDS,
+  NETWORK_TO_NAME_MAP,
+} from './network';
 
 const ALLOWED_MULTICHAIN_BRIDGE_CHAIN_IDS = [
   MultichainNetworks.SOLANA,
@@ -55,6 +60,18 @@ export const BRIDGE_API_BASE_URL = process.env.BRIDGE_USE_DEV_APIS
   ? BRIDGE_DEV_API_BASE_URL
   : BRIDGE_PROD_API_BASE_URL;
 
+export const BRIDGE_CHAIN_ID_TO_NETWORK_IMAGE_MAP: Record<
+  (typeof ALLOWED_BRIDGE_CHAIN_IDS_IN_CAIP)[number],
+  string
+> = ALLOWED_BRIDGE_CHAIN_IDS.reduce(
+  (acc, chainId) => {
+    acc[formatChainIdToCaip(chainId)] =
+      CHAIN_ID_TO_NETWORK_IMAGE_URL_MAP[chainId];
+    return acc;
+  },
+  {} as Record<(typeof ALLOWED_BRIDGE_CHAIN_IDS_IN_CAIP)[number], string>,
+);
+
 export const ETH_USDT_ADDRESS = '0xdac17f958d2ee523a2206206994597c13d831ec7';
 export const NETWORK_TO_SHORT_NETWORK_NAME_MAP: Record<
   AllowedBridgeChainIds,

shared/lib/asset-utils.ts

@@ -27,12 +27,12 @@ const STATIC_METAMASK_BASE_URL = 'https://static.cx.metamask.io';
 export const toAssetId = (
   address: Hex | CaipAssetType | string,
   chainId: CaipChainId,
-): CaipAssetType | undefined => {
+): CaipAssetType => {
   if (isCaipAssetType(address)) {
     return address;
   }
   if (isNativeAddress(address)) {
-    return getNativeAssetForChainId(chainId)?.assetId;
+    return getNativeAssetForChainId(chainId).assetId;
   }
   if (chainId === MultichainNetwork.Solana) {
     return CaipAssetTypeStruct.create(`${chainId}/token:${address}`);
@@ -43,7 +43,7 @@ export const toAssetId = (
       `${chainId}/erc20:${address.toLowerCase()}`,
     );
   }
-  return undefined;
+  throw new Error(`Invalid address: ${address} for chainId: ${chainId}`);
 };
 
 /**

ui/components/multichain/asset-picker-amount/asset-picker-modal/hooks/useAssetMetadata.ts

@@ -21,7 +21,7 @@ export const useAssetMetadata = (
   searchQuery: string,
   shouldFetchMetadata: boolean,
   abortControllerRef: React.MutableRefObject<AbortController | null>,
-  chainId?: Hex | CaipChainId,
+  chainId: CaipChainId,
 ) => {
   const allowExternalServices = useSelector(getUseExternalServices);
 
@@ -31,15 +31,15 @@ export const useAssetMetadata = (
         symbol: string;
         decimals: number;
         image: string;
-        chainId: Hex | CaipChainId;
+        chainId: CaipChainId;
         isNative: boolean;
         type: AssetType.token;
         balance: string;
         string: string;
       }
     | undefined
   >(async () => {
-    if (!chainId || !searchQuery) {
+    if (!searchQuery) {
       return undefined;
     }
 

ui/components/multichain/network-list-item/network-list-item.tsx

@@ -62,6 +62,7 @@ export const NetworkListItem = ({
   disabled = false,
   variant,
   notSelectable = false,
+  avatarNetworkProps = {},
 }: {
   name: string;
   iconSrc?: string;
@@ -81,6 +82,7 @@ export const NetworkListItem = ({
   disabled?: boolean;
   variant?: TextVariant;
   notSelectable?: boolean;
+  avatarNetworkProps?: Partial<React.ComponentProps<typeof AvatarNetwork>>;
 }) => {
   const t = useI18nContext();
   const networkRef = useRef<HTMLInputElement>(null);
@@ -175,6 +177,7 @@ export const NetworkListItem = ({
           name={name}
           src={iconSrc}
           size={iconSize as AvatarNetworkSize}
+          {...avatarNetworkProps}
         />
       )}
       <Box

ui/ducks/bridge/actions.ts

@@ -2,38 +2,31 @@ import {
   BridgeBackgroundAction,
   type BridgeController,
   BridgeUserAction,
-  formatChainIdToCaip,
+  formatChainIdToHex,
   isNativeAddress,
-  getNativeAssetForChainId,
   type RequiredEventContextFromClient,
   UnifiedSwapBridgeEventName,
 } from '@metamask/bridge-controller';
-import { type InternalAccount } from '@metamask/keyring-internal-api';
 import { type CaipChainId } from '@metamask/utils';
-import type {
-  AddNetworkFields,
-  NetworkConfiguration,
-} from '@metamask/network-controller';
+import { zeroAddress } from 'ethereumjs-util';
 import { trace, TraceName } from '../../../shared/lib/trace';
-import {
-  forceUpdateMetamaskState,
-  setActiveNetworkWithError,
-} from '../../store/actions';
+import { forceUpdateMetamaskState } from '../../store/actions';
 import { submitRequestToBackground } from '../../store/background-connection';
 import type { MetaMaskReduxDispatch } from '../../store/store';
+import { getInternalAccountBySelectedAccountGroupAndCaip } from '../../selectors/multichain-accounts/account-tree';
+import type { MetaMaskReduxState } from '../../selectors';
 import {
   bridgeSlice,
   setDestTokenExchangeRates,
   setDestTokenUsdExchangeRates,
   setSrcTokenExchangeRates,
   setTxAlerts,
-  setEVMSrcTokenBalance as setEVMSrcTokenBalance_,
-  setEVMSrcNativeBalance,
 } from './bridge';
 import type { TokenPayload } from './types';
-import { isNetworkAdded, isNonEvmChain } from './utils';
+import { isNonEvmChain } from './utils';
 
 const {
+  setFromChainId,
   setToChainId,
   setFromToken,
   setToToken,
@@ -60,6 +53,7 @@ export {
   setSortOrder,
   setSelectedQuote,
   setWasTxDeclined,
+  setSlippage,
   setTxAlerts,
   restoreQuoteRequestFromState,
 };
@@ -120,94 +114,97 @@ export const updateQuoteRequestParams = (
   };
 };
 
-export const setEVMSrcTokenBalance = (
-  token: TokenPayload['payload'],
-  selectedAddress?: string,
-) => {
-  return async (dispatch: MetaMaskReduxDispatch) => {
-    if (token) {
-      trace({
+export const setBalanceAmount = ({
+  chainId,
+  shouldSetGasTokenBalance = false,
+  token,
+}: {
+  chainId: CaipChainId;
+  shouldSetGasTokenBalance?: boolean;
+  token?: TokenPayload['payload'];
+}) => {
+  return async (
+    dispatch: MetaMaskReduxDispatch,
+    getState: () => MetaMaskReduxState,
+  ) => {
+    if (isNonEvmChain(chainId)) {
+      return;
+    }
+    const chainIdToUse = chainId ?? token?.chainId;
+    const accountAddress = getInternalAccountBySelectedAccountGroupAndCaip(
+      getState(),
+      chainIdToUse,
+    )?.address;
+
+    await trace(
+      {
         name: TraceName.BridgeBalancesUpdated,
         data: {
-          srcChainId: formatChainIdToCaip(token.chainId),
-          isNative: isNativeAddress(token.address),
+          srcChainId: chainId,
+          isNative: isNativeAddress(token?.address),
         },
         startTime: Date.now(),
-      });
-      await dispatch(
-        setEVMSrcTokenBalance_({
-          selectedAddress,
-          tokenAddress: token.address,
-          chainId: token.chainId,
-        }),
-      );
-    }
+      },
+      async () => {
+        const balance = (await dispatch(
+          await callBackgroundHandler(
+            'getBalanceAmount',
+            accountAddress,
+            token?.address || zeroAddress(),
+            formatChainIdToHex(chainIdToUse),
+          ),
+        )) as string;
+        if (shouldSetGasTokenBalance) {
+          dispatch(
+            setEVMSrcNativeBalance({
+              balance,
+              chainId: chainIdToUse,
+            }),
+          );
+        } else {
+          dispatch(
+            setEVMSrcTokenBalance({
+              balance,
+              assetId: token?.assetId,
+            }),
+          );
+        }
+      },
+    );
   };
 };
 
 export const setFromChain = ({
-  networkConfig,
-  selectedAccount,
+  chainId,
   token = null,
 }: {
-  networkConfig?:
-    | NetworkConfiguration
-    | AddNetworkFields
-    | (Omit<NetworkConfiguration, 'chainId'> & { chainId: CaipChainId });
-  selectedAccount: InternalAccount | null;
+  chainId?: CaipChainId | null;
   token?: TokenPayload['payload'];
 }) => {
   return async (dispatch: MetaMaskReduxDispatch) => {
-    if (!networkConfig) {
+    // Unset the fromChainId if no chainId is provided (All networks will be enabled)
+    if (!chainId) {
+      dispatch(setFromChainId(null));
       return;
     }
-
-    // Check for ALL non-EVM chains
-    const isNonEvm = isNonEvmChain(networkConfig.chainId);
-
     // Set the src network
-    if (isNonEvm) {
-      dispatch(setActiveNetworkWithError(networkConfig.chainId));
-    } else {
-      const networkId = isNetworkAdded(networkConfig)
-        ? networkConfig.rpcEndpoints?.[networkConfig.defaultRpcEndpointIndex]
-            ?.networkClientId
-        : null;
-      if (networkId) {
-        dispatch(setActiveNetworkWithError(networkId));
-      }
-    }
-
-    // Set the src token - if no token provided, set native token for non-EVM chains
+    dispatch(setFromChainId(chainId));
+    // Set the src token if provided
     if (token) {
       dispatch(setFromToken(token));
-    } else if (isNonEvm) {
-      // Auto-select native token for non-EVM chains when switching
-      const nativeAsset = getNativeAssetForChainId(networkConfig.chainId);
-      if (nativeAsset) {
-        dispatch(
-          setFromToken({
-            ...nativeAsset,
-            chainId: networkConfig.chainId,
-          }),
-        );
-      }
+      dispatch(
+        setBalanceAmount({
+          token,
+          chainId,
+        }),
+      );
     }
-
     // Fetch the native balance (EVM only)
-    if (selectedAccount && !isNonEvm) {
-      trace({
-        name: TraceName.BridgeBalancesUpdated,
-        data: {
-          srcChainId: formatChainIdToCaip(networkConfig.chainId),
-          isNative: true,
-        },
-        startTime: Date.now(),
-      });
+    if (chainId) {
       await dispatch(
-        setEVMSrcNativeBalance({
-          selectedAddress: selectedAccount.address,
-          chainId: networkConfig.chainId,
+        setBalanceAmount({
+          shouldSetGasTokenBalance: true,
+          chainId,
         }),
       );
     }