diff --git a/ui/pages/asset/components/asset-page.tsx b/ui/pages/asset/components/asset-page.tsx index 19ce592f0071..d7fea7f5e75a 100644 --- a/ui/pages/asset/components/asset-page.tsx +++ b/ui/pages/asset/components/asset-page.tsx @@ -101,11 +101,21 @@ const AssetPage = ({ const selectedAccount = useSelector(getSelectedAccount); const currency = useSelector(getCurrentCurrency); const conversionRate = useSelector(getConversionRate); - const isBridgeChain = useSelector(getIsBridgeChain); const isBuyableChain = useSelector(getIsNativeTokenBuyable); - const defaultSwapsToken = useSelector(getSwapsDefaultToken, isEqual); + + const { chainId, type, symbol, name, image, decimals } = asset; + + // These need to be specific to the asset and not the current chain + const defaultSwapsToken = useSelector( + (state) => getSwapsDefaultToken(state, chainId), + isEqual, + ); + const isSwapsChain = useSelector((state) => getIsSwapsChain(state, chainId)); + const isBridgeChain = useSelector((state) => + getIsBridgeChain(state, chainId), + ); + const account = useSelector(getSelectedInternalAccount, isEqual); - const isSwapsChain = useSelector(getIsSwapsChain); const isSigningEnabled = account.methods.includes(EthMethod.SignTransaction) || account.methods.includes(EthMethod.SignUserOperation); @@ -132,7 +142,6 @@ const AssetPage = ({ const selectedAccountTokenBalancesAcrossChains = tokenBalances[selectedAccount.address]; - const { chainId, type, symbol, name, image, decimals } = asset; const isMetaMetricsEnabled = useSelector(getParticipateInMetaMetrics); const isMarketingEnabled = useSelector(getDataCollectionForMarketing); const metaMetricsId = useSelector(getMetaMetricsId); diff --git a/ui/selectors/selectors.js b/ui/selectors/selectors.js index 27b3a878042b..989a524523ff 100644 --- a/ui/selectors/selectors.js +++ b/ui/selectors/selectors.js @@ -1531,10 +1531,12 @@ export function getWeb3ShimUsageStateForOrigin(state, origin) { * selected account's ETH balance, as expected by the Swaps API. */ -export function getSwapsDefaultToken(state) { +export function getSwapsDefaultToken(state, overrideChainId) { const selectedAccount = getSelectedAccount(state); const balance = selectedAccount?.balance; - const chainId = getCurrentChainId(state); + const currentChainId = getCurrentChainId(state); + + const chainId = overrideChainId ?? currentChainId; const defaultTokenObject = SWAPS_CHAINID_DEFAULT_TOKEN_MAP[chainId]; return { @@ -1548,8 +1550,9 @@ export function getSwapsDefaultToken(state) { }; } -export function getIsSwapsChain(state) { - const chainId = getCurrentChainId(state); +export function getIsSwapsChain(state, overrideChainId) { + const currentChainId = getCurrentChainId(state); + const chainId = overrideChainId ?? currentChainId; const isNotDevelopment = process.env.METAMASK_ENVIRONMENT !== 'development' && process.env.METAMASK_ENVIRONMENT !== 'testing'; @@ -1558,8 +1561,9 @@ export function getIsSwapsChain(state) { : ALLOWED_DEV_SWAPS_CHAIN_IDS.includes(chainId); } -export function getIsBridgeChain(state) { - const chainId = getCurrentChainId(state); +export function getIsBridgeChain(state, overrideChainId) { + const currentChainId = getCurrentChainId(state); + const chainId = overrideChainId ?? currentChainId; return ALLOWED_BRIDGE_CHAIN_IDS.includes(chainId); }