feat: Multichain `AssetList` #28386

gambinish · 2024-11-08T17:27:06Z

Description

This PR is currently ready for QA testing.

Once these dependent PRs get merged, the diff in this PR should theoretically become much smaller.

Known issues:

Aggregated balances are not yet aggregated across chains. This is currently in progress.
Multichain token detection not yet integrated, as of now this is still per chain
Unit tests are isolated to this PR: fix: Multichain AssetList unit tests #28451
e2e test are isolated to this PR: fix: Multichain AssetList e2e tests #28524

Related issues

Fixes: https://github.com/orgs/MetaMask/projects/85/views/35?pane=issue&itemId=82217837

Manual testing steps

These are the happy paths we are currently ready to start QA:

Load up a wallet in Metamask that has several accounts, with several networks added to each account. Each account should have tokens for each network. If you are loading this branch locally, you can run this with the following feature flag: yarn && PORTFOLIO_VIEW=1 yarn webpack --watch
When "All Networks" are selected, you should see all your tokens across networks
You can toggle to the current network, which should filter your tokens for that specific network
Assets should correctly navigate to their details page (global network selector should remain unchanged)
Sending/Swapping tokens from the AssetDetails page, from a different network that the globally selected network, should switch networks to the one of the token to be sent, before navigating the user to the send/swap screens. A toast message should inform the user that the network has been changed on their behalf.
When on the AssetList, switching networks should also update the token list to the tokens on the selected account
Importing tokens should update the AssetList with the tokens from the chain they are being imported on.
Token sorting should be respected by both included sort criteria

Screenshots/Recordings

Screen.Recording.2024-11-11.at.4.15.34.PM.mov

Pre-merge author checklist

I've followed MetaMask Contributor Docs and MetaMask Extension Coding Standards.
I've completed the PR template to the best of my ability
I’ve included tests if applicable
I’ve documented my code using JSDoc format if applicable
I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

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.

…g custom filter logic

…om:MetaMask/metamask-extension into feat/mmassets-432_network-filter-extension

…rflowing

…om:MetaMask/metamask-extension into feat/mmassets-432_network-filter-extension

…ask-extension into brian/asset-controller-39

…n--integration-balances

## **Description** Cherry picks design updates for `AssetListControlBar` introduced from #28386 separately in it's own PR to help minimize diff in main feature branch. Also includes unit test and e2e updates impacted from these changes. [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/28575?quickstart=1) ## **Related issues** Fixes: ## **Manual testing steps** Run with feature flag and without feature flag: `yarn webpack --watch` `PORTFOLIO_VIEW=1 yarn webpack --watch` Validate that sort works, validate that import works, validate that refresh list works. ## **Screenshots/Recordings** Without feature flag: https://github.com/user-attachments/assets/445d4fd1-93d1-4cee-bd7b-bcc36518d7ca With feature flag (network filter not yet integrated) https://github.com/user-attachments/assets/d1aa8812-9787-49b5-9696-39e56d82ed56 ## **Pre-merge author checklist** - [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Extension Coding Standards](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/CODING_GUIDELINES.md). - [x] I've completed the PR template to the best of my ability - [x] I’ve included tests if applicable - [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [x] I’ve applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **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. --------- Co-authored-by: Jonathan Bursztyn <[email protected]>

darkwing · 2024-11-21T01:54:18Z

ui/selectors/selectors.js

