feat: Token Network Filter UI [Mobile] #11808

gambinish · 2024-10-16T01:49:01Z

Description

This PR introduces token network filter UI component. It lives behind a feature flag PORTFOLIO_VIEW in order to allow this to get merged while backend changes are in flight.

Integration with the multichain asset list will occur in a separate PR. We'll likely want to add additional e2e tests when that happens.

Running this branch

yarn && yarn setup
PORTFOLIO_VIEW=1 yarn watch
yarn start:ios or i from the watch process

Please ensure that this PR looks okay both with and without the feature flag running. I have introduced a horizontal scroll view because there simply was not enough screen real estate to make the network filter look okay with truncated text.

Related issues

Fixes:

Manual testing steps

Run app with feature flag
Go to main Portfolio view
Pressing the network filter should trigger the bottom sheet, allowing the user to select different filter options.

Screenshots/Recordings

Screen.Recording.2024-10-29.at.1.25.18.PM.mov

Pre-merge author checklist

I’ve followed MetaMask Contributor Docs and MetaMask Mobile 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.

…h component

…is handling

…/metamask-mobile into chore/componetize-tokens-screen

…endering

github-actions · 2024-11-12T18:19:22Z

Bitrise

🔄🔄🔄 pr_smoke_e2e_pipeline started on Bitrise...🔄🔄🔄

Commit hash: 8959d19
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/14be83e2-968e-4d00-a4fc-f6db6b114a47

Note

This comment will auto-update when build completes
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

metamaskbot · 2024-11-12T18:44:04Z

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 8959d19
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/14be83e2-968e-4d00-a4fc-f6db6b114a47

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

This is the release candidate for version 7.34.0 # Team sign-off checklist - [ ] team-accounts - [ ] team-assets - [x] team-confirmations - [x] team-design-system - [ ] team-lavamoat - [x] team-mobile-platform - [x] team-notifications - [x] team-ramp - [ ] team-sdk - [ ] team-security - [x] team-snaps-platform - [x] team-stake - [ ] team-tiger - [ ] team-wallet-framework - [ ] team-wallet-ux # Reference - Testing plan sheet - https://docs.google.com/spreadsheets/d/1tsoodlAlyvEUpkkcNcbZ4PM9HuC9cEM80RZeoVv5OCQ/edit?gid=404070372#gid=404070372 --------- Signed-off-by: Kai Huang <[email protected]> Co-authored-by: runway-github[bot] <73448015+runway-github[bot]@users.noreply.github.com> Co-authored-by: MetaMask Bot <[email protected]> Co-authored-by: metamaskbot <[email protected]> Co-authored-by: tommasini <[email protected]> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Xiaoming Wang <[email protected]> Co-authored-by: Nico MASSART <[email protected]> Co-authored-by: Xiaoming Wang <[email protected]> Co-authored-by: Nicholas Ellul <[email protected]> Co-authored-by: legobt <[email protected]> Co-authored-by: OGPoyraz <[email protected]> Co-authored-by: Salim TOUBAL <[email protected]> Co-authored-by: Pedro Pablo Aste Kompen <[email protected]> Co-authored-by: legobeat <[email protected]> Co-authored-by: tommasini <[email protected]> Co-authored-by: Bryan Fullam <[email protected]> Co-authored-by: Mpendulo Ndlovu <[email protected]> Co-authored-by: Kaihuang72490 <[email protected]> Co-authored-by: Cal-L <[email protected]> Co-authored-by: Cal Leung <[email protected]> Co-authored-by: sahar-fehri <[email protected]> Co-authored-by: Vince Howard <[email protected]> Co-authored-by: Matthew Walsh <[email protected]>

github-actions · 2024-11-12T19:31:58Z

Bitrise

🔄🔄🔄 pr_smoke_e2e_pipeline started on Bitrise...🔄🔄🔄

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/c9e6a0a5-3c3c-4e50-9dbe-bbe25db212ff

Note

This comment will auto-update when build completes
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

Cal-L

LGTM

metamaskbot · 2024-11-12T19:34:07Z

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/c9e6a0a5-3c3c-4e50-9dbe-bbe25db212ff

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

sonarcloud · 2024-11-12T19:42:29Z

Quality Gate passed

Issues
0 New issues
0 Accepted issues

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

See analysis details on SonarQube Cloud

github-actions · 2024-11-12T19:53:00Z

Bitrise

🔄🔄🔄 pr_smoke_e2e_pipeline started on Bitrise...🔄🔄🔄

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/4e0acf3f-9a17-4b5e-a517-6de778c0dd07

Note

This comment will auto-update when build completes
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

metamaskbot · 2024-11-12T20:13:28Z

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/4e0acf3f-9a17-4b5e-a517-6de778c0dd07

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

metamaskbot · 2024-11-12T20:13:39Z

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/4e0acf3f-9a17-4b5e-a517-6de778c0dd07

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

metamaskbot · 2024-11-12T20:13:57Z

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/4e0acf3f-9a17-4b5e-a517-6de778c0dd07

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

metamaskbot · 2024-11-12T20:14:37Z

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/4e0acf3f-9a17-4b5e-a517-6de778c0dd07

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

metamaskbot · 2024-11-12T20:17:46Z

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/4e0acf3f-9a17-4b5e-a517-6de778c0dd07

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

metamaskbot · 2024-11-12T20:17:48Z

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/4e0acf3f-9a17-4b5e-a517-6de778c0dd07

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

metamaskbot · 2024-11-12T20:18:05Z

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/4e0acf3f-9a17-4b5e-a517-6de778c0dd07

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

metamaskbot · 2024-11-12T20:18:36Z

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/4e0acf3f-9a17-4b5e-a517-6de778c0dd07

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

