Skip to content

feat(4144): per-dapp-selected-networks#14539

Merged
EtherWizard33 merged 100 commits intomainfrom
feat-4144-per-dapp-updated-from-main-april-7th
May 21, 2025
Merged

feat(4144): per-dapp-selected-networks#14539
EtherWizard33 merged 100 commits intomainfrom
feat-4144-per-dapp-updated-from-main-april-7th

Conversation

@EtherWizard33
Copy link
Copy Markdown
Contributor

@EtherWizard33 EtherWizard33 commented Apr 8, 2025

Description

Issue: All dapps are connected on the same chain, if one switches, others as well. Most likely the user would prefer to have his selected networks to be specific to each dapp (aka per-dapp).

Solution: Add per-dapp-selected-network, Add a touchable favicon to the permission summary header that enables network switching for dapps.

Per-DApp Selected Network Implementation

Key Changes

Features

  • Implemented per-dapp network selection functionality with interactive favicon
  • Added network badge and switching capability in permission summary header
  • Enhanced chain fallback logic for per-dapp-selected-network feature
  • Added origin-specific network info for transaction reviews
  • Removed non-permitted network flow checks for dapps (TODO: keep behind feature flag, enabled when !perDapp)

Fixes

  • Updated transaction notifications to use chain-specific ticker symbols
  • Fixed network client ID handling for smart transactions
  • Improved chain comparison logic for per-dapp transactions
  • Corrected domain logo container placement behind feature flag
  • Fixed favicon display logic in permission summary for unconnected dapps

Refactoring

  • Centralized per-DApp network logic using isPerDappSelectedNetworkEnabled helper
  • Cleaned up network selection implementation
  • Removed temporary network picker components
  • Updated network name and image source to be origin-aware
  • Standardized feature flag usage across components

Code Quality

  • Removed debug logging statements
  • Code cleanup and linting improvements
  • Updated test snapshots for network name changes

Related issues

Contributes to: https://github.com/MetaMask/MetaMask-planning/issues/4104

Manual testing steps

Testing:

  1. Enable feature flags below if they are not enabled already
  2. Connect to a dapp and verify network picker appears in permissions view
  3. Switch networks and verify correct network displays for that specific dapp
  4. Verify network switching works properly and modal dismisses correctly
  5. Verify network info displays correctly in permissions view

Make sure to include all env vars:

export MM_MULTICHAIN_V1_ENABLED="true"
export MM_CHAIN_PERMISSIONS="true"
export MM_PER_DAPP_SELECTED_NETWORK="true"
export MULTICHAIN_V1="true"

Screenshots/Recordings

Before After
Screenshot 2024-04-18 at 3 56 43 PM Screenshot 2024-04-18 at 3 56 43 PM

Pre-merge author checklist

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.

EtherWizard33 and others added 27 commits April 7, 2025 15:28
…ature can work when its feature flags are enabled

make sure to include all env vars:
export MM_MULTICHAIN_V1_ENABLED="true"
export MM_CHAIN_PERMISSIONS="true"
export MM_PER_DAPP_SELECTED_NETWORK="1"
export MULTICHAIN_V1="true"
- Replace direct checks of process.env.MM_PER_DAPP_SELECTED_NETWORK in AccountPermissionsConnected.tsx with the isPerDappSelectedNetworkEnabled function.
- Update ethereum-chain-utils.js to use isPerDappSelectedNetworkEnabled when switching networks.
- Modify selectedNetworkController selectors to use isPerDappSelectedNetworkEnabled for feature flag checks.
- Add the isPerDappSelectedNetworkEnabled utility in util/networks/index.js.

This change centralizes the per-DApp network logic for better consistency and maintainability.
Add a touchable favicon to the permission summary header that enables network
switching for dapps. This combines the dapp's identity (favicon/token) with
network selection in a single interactive component.

- Replace static WebsiteIcon with touchable BadgeWrapper pattern
- Add network badge to indicate current network
- Enable network switching via network selector bottom sheet
- Add fallback to AvatarToken when favicon unavailable
- Guard implementation behind per-dapp network selection feature flag
- Preserve original WebsiteIcon when feature disabled

This matches the interaction pattern from AccountPermissionsConnected,
providing a consistent way to manage dapp-specific networks across the app.
…flag

The domain logo container view was incorrectly placed outside the per-dapp network
feature flag check. This change moves the container view inside the feature flag
condition to ensure consistent UI behavior when the feature is enabled/disabled.

