UX: Display total fiat balance on home screen #20941

darkwing · 2023-09-18T20:49:47Z

Explanation

Calculates and displays the total fiat value of a given account's native currency and tokens.

Fixes: https://github.com/MetaMask/MetaMask-planning/issues/1191

Screenshots/Screencaps

Manual Testing Steps

Look at an account with native currency and token balances
See correct balance displayed above token list
Switch chains using the network picker
Ensure balance on L2 is correct

Pre-merge author checklist

I've clearly explained:
- What problem this PR is solving
- How this problem was solved
- How reviewers can test my changes
Sufficient automated test coverage has been added

Pre-merge reviewer checklist

Manual testing (e.g. pull and build branch, run in browser, test code being changed)
PR is linked to the appropriate GitHub issue
IF this PR fixes a bug in the release milestone, add this PR to the release milestone

If further QA is required (e.g. new feature, complex testing steps, large refactor), add the Extension QA Board label.

In this case, a QA Engineer approval will be be required.

github-actions · 2023-09-18T20:50:02Z

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 · 2023-09-20T22:20:45Z

Codecov Report

Attention: 3 lines in your changes are missing coverage. Please review.

Comparison is base (48184fe) 68.40% compared to head (968a113) 68.42%.
Report is 45 commits behind head on develop.

Additional details and impacted files

@@             Coverage Diff             @@
##           develop   #20941      +/-   ##
===========================================
+ Coverage    68.40%   68.42%   +0.02%     
===========================================
  Files         1006     1006              
  Lines        40218    40235      +17     
  Branches     10758    10761       +3     
===========================================
+ Hits         27508    27529      +21     
+ Misses       12710    12706       -4

Files	Coverage Δ
shared/modules/conversion.utils.ts	`81.82% <100.00%> (+1.49%)`	⬆️
ui/components/app/token-list/token-list.js	`100.00% <100.00%> (+27.27%)`	⬆️
ui/selectors/selectors.js	`86.75% <100.00%> (ø)`
ui/components/app/asset-list/asset-list.js	`81.63% <94.44%> (+6.63%)`	⬆️
...ts/multichain/balance-overview/balance-overview.js	`60.71% <66.67%> (+2.09%)`	⬆️

... and 1 file with indirect coverage changes

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

metamaskbot · 2023-09-20T22:30:03Z

Builds ready [bd2361b]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
build viz: Build System
mv3: Background Module Init Stats
mv3: UI Init Stats
mv3: Module Load Stats
mv3: Bundle Size Stats
mv2: E2e Actions Stats
code coverage: Report
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4
- common: 0, 1, 2, 3, 4, 5, 6
- content-script: 0
- contentscript: contentscript
- disable-console: disable-console
- inpage: inpage
- policy-load: policy-load
- sentry-install: sentry-install
- ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1530 ± 51 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	119	170	135	15	7
		domContentLoaded	1369	1883	1530	107	51
		load	1369	1883	1530	107	51
		domInteractive	1369	1883	1530	107	51

Bundle size diffs [🚨 Warning! Bundle size has increased!]

background: 0 Bytes (0.00%)
ui: -142 Bytes (-0.00%)
common: 115 Bytes (0.00%)

NidhiKJha

Excellent!!

Checked with native balance
Checked with detected tokens and overall balance is correct

But we need the loading state here, it should not be removed

ui/components/app/asset-list/asset-list.js

metamaskbot · 2023-09-21T19:59:56Z

Builds ready [cbcdef4]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
build viz: Build System
mv3: Background Module Init Stats
mv3: UI Init Stats
mv3: Module Load Stats
mv3: Bundle Size Stats
mv2: E2e Actions Stats
code coverage: Report
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4
- common: 0, 1, 2, 3, 4, 5, 6
- content-script: 0
- contentscript: contentscript
- disable-console: disable-console
- inpage: inpage
- policy-load: policy-load
- sentry-install: sentry-install
- ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1991 ± 95 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	128	196	171	20	10
		domContentLoaded	1533	2329	1990	198	95
		load	1533	2330	1991	199	95
		domInteractive	1533	2329	1990	198	95

Bundle size diffs [🚨 Warning! Bundle size has increased!]

background: 0 Bytes (0.00%)
ui: -93 Bytes (-0.00%)
common: 115 Bytes (0.00%)

NidhiKJha

Awesome!!

metamaskbot · 2023-09-23T02:34:08Z

Builds ready [9108e64]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
build viz: Build System
mv3: Background Module Init Stats
mv3: UI Init Stats
mv3: Module Load Stats
mv3: Bundle Size Stats
mv2: E2e Actions Stats
code coverage: Report
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4
- common: 0, 1, 2, 3, 4, 5, 6
- content-script: 0
- contentscript: contentscript
- disable-console: disable-console
- inpage: inpage
- policy-load: policy-load
- sentry-install: sentry-install
- ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1530 ± 71 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	118	178	141	18	8
		domContentLoaded	1355	2062	1528	143	69
		load	1356	2089	1530	148	71
		domInteractive	1355	2062	1528	143	69