metamaskbot · 2024-11-12T20:19:11Z

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: 496126b
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/4e0acf3f-9a17-4b5e-a517-6de778c0dd07

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

gambinish and others added 30 commits September 26, 2024 17:09

feat: Add sortAssets utility function

0248c74

chore: Breakup monolithic Tokens/index.tsx into smaller components

6a2e8c7

fix: Correctly handle null check for buyable footer button

7a78717

fix: Tweak boolean logic for rendering footer components

57295ee

chore: Update snapshot

d00354f

chore: Type out tokens as TokenI[]

be87f81

chore: Remove unecessary comments around import statements in Networt…

68c7b2e

…h component

Merge branch 'main' into chore/componetize-tokens-screen

a02e139

Merge branch 'main' into chore/componetize-tokens-screen

de5bbed

Merge branch 'main' into chore/componetize-tokens-screen

0fd9ad5

chore: Add unit tests to utility file, provide exports from index file

032618c

chore: Rename handleBalance to me more descriptive of what its logic …

a58f1ba

…is handling

chore: rename Networth to PortfolioBalance for clarity

1dd31e3

chore: Cleanup styles extra whitespace

16ded6a

Merge branch 'main' into chore/componetize-tokens-screen

52d3d85

fix: Update snapshot tests

dd3ffdf

Merge branch 'chore/componetize-tokens-screen' of github.com:MetaMask…

da640bc

…/metamask-mobile into chore/componetize-tokens-screen

fix: Remove unused component

ebcbcf6

Merge branch 'main' into chore/componetize-tokens-screen

31fad19

chore: Move PotfolioBalance above TabView

4a8d927

fix: Wrap PortfolioBalance and ScrollableView in fragment for token r…

a7b4c17

…endering

fix: Padding tweak below tab bar for consistency of token list

658fcf6

fix: Reorganize test suite for PortfolioBalance

18035d4

fix: Revert changes to wallet test

c570c2c

fix: Update fiatBalance text style to DisplayMD

a97128b

chore: Patch PreferencesController with tokenSortConfig

8036a0a

chore: Patch preferences controller with type

1f0ac51

feat: Build token sorting UI, patch PreferencesController

34d987c

chore: Merge main, address merge conflicts

d57558b

fix: ListHeaderComponent not needed in FlatList anymore

c5c954c

sethkfman and others added 2 commits November 12, 2024 19:58

Merge branch 'main' into feat/mmassets-431_network-filter-ui

496126b

gambinish added Run Smoke E2E Triggers smoke e2e on Bitrise and removed Run Smoke E2E Triggers smoke e2e on Bitrise labels Nov 12, 2024

Cal-L approved these changes Nov 12, 2024

View reviewed changes

NidhiKJha approved these changes Nov 12, 2024

View reviewed changes

gambinish added Run Smoke E2E Triggers smoke e2e on Bitrise and removed Run Smoke E2E Triggers smoke e2e on Bitrise labels Nov 12, 2024

darkwing approved these changes Nov 12, 2024

View reviewed changes

gambinish added this pull request to the merge queue Nov 12, 2024

Merged via the queue into main with commit de05544 Nov 12, 2024
48 of 49 checks passed

gambinish deleted the feat/mmassets-431_network-filter-ui branch November 12, 2024 20:11

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

metamaskbot added the release-7.36.0 Issue or pull request that will be included in release 7.36.0 label Nov 12, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: Token Network Filter UI [Mobile] #11808

feat: Token Network Filter UI [Mobile] #11808

gambinish commented Oct 16, 2024 •

edited

Loading

github-actions bot commented Nov 12, 2024

metamaskbot commented Nov 12, 2024

github-actions bot commented Nov 12, 2024

Cal-L left a comment

metamaskbot commented Nov 12, 2024

sonarcloud bot commented Nov 12, 2024

github-actions bot commented Nov 12, 2024

metamaskbot commented Nov 12, 2024

metamaskbot commented Nov 12, 2024

metamaskbot commented Nov 12, 2024

metamaskbot commented Nov 12, 2024

metamaskbot commented Nov 12, 2024

metamaskbot commented Nov 12, 2024

metamaskbot commented Nov 12, 2024

metamaskbot commented Nov 12, 2024

metamaskbot commented Nov 12, 2024

feat: Token Network Filter UI [Mobile] #11808

feat: Token Network Filter UI [Mobile] #11808

Conversation

gambinish commented Oct 16, 2024 • edited Loading

Description

Running this branch

Related issues

Manual testing steps

Screenshots/Recordings

Pre-merge author checklist

Pre-merge reviewer checklist

github-actions bot commented Nov 12, 2024

Bitrise

metamaskbot commented Nov 12, 2024

Bitrise

github-actions bot commented Nov 12, 2024

Bitrise

Cal-L left a comment

Choose a reason for hiding this comment

metamaskbot commented Nov 12, 2024

Bitrise

sonarcloud bot commented Nov 12, 2024

Quality Gate passed

github-actions bot commented Nov 12, 2024

Bitrise

metamaskbot commented Nov 12, 2024

Bitrise

metamaskbot commented Nov 12, 2024

Bitrise

metamaskbot commented Nov 12, 2024

Bitrise

metamaskbot commented Nov 12, 2024

Bitrise

metamaskbot commented Nov 12, 2024

Bitrise

metamaskbot commented Nov 12, 2024

Bitrise

metamaskbot commented Nov 12, 2024

Bitrise

metamaskbot commented Nov 12, 2024

Bitrise

metamaskbot commented Nov 12, 2024

Bitrise

gambinish commented Oct 16, 2024 •

edited

Loading