- Moved View wrapper inside isPerDappSelectedNetworkEnabled() check
- Simplified conditional rendering logic
- Maintains existing functionality but with proper feature flag control
…permission sumamry is displayed, keep showing the WebsiteIcon rather than the AvatarFavicon.
…1Enabled rather than its 'corresponding' env variable MULTICHAIN_V1
Remove the permission check for non-permitted network flows in dapps, paving the way for the per-dapp-selected-network feature. Temporary screens handling these flows are pending removal upon feature completion.
- Replace global network selectors with origin-specific useNetworkInfo hook
- Update network name and image source to be origin-aware
- Update test snapshot for network name changes
- Add origin prop to AccountFromToInfoCard for per-dapp network info
- Add debug logs for transaction review flow
… the per-dapp-selected-network enabled feature
… dapp chain if there is a hostname (if its a transaction from a dapp)
… confirming tx from dapp while stx is enabled
…ctNetworkConfigurations

- and fix lint errors
…on notifications

The commit updates the ticker selection to use the transaction's specific chainId
instead of the global network state, ensuring correct token symbol is displayed in the TransactionSummary when openned from the TransactionNotification for
per-dapp-selected-network transactions.
@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Apr 8, 2025

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.

@EtherWizard33 EtherWizard33 changed the title Feat 4144 per dapp updated from main april 7th feat(4144): per dapp updated from main april 7th Apr 8, 2025
@EtherWizard33 EtherWizard33 added the team-core-extension-ux Core Extension UX team label Apr 8, 2025
elribonazo
elribonazo previously approved these changes May 20, 2025
matthewwalsh0
matthewwalsh0 previously approved these changes May 20, 2025
vinnyhoward
vinnyhoward previously approved these changes May 20, 2025
adonesky1
adonesky1 previously approved these changes May 20, 2025
jiexi
jiexi previously approved these changes May 20, 2025
@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented May 20, 2025

https://bitrise.io/ Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 0e2e2b3
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/741f7de1-fb48-4f49-8995-6fb80bbefbf4

Note

  • You can kick off another pr_smoke_e2e_pipeline on Bitrise by removing and re-applying the Run Smoke E2E label on the pull request

Tip

  • Check the documentation if you have any doubts on how to understand the failure on bitrise

@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented May 20, 2025

https://bitrise.io/ Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: ff7c50a
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/b0603c21-da30-4b6a-b786-db14c766df41

Note

  • You can kick off another pr_smoke_e2e_pipeline on Bitrise by removing and re-applying the Run Smoke E2E label on the pull request

Tip

  • Check the documentation if you have any doubts on how to understand the failure on bitrise

@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented May 20, 2025

https://bitrise.io/ Bitrise

✅✅✅ pr_smoke_e2e_pipeline passed on Bitrise! ✅✅✅

Commit hash: 3b30945
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/0f2f289e-60d4-4951-95df-20659a2db501

Note

  • You can kick off another pr_smoke_e2e_pipeline on Bitrise by removing and re-applying the Run Smoke E2E label on the pull request

sethkfman
sethkfman previously approved these changes May 20, 2025
Copy link
Copy Markdown
Contributor

@sethkfman sethkfman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approving this PR. In the future, I would not recommend the approach of excluding the files from test even if they are behind feature flags.

abretonc7s
abretonc7s previously approved these changes May 21, 2025
@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented May 21, 2025

https://bitrise.io/ Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 6def8e4
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/aef6496c-b419-4ca2-82ec-6709b1e1eec6

Note

  • You can kick off another pr_smoke_e2e_pipeline on Bitrise by removing and re-applying the Run Smoke E2E label on the pull request

Tip

  • Check the documentation if you have any doubts on how to understand the failure on bitrise

@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented May 21, 2025

https://bitrise.io/ Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 58a0647
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/27b4e1a5-f198-4cdb-8866-de6fb62adef6

Note

  • You can kick off another pr_smoke_e2e_pipeline on Bitrise by removing and re-applying the Run Smoke E2E label on the pull request

Tip

  • Check the documentation if you have any doubts on how to understand the failure on bitrise

@sonarqubecloud
Copy link
Copy Markdown

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

No QA Needed Apply this label when your PR does not need any QA effort. release-7.48.0 Issue or pull request that will be included in release 7.48.0 team-core-extension-ux Core Extension UX team

Projects

Archived in project