diff --git a/shared/constants/network.ts b/shared/constants/network.ts index d617764812b6..18a0ab087d69 100644 --- a/shared/constants/network.ts +++ b/shared/constants/network.ts @@ -144,6 +144,7 @@ export const CHAIN_IDS = { CRONOS: '0x19', GNOSIS: '0x64', ZKSYNC_ERA: '0x144', + TEST_ETH: '0x539', } as const; const CHAINLIST_CHAIN_IDS_MAP = { @@ -612,15 +613,15 @@ export const CHAIN_ID_TO_ETHERS_NETWORK_NAME_MAP = { [CHAIN_IDS.LINEA_MAINNET]: NETWORK_TYPES.LINEA_MAINNET, } as const; -export const NATIVE_CURRENCY_TOKEN_IMAGE_MAP = { - [CURRENCY_SYMBOLS.ETH]: ETH_TOKEN_IMAGE_URL, - [CURRENCY_SYMBOLS.TEST_ETH]: TEST_ETH_TOKEN_IMAGE_URL, - [CURRENCY_SYMBOLS.BNB]: BNB_TOKEN_IMAGE_URL, - [CURRENCY_SYMBOLS.MATIC]: MATIC_TOKEN_IMAGE_URL, - [CURRENCY_SYMBOLS.AVALANCHE]: AVAX_TOKEN_IMAGE_URL, - [CURRENCY_SYMBOLS.OPTIMISM]: OPTIMISM_TOKEN_IMAGE_URL, - [CURRENCY_SYMBOLS.CELO]: CELO_TOKEN_IMAGE_URL, - [CURRENCY_SYMBOLS.GNOSIS]: GNOSIS_TOKEN_IMAGE_URL, +export const CHAIN_ID_TOKEN_IMAGE_MAP = { + [CHAIN_IDS.MAINNET]: ETH_TOKEN_IMAGE_URL, + [CHAIN_IDS.TEST_ETH]: TEST_ETH_TOKEN_IMAGE_URL, + [CHAIN_IDS.BSC]: BNB_TOKEN_IMAGE_URL, + [CHAIN_IDS.POLYGON]: MATIC_TOKEN_IMAGE_URL, + [CHAIN_IDS.AVALANCHE]: AVAX_TOKEN_IMAGE_URL, + [CHAIN_IDS.OPTIMISM]: OPTIMISM_TOKEN_IMAGE_URL, + [CHAIN_IDS.CELO]: CELO_TOKEN_IMAGE_URL, + [CHAIN_IDS.GNOSIS]: GNOSIS_TOKEN_IMAGE_URL, } as const; export const INFURA_BLOCKED_KEY = 'countryBlocked'; diff --git a/ui/components/multichain/account-list-item/__snapshots__/account-list-item.test.js.snap b/ui/components/multichain/account-list-item/__snapshots__/account-list-item.test.js.snap index 55f9a20757e8..ec4e56c9772d 100644 --- a/ui/components/multichain/account-list-item/__snapshots__/account-list-item.test.js.snap +++ b/ui/components/multichain/account-list-item/__snapshots__/account-list-item.test.js.snap @@ -105,11 +105,7 @@ exports[`AccountListItem renders AccountListItem component and shows account nam
- ETH logo + E
- ETH logo + E
- ETH logo + E
- ETH logo + E
- ETH logo + E
- ETH logo + E
{ // Expect the hook to return true when the native symbol matches the ticker expect(result.result.current).toBe(true); - expect(spyFetch).toHaveBeenCalled(); + expect(spyFetch).not.toHaveBeenCalled(); }); it('should return the correct value when the native symbol does not match the ticker', async () => { @@ -75,7 +75,7 @@ describe('useNativeTokenFiatAmount', () => { await act(async () => { result = renderHook(() => - useIsOriginalNativeTokenSymbol('0x1', 'ETH', 'mainnet'), + useIsOriginalNativeTokenSymbol('0x13a', 'FIL', 'mainnet'), ); }); @@ -97,7 +97,7 @@ describe('useNativeTokenFiatAmount', () => { await act(async () => { result = renderHook(() => - useIsOriginalNativeTokenSymbol('0x1', 'ETH', 'mainnet'), + useIsOriginalNativeTokenSymbol('0x13a', 'FIL', 'mainnet'), ); }); @@ -106,7 +106,7 @@ describe('useNativeTokenFiatAmount', () => { expect(spyFetch).toHaveBeenCalled(); }); - it('should return the correct symbol from build Network', async () => { + it('should return the correct value when the chainId is in the CHAIN_ID_TO_CURRENCY_SYMBOL_MAP', async () => { useSelector.mockImplementation(generateUseSelectorRouter(true)); // Mock the safeChainsList response with a different native symbol @@ -128,14 +128,46 @@ describe('useNativeTokenFiatAmount', () => { await act(async () => { result = renderHook(() => - useIsOriginalNativeTokenSymbol('0x1', 'GoerliETH', 'goerli'), + useIsOriginalNativeTokenSymbol('0x5', 'GoerliETH', 'goerli'), ); }); - + // expect this to pass because the chainId is in the CHAIN_ID_TO_CURRENCY_SYMBOL_MAP expect(result.result.current).toBe(true); + // expect that the chainlist API was not called expect(spyFetch).not.toHaveBeenCalled(); }); + it('should return the correct value when the chainId is not in the CHAIN_ID_TO_CURRENCY_SYMBOL_MAP', async () => { + useSelector.mockImplementation(generateUseSelectorRouter(true)); + // Mock the safeChainsList response + const safeChainsList = [ + { + chainId: 314, + nativeCurrency: { + symbol: 'FIL', + }, + }, + ]; + + // Mock the fetchWithCache function to return the safeChainsList + const spyFetch = jest + .spyOn(fetchWithCacheModule, 'default') + .mockResolvedValue(safeChainsList); + + let result; + + await act(async () => { + result = renderHook(() => + useIsOriginalNativeTokenSymbol('0x13a', 'FIL', 'mainnet'), + ); + }); + + // Expect the hook to return true when the native symbol matches the ticker + expect(result.result.current).toBe(true); + // Expect the chainslist API to have been called + expect(spyFetch).toHaveBeenCalled(); + }); + it('should return true if chain safe validation is disabled', async () => { useSelector.mockImplementation(generateUseSelectorRouter(false)); // Mock the safeChainsList response with a different native symbol diff --git a/ui/selectors/selectors.js b/ui/selectors/selectors.js index ef14673829f5..09cb7628c3f0 100644 --- a/ui/selectors/selectors.js +++ b/ui/selectors/selectors.js @@ -13,7 +13,6 @@ import { TransactionStatus } from '@metamask/transaction-controller'; import { addHexPrefix } from '../../app/scripts/lib/util'; import { TEST_CHAINS, - NATIVE_CURRENCY_TOKEN_IMAGE_MAP, BUYABLE_CHAINS_MAP, MAINNET_DISPLAY_NAME, BSC_DISPLAY_NAME, @@ -33,6 +32,7 @@ import { LINEA_MAINNET_DISPLAY_NAME, LINEA_MAINNET_TOKEN_IMAGE_URL, CHAIN_ID_TO_NETWORK_IMAGE_URL_MAP, + CHAIN_ID_TOKEN_IMAGE_MAP, } from '../../shared/constants/network'; import { WebHIDConnectedStatuses, @@ -66,7 +66,6 @@ import { STATIC_MAINNET_TOKEN_LIST } from '../../shared/constants/tokens'; import { DAY } from '../../shared/constants/time'; import { TERMS_OF_USE_LAST_UPDATED } from '../../shared/constants/terms'; import { - getNativeCurrency, getProviderConfig, getConversionRate, isNotEIP1559Network, @@ -945,8 +944,8 @@ export function getIsBuyableChain(state) { return Object.keys(BUYABLE_CHAINS_MAP).includes(chainId); } export function getNativeCurrencyImage(state) { - const nativeCurrency = getNativeCurrency(state)?.toUpperCase(); - return NATIVE_CURRENCY_TOKEN_IMAGE_MAP[nativeCurrency]; + const chainId = getCurrentChainId(state); + return CHAIN_ID_TOKEN_IMAGE_MAP[chainId]; } export function getNextSuggestedNonce(state) {