Fix #20934 - Show network icon in New Network popover

[darkwing]

Description

Fixes #20934

This PR ensures the correct network icon displays when switching to a new network like Optimism and Arbitrum. While ETH may be the native currency of each of those networks, the chip image should represent the network.

Manual testing steps

1. Open the Networks menu and click "Add network"
2. Add Arbitrum and switch to that network
3. See the Arbitrum logo in the "You've switched" network circle
4. Repeat with Optimism

Screenshots/Recordings

Before

After

Related issues

Fixes #20934

Pre-merge author checklist

• I’ve followed MetaMask Coding Standards.
• I've clearly explained:
  • What problem this PR is solving.
  • How this problem was solved.
  • How reviewers can test my changes.
• I’ve indicated what issue this PR is linked to: Fixes #???
• I’ve included tests if applicable.
• I’ve documented any added code.
• I’ve applied the right labels on the PR (see labeling guidelines).
• I’ve properly set the pull request status:
  • In case it's not yet "ready for review", I've set it to "draft".
  • In case it's "ready for review", I've changed it from "draft" to "non-draft".

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[codecov]

Codecov Report

All modified lines are covered by tests ✅

Comparison is base (f690d9a) 68.35% compared to head (af1a57c) 68.35%.
Report is 12 commits behind head on develop.

Additional details and impacted files

@@             Coverage Diff             @@
##           develop   #21016      +/-   ##
===========================================
- Coverage    68.35%   68.35%   -0.00%     
===========================================
  Files         1007     1007              
  Lines        40261    40259       -2     
  Branches     10766    10764       -2     
===========================================
- Hits         27519    27517       -2     
  Misses       12742    12742              

Files	Coverage Δ
...components/ui/new-network-info/new-network-info.js	81.58% <100.00%> (+0.63%)	⬆️
ui/selectors/selectors.js	86.76% <100.00%> (+0.04%)	⬆️

... and 1 file with indirect coverage changes

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[metamaskbot]

Builds ready [343633d]

• builds: chrome, firefox
• builds (beta): chrome
• builds (flask): chrome, firefox
• builds (MMI): chrome, firefox
• build viz: Build System
• mv3: Background Module Init Stats
• mv3: UI Init Stats
• mv3: Module Load Stats
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• code coverage: Report
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4
  • common: 0, 1, 2, 3, 4, 5, 6, 7
  • content-script: 0
  • contentscript: contentscript
  • disable-console: disable-console
  • inpage: inpage
  • policy-load: policy-load
  • sentry-install: sentry-install
  • ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1762 ± 58 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	88	170	113	21	10
		domContentLoaded	71	167	105	23	11
		load	1530	2047	1762	121	58
		domInteractive	71	167	105	23	11

Bundle size diffs

• background: 0 Bytes (0.00%)
• ui: 115 Bytes (0.00%)
• common: 0 Bytes (0.00%)

[HowardBraham]

I tested this. It solves the icon problem, but the layout is off.

[darkwing]

@HowardBraham I noticed that as well, so I put the PR in draft state.

[metamaskbot]

Builds ready [af1a57c]

• builds: chrome, firefox
• builds (beta): chrome
• builds (flask): chrome, firefox
• builds (MMI): chrome, firefox
• build viz: Build System
• mv3: Background Module Init Stats
• mv3: UI Init Stats
• mv3: Module Load Stats
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• code coverage: Report
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4
  • common: 0, 1, 2, 3, 4, 5, 6, 7
  • content-script: 0
  • contentscript: contentscript
  • disable-console: disable-console
  • inpage: inpage
  • policy-load: policy-load
  • sentry-install: sentry-install
  • ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1434 ± 26 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	82	114	90	10	5
		domContentLoaded	66	114	85	13	6
		load	1362	1606	1434	55	26
		domInteractive	66	114	85	13	6

Bundle size diffs

• background: 0 Bytes (0.00%)
• ui: -699 Bytes (-0.01%)
• common: 0 Bytes (0.00%)