Skip to content

fix: hide chain avatar beside Popular Networks (#29948)#30263

Merged
wachunei merged 1 commit into
mainfrom
fix/29948-popular-networks-filter-avatar
May 15, 2026
Merged

fix: hide chain avatar beside Popular Networks (#29948)#30263
wachunei merged 1 commit into
mainfrom
fix/29948-popular-networks-filter-avatar

Conversation

@wachunei

@wachunei wachunei commented May 15, 2026 •
edited by cursor Bot
Loading

Copy link
Copy Markdown
Member

Description

When multiple networks are enabled, the token list and Activity tabs show the Popular Networks label using totalEnabledNetworksCount > 1. The network avatar was still gated on !areAllNetworksSelected for popular EVM rows only. After adding a custom network (e.g. Tempo) or leaving one popular chain off, that mismatch showed an Ethereum (or first-enabled) icon next to Popular Networks, which is incorrect per product expectation (issue #29948).

Change: show the filter avatar only when we are not in the Popular Networks label state and not all popular EVM networks are selected—aligned in BaseControlBar (Tokens / DeFi control bar) and ActivityView (Activity tab).

Changelog

CHANGELOG entry: Fixed Popular Networks filter incorrectly showing a chain icon after enabling additional networks (e.g. Tempo).

Related issues

Fixes: #29948

Manual testing steps

Feature: Popular Networks filter label and icon

  Scenario: No icon beside Popular Networks after adding a custom network
    Given the wallet has "All popular networks" (or equivalent multi-network) enabled with more than one network in the global filter
    When the user opens Menu > Networks, adds a custom network (e.g. Tempo), and closes the menu
    Then the Tokens tab network filter shows "Popular Networks" with no chain avatar beside it

  Scenario: Activity tab matches Tokens behavior
    Given the same multi-network state as above
    When the user opens the Activity tab (Transactions) network filter
    Then the filter shows "Popular networks" with no chain avatar beside it

Screenshots/Recordings

Before

icon_before.mp4

After

icon_after.mp4

Pre-merge author checklist

Performance checks (if applicable)

  • I've tested on Android
    • Ideally on a mid-range device; emulator is acceptable
  • I've tested with a power user scenario
    • Use these power-user SRPs to import wallets with many accounts and tokens
  • I've instrumented key operations with Sentry traces for production performance metrics

For performance guidelines and tooling, see the Performance Guide.

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.

Note

Low Risk
Low risk UI-only conditional rendering change that affects when the network filter avatar is shown; main risk is minor visual regression across network-selection edge cases.

Overview
Prevents the network filter from showing a chain Avatar when the label is wallet.popular_networks (i.e., when totalEnabledNetworksCount > 1) in both BaseControlBar and ActivityView.

Updates unit tests to assert no avatar beside “Popular networks” in multi-network scenarios, while still rendering an avatar for single-network filters when not all popular networks are selected.

Reviewed by Cursor Bugbot for commit e0a3038. Bugbot is set up for automated code reviews on this repo. Configure here.

@github-actions github-actions Bot added the pr-not-ready-for-e2e Skip E2E and block merging. Remove this label once the PR is ready to run the E2E tests. label May 15, 2026
@wachunei
fix: hide chain avatar beside Popular Networks in token and activity …
e0a3038 
…filters

The filter label uses global enabled network count while the avatar used
only popular-EVM "all selected", so one deselected popular chain or added
custom network could show an Ethereum icon next to Popular Networks.

Fixes #29948
@wachunei wachunei force-pushed the fix/29948-popular-networks-filter-avatar branch from ff44e7a to e0a3038 Compare May 15, 2026 15:42
@wachunei wachunei added team-mobile-ux Mobile UX team and removed pr-not-ready-for-e2e Skip E2E and block merging. Remove this label once the PR is ready to run the E2E tests. labels May 15, 2026
@github-actions

github-actions Bot commented May 15, 2026

Copy link
Copy Markdown
Contributor

🔍 Smart E2E Test Selection

  • Selected E2E tags: SmokeWalletPlatform
  • Selected Performance tags: None (no tests recommended)
  • Risk Level: low
  • AI Confidence: 82%
click to see 🤖 AI reasoning details

E2E Test Selection:
The changes are focused UI logic fixes:

  1. BaseControlBar.tsx: Introduces showNetworkFilterAvatar = !displayAllNetworks && !areAllNetworksSelected to fix avatar display logic. Previously the network avatar was shown whenever !areAllNetworksSelected (even when multiple networks were enabled, showing "Popular Networks" label). Now the avatar is correctly hidden when multiple networks are enabled (displayAllNetworks=true). This component is used by TokenListControlBar, NftGrid, and DeFiPositions.

  2. ActivityView/index.js: Consolidates two hook calls (useNetworksByNamespace + useNetworksByCustomNamespace) into a single useNetworksByCustomNamespace call, and aligns the label display logic to use totalEnabledNetworksCount > 1 consistently with BaseControlBar. This affects the transaction history/activity view network filter display.

Both changes are purely UI display fixes for the network filter avatar in the control bar. No controller changes, no navigation changes, no security implications.

SmokeWalletPlatform is selected because:

  • ActivityView is the transaction history view (incoming/outgoing ETH transactions, token transfers) which is directly tested by SmokeWalletPlatform
  • BaseControlBar is used in TokenListControlBar (wallet token list) and other wallet platform surfaces
  • The network filter display logic affects how users see network selection in the wallet

No other tags are needed since:

  • No confirmation flows are changed
  • No account management flows are changed
  • No swap/stake/bridge flows are changed
  • No browser/snaps/identity flows are changed
  • No network permission flows are changed (only display logic)

Performance Test Selection:
The changes are minor UI display logic fixes (boolean condition for showing/hiding a network avatar). They don't affect rendering performance, data loading, state management, or any performance-critical paths. No performance tests are warranted.

View GitHub Actions results

@wachunei wachunei marked this pull request as ready for review May 15, 2026 15:53
@sonarqubecloud

sonarqubecloud Bot commented May 15, 2026

Copy link
Copy Markdown

Quality Gate Passed Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
100.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

@wachunei wachunei added this pull request to the merge queue May 15, 2026
Merged via the queue into main with commit 444261c May 15, 2026
142 of 174 checks passed
@wachunei wachunei deleted the fix/29948-popular-networks-filter-avatar branch May 15, 2026 17:25
@github-actions github-actions Bot locked and limited conversation to collaborators May 15, 2026
@metamaskbotv2 metamaskbotv2 Bot added the release-7.79.0 Issue or pull request that will be included in release 7.79.0 label May 15, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Reviewers

@vinnyhoward vinnyhoward vinnyhoward approved these changes

Assignees

No one assigned

Labels

release-7.79.0 Issue or pull request that will be included in release 7.79.0 size-S team-mobile-ux Mobile UX team

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

[Bug]: Networks - All popular networks displays Ethereum icon after adding Tempo network

2 participants

@wachunei @vinnyhoward