feat: Base Wallet Details Screen

[owencraston]

Description

This PR implements the basic wallet details screen. This feature is hidden behind a remote feature flag. This screen shows all the accounts that are tied to a wallet along with some other information...

• wallet name
• Total wallet balance (aggregate balances of all accounts in the wallet). This is not the aggregate balance of all your accounts, just the accounts that belong to the wallet
• List of accounts that belong to that wallet with...
  • the account name
  • account icon (Blockies or Jazzicon)
  • individual account balance

Designs:

Out of scope:

• Social recovery
• SRP
• Adding an account These changes will be made in subsequent PRs.

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/MUL-211

Manual testing steps

1. This feature is hidden behind a remote feature flag so to enable it you will either need to use a proxy (message me for details) or have this function return true as well as this one.
2. Create a wallet
3. Open the account list.
4. Since the multi-chain accounts state 1 feature flag is enabled, you should see your accounts grouped by wallet
5. click on the blue details icon beside the wallet name
6. it should take you to the wallet details screen
7. this screen should contain your wallet name, total wallet balance, and a list of your accounts in that wallet with their individual balances.
8. Click on an account should take you to that accounts details screen
9. clicking back from that screen should take you back to wallet details
10. Clicking back on the wallet details screen should take you back to the accounts list.

Screenshots/Recordings

Before

N/A

After

https://github.com/user-attachments/assets/b7e49e6f-587f-4470-8435-8b0f27ed2114

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.

[github-actions[bot]]

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-commenter]

Codecov Report

Attention: Patch coverage is 86.00000% with 14 lines in your changes missing coverage. Please review.

Please upload report for BASE (MUL-199-update-account-list-to-support-grouping@a423183). Learn more about missing BASE report.

Files with missing lines	Patch %	Lines
...Accounts/WalletDetails/BaseWalletDetails/index.tsx	80.00%	1 Missing and 5 partials :warning:
app/components/Nav/App/App.tsx	50.00%	2 Missing :warning:
.../EvmAccountSelectorList/EvmAccountSelectorList.tsx	86.66%	1 Missing and 1 partial :warning:
...MultichainAccounts/WalletDetails/WalletDetails.tsx	33.33%	2 Missing :warning:
...Accounts/WalletDetails/BaseWalletDetails/styles.ts	80.00%	0 Missing and 1 partial :warning:
...nAccounts/WalletDetails/hooks/useWalletBalances.ts	95.23%	0 Missing and 1 partial :warning:

Additional details and impacted files

@@                                Coverage Diff                                 @@
##             MUL-199-update-account-list-to-support-grouping   #16344   +/-   ##
==================================================================================
  Coverage                                                   ?   71.24%           
==================================================================================
  Files                                                      ?     2620           
  Lines                                                      ?    55896           
  Branches                                                   ?     8614           
==================================================================================
  Hits                                                       ?    39825           
  Misses                                                     ?    13558           
  Partials                                                   ?     2513           

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

:rocket: New features to boost your workflow:

• :snowflake: Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• :package: JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[github-actions[bot]]

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: b425a933ac6645f700525dfab89a0edabd4c21fb Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/f8485e13-2394-4f28-8960-bd10ccce2446

[!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[bot]]

Bitrise

❌❌❌ pr_smoke_e2e_pipeline failed on Bitrise! ❌❌❌

Commit hash: af55b17cc4409c6a06638b8c798069f2225ddeae Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/a26f7e99-ab4e-46e7-ae0c-3a8a023fbd95

[!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[bot]]

Bitrise

✅✅✅ pr_smoke_e2e_pipeline passed on Bitrise! ✅✅✅

Commit hash: e9a8d85367db19ed0103086d9444d69620d5d08c Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/eb649f2f-5f48-4221-9a43-c40d15dec265

[!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

[sonarqubecloud[bot]]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
88.0% Coverage on New Code
8.0% Duplication on New Code

See analysis details on SonarQube Cloud

[gantunesr]

I was not able to fully test the wallet details feature because of a few bugs that are not related to this PR, the first related to when you activate the feature flag for multichain accounts. I see that the list is empty and because of this bug I can't verify that the balances are properly calculated,

https://github.com/user-attachments/assets/bfed8b9f-65c2-416f-b66f-00e569ad2e60

The second bug is some UI/UX issues when looking into the account details, here's a video showing some of these issues,

https://github.com/user-attachments/assets/d4ba3514-80ae-4618-96d8-2596eb5b6712