diff --git a/ui/pages/settings/security-tab/__snapshots__/security-tab.test.js.snap b/ui/pages/settings/security-tab/__snapshots__/security-tab.test.js.snap index 147715ddbc68..d83b52f9ff2c 100644 --- a/ui/pages/settings/security-tab/__snapshots__/security-tab.test.js.snap +++ b/ui/pages/settings/security-tab/__snapshots__/security-tab.test.js.snap @@ -315,7 +315,11 @@ exports[`Security Tab should match snapshot 1`] = `
- C + Custom Mainnet RPC logo
![CHAIN_IDS.LOCALHOST].includes(chainId)) - .map((network) => ({ ...network, removable: true })), + .map((network) => ({ + ...network, + rpcPrefs: { + ...network.rpcPrefs, + // Provide an image based on chainID if a network + // has been added without an image + imageUrl: + network?.rpcPrefs?.imageUrl ?? + CHAIN_ID_TO_NETWORK_IMAGE_URL_MAP[network.chainId], + }, + removable: true, + })), ]; } diff --git a/ui/selectors/selectors.test.js b/ui/selectors/selectors.test.js index b2d62666e286..bfa8c412f2c6 100644 --- a/ui/selectors/selectors.test.js +++ b/ui/selectors/selectors.test.js @@ -5,6 +5,7 @@ import { CHAIN_IDS, LOCALHOST_DISPLAY_NAME, NETWORK_TYPES, + OPTIMISM_DISPLAY_NAME, } from '../../shared/constants/network'; import * as selectors from './selectors'; @@ -342,6 +343,28 @@ describe('Selectors', () => { ); expect(customNetwork.removable).toBe(true); }); + + it('properly proposes a known network image when not provided by adding function', () => { + const networks = selectors.getAllNetworks({ + metamask: { + preferences: { + showTestNetworks: true, + }, + networkConfigurations: { + 'some-config-name': { + chainId: CHAIN_IDS.OPTIMISM, + nickname: OPTIMISM_DISPLAY_NAME, + id: 'some-config-name', + }, + }, + }, + }); + + const optimismConfig = networks.find( + ({ chainId }) => chainId === CHAIN_IDS.OPTIMISM, + ); + expect(optimismConfig.rpcPrefs.imageUrl).toBe('./images/optimism.svg'); + }); }); describe('#getCurrentNetwork', () => {