+ * @param {object} state - Redux state
+ * @returns {object} An object of tokens with balances for the given account. Data relationship will be chainId => balance
+ */
+export function getSelectedAccountNativeTokenCachedBalanceByChainId(state) {


We need to add tests for these selectors.

… on feature

…n--integration-balances

gambinish · 2024-11-21T06:02:52Z

ui/components/app/assets/asset-list/network-filter/network-filter.tsx

+  useEffect(() => {
+    const testnetChains: string[] = TEST_CHAINS;
+    const mainnetChainIds = Object.keys(allNetworks).filter(
+      (chain) => !testnetChains.includes(chain),
+    );
+    setChainsToShow(mainnetChainIds);
+  }, []);
+
+  const allOpts: Record<string, boolean> = {};
+  Object.keys(allNetworks).forEach((chain) => {
+    allOpts[chain] = true;
+  });


I think that we should refactor this logic into a hook. It's being used in multiple places, and should just use the getChainIdsToPoll selector.

I would prefer to address this cleanup in a separate PR, if possible.

gambinish · 2024-11-21T18:02:20Z

closing in favor of #28593

gambinish and others added 30 commits October 17, 2024 08:23

chore: Merge main, address conflicts

6ec980b

Merge branch 'develop' into feat/mmassets-432_network-filter-extension

3b6d223

Merge branch 'develop' into feat/mmassets-432_network-filter-extension

d670862

fix: Update unit tests in preferences-controller

bf5913c

feat: Add filterAssets function

85d5161

chore: Polish filters to be layerable in order of importance, allowin…

72ea2cf

…g custom filter logic

fix: Lint tsc, specifiy chain indication rather than arbitrary number

8b52780

chore: Localize strings

4349f4f

Merge branch 'develop' into feat/mmassets-432_network-filter-extension

8b83df4

chore: Add localized Network string

bc82cb4

Merge branch 'feat/mmassets-432_network-filter-extension' of github.c…

42ad7d4

…om:MetaMask/metamask-extension into feat/mmassets-432_network-filter-extension

chore: Add FILTER_TOKENS_TOGGLE feature flag

c4ce6c7

Merge branch 'develop' into feat/mmassets-432_network-filter-extension

5be0713

fix: Show current selection on Network filter, and ellipsize when ove…

023b0ca

…rflowing

Merge branch 'feat/mmassets-432_network-filter-extension' of github.c…

c9a2d8d

…om:MetaMask/metamask-extension into feat/mmassets-432_network-filter-extension

fix: Lint

ae96cea

fix: Remove duplicate locale string

5b40705

fix: Cleanup

f7f09da

bump asset controllers to 39

85fe12d

update ConfirmTransaction

0f3cd64

fix useGasFeeEstimates unit test

bdf921b

fix usePolling tests

9bc4ecf

Merge branch 'develop' into feat/mmassets-432_network-filter-extension

c6a408d

bump controller utils

9b1529b

remove patch

c8bcc0b

Merge branch 'develop' into brian/asset-controller-39

d1a3782

Update LavaMoat policies

05fd6ef

lint

9dfdfa8

Merge branch 'brian/asset-controller-39' of github.com:MetaMask/metam…

04ea3d6

…ask-extension into brian/asset-controller-39

Merge branch 'develop' into brian/asset-controller-39

cf66072

gambinish added 2 commits November 20, 2024 10:21

fix: Remove fake loading boolean

a9b16e2

fix: Lint

675780e

gambinish mentioned this pull request Nov 20, 2024

refactor: Cherry pick asset-list-control-bar updates #28575

Merged

7 tasks

gambinish and others added 3 commits November 20, 2024 15:22

Merge branch 'develop' into feat/mmassets-432_network-filter-extensio…

614b5ff

…n--integration-balances

Merge branch 'develop' into feat/mmassets-432_network-filter-extensio…

0bbaeb5

…n--integration-balances

fix: Typo

2c458c5

gambinish added 2 commits November 20, 2024 16:28

chore: Rebase with develop

6e92ee4

fix: Revert removal of NativeToken in order to support flask build

e6b33f5

darkwing reviewed Nov 21, 2024

View reviewed changes

gambinish added 14 commits November 20, 2024 18:06

fix: Include nativeToken in props

838e4a1

chore: Remove patch resolution

00c07aa

fix: Dont remove chokidar

5b7ea11

fix: Dedupe controller method

0d77e0b

fix: Align asset-list-control-bar styles

d4880c7

fix: component import

f0d722f

fix: Revert token-cell test. Should be fixed in unit test branch, not…

035fb5c

… on feature

chore: Cleanup useAccountTotalFiatBalance hook

0867b5c

Merge branch 'develop' into feat/mmassets-432_network-filter-extensio…

7f29e11

…n--integration-balances

fix: Dont override suffix label

a610400

fix: Lint unused var

650aec5

fix: React.CloneElement tells react to return an element in the tree

b34ce81

fix: Update en locale, loadingTokens no longer needed

006f12c

fix: Temporarily log locale string to remove

4d3aeba

gambinish mentioned this pull request Nov 21, 2024

fix: Multichain AssetList e2e tests #28524

Closed

7 tasks

gambinish commented Nov 21, 2024

View reviewed changes

gambinish mentioned this pull request Nov 21, 2024

feat: PortfolioView #28593

Merged

7 tasks

gambinish closed this Nov 21, 2024

github-actions bot locked and limited conversation to collaborators Nov 21, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: Multichain `AssetList` #28386

feat: Multichain `AssetList` #28386

gambinish commented Nov 8, 2024 •

edited

Loading

darkwing Nov 21, 2024

gambinish Nov 21, 2024

gambinish commented Nov 21, 2024

feat: Multichain AssetList #28386

feat: Multichain AssetList #28386

Conversation

gambinish commented Nov 8, 2024 • edited Loading

Description

Related issues

Manual testing steps

Screenshots/Recordings

Pre-merge author checklist

Pre-merge reviewer checklist

darkwing Nov 21, 2024

Choose a reason for hiding this comment

gambinish Nov 21, 2024

Choose a reason for hiding this comment

gambinish commented Nov 21, 2024

feat: Multichain `AssetList` #28386

feat: Multichain `AssetList` #28386

gambinish commented Nov 8, 2024 •

edited

Loading