Bundle size diffs [🚨 Warning! Bundle size has increased!]

background: 0 Bytes (0.00%)
ui: -81 Bytes (-0.00%)
common: 115 Bytes (0.00%)

shared/modules/conversion.utils.ts

metamaskbot · 2023-09-27T14:15:49Z

Builds ready [968a113]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
build viz: Build System
mv3: Background Module Init Stats
mv3: UI Init Stats
mv3: Module Load Stats
mv3: Bundle Size Stats
mv2: E2e Actions Stats
code coverage: Report
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4
- common: 0, 1, 2, 3, 4, 5, 6
- content-script: 0
- contentscript: contentscript
- disable-console: disable-console
- inpage: inpage
- policy-load: policy-load
- sentry-install: sentry-install
- ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1694 ± 78 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	118	208	155	27	13
		domContentLoaded	1477	1927	1694	163	78
		load	1477	1927	1694	163	78
		domInteractive	1477	1927	1694	163	78

Bundle size diffs [🚨 Warning! Bundle size has increased!]

background: 0 Bytes (0.00%)
ui: -81 Bytes (-0.00%)
common: 115 Bytes (0.00%)

darkwing requested a review from a team as a code owner September 18, 2023 20:49

darkwing added team-extension-ux DEPRECATED: please use "team-wallet-ux" label instead needs-ux-ds-review labels Sep 18, 2023

darkwing force-pushed the fiat-balance branch from 931a191 to b56f10d Compare September 18, 2023 21:49

vthomas13 previously approved these changes Sep 19, 2023

View reviewed changes

darkwing dismissed vthomas13’s stale review via bd2361b September 20, 2023 21:51

darkwing force-pushed the fiat-balance branch from b56f10d to bd2361b Compare September 20, 2023 21:51

NidhiKJha reviewed Sep 21, 2023

View reviewed changes

ui/components/app/asset-list/asset-list.js Show resolved Hide resolved

kevinghim added the team-extension-client label Sep 21, 2023

kevinghim assigned darkwing Sep 21, 2023

darkwing added 4 commits September 21, 2023 13:52

UX: Display total fiat balance on home screen

497f21e

Fix story

1502a3c

Add loading state

e4bdbcb

Update snapshot

cbcdef4

darkwing force-pushed the fiat-balance branch from bd2361b to cbcdef4 Compare September 21, 2023 19:25

NidhiKJha previously approved these changes Sep 22, 2023

View reviewed changes

vthomas13 previously approved these changes Sep 22, 2023

View reviewed changes

Add test

9108e64

darkwing dismissed stale reviews from vthomas13 and NidhiKJha via 9108e64 September 22, 2023 19:06

NidhiKJha previously approved these changes Sep 26, 2023

View reviewed changes

DDDDDanica reviewed Sep 27, 2023

View reviewed changes

shared/modules/conversion.utils.ts Show resolved Hide resolved

shared/modules/conversion.utils.ts Show resolved Hide resolved

Add tests

968a113

darkwing dismissed NidhiKJha’s stale review via 968a113 September 27, 2023 13:39

DDDDDanica approved these changes Sep 27, 2023

View reviewed changes

NidhiKJha approved these changes Sep 27, 2023

View reviewed changes

darkwing merged commit 78e5863 into develop Sep 27, 2023
9 checks passed

darkwing deleted the fiat-balance branch September 27, 2023 18:16

github-actions bot locked and limited conversation to collaborators Sep 27, 2023

metamaskbot added the release-11.3.0 Issue or pull request that will be included in release 11.3.0 label Sep 27, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

UX: Display total fiat balance on home screen #20941

UX: Display total fiat balance on home screen #20941

darkwing commented Sep 18, 2023 •

edited

Loading

github-actions bot commented Sep 18, 2023

codecov bot commented Sep 20, 2023 •

edited

Loading

metamaskbot commented Sep 20, 2023

NidhiKJha left a comment

metamaskbot commented Sep 21, 2023

NidhiKJha left a comment

metamaskbot commented Sep 23, 2023

metamaskbot commented Sep 27, 2023

UX: Display total fiat balance on home screen #20941

UX: Display total fiat balance on home screen #20941

Conversation

darkwing commented Sep 18, 2023 • edited Loading

Explanation

Screenshots/Screencaps

Manual Testing Steps

Pre-merge author checklist

Pre-merge reviewer checklist

github-actions bot commented Sep 18, 2023

codecov bot commented Sep 20, 2023 • edited Loading

Codecov Report

metamaskbot commented Sep 20, 2023

NidhiKJha left a comment

Choose a reason for hiding this comment

metamaskbot commented Sep 21, 2023

NidhiKJha left a comment

Choose a reason for hiding this comment

metamaskbot commented Sep 23, 2023

metamaskbot commented Sep 27, 2023

darkwing commented Sep 18, 2023 •

edited

Loading

codecov bot commented Sep 20, 2023 •

edited

Loading