feat: funding method modal by julesat22 · Pull Request #26426 · MetaMask/metamask-extension

julesat22 · 2024-08-14T19:23:14Z

Description

Developed the "FundingMethodModal". This CTA displays when a user has no native token balance, and triggering the CTA will now render a modal with 3 options:

"Buy" - Navigates user to Portfolio Buy page
"Receive" - Renders the QR code modal inside the extension
"Transfer" - Will navigate the user to the "Transfers" page with their associated account address to be consumed inside the Portfolio app for CEX transfers

Related issues

Fixes: --

Manual testing steps

Inside extension, select an account with a 0 token balance
Click the "Get Started" CTA
See that the modal renders and looks good in both light + dark mode
Click on all 3 of the funding method options and ensure the appropriate action is triggered

NOTE

We currently have a feature branch in Portfolio for "Transfer", so this page (/transfer) is not currently in prod. Clicking the "Transfer funds" CTA inside the FundingMethodsModal will give you a page not found error at the moment. This PR will get merge once that code, in Portfolio, is live.

Screenshots/Recordings

Before

After

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.

github-actions · 2024-08-14T19:23:29Z

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.

…to MMPD-1296

codecov · 2024-08-14T21:06:14Z

Codecov Report

Attention: Patch coverage is 85.71429% with 6 lines in your changes missing coverage. Please review.

Project coverage is 70.14%. Comparing base (61c04b3) to head (8406107).
Report is 1 commits behind head on develop.

Files with missing lines	Patch %	Lines
ui/components/app/assets/asset-list/asset-list.js	53.85%	6 Missing ⚠️

Additional details and impacted files

@@             Coverage Diff             @@
##           develop   #26426      +/-   ##
===========================================
+ Coverage    70.13%   70.14%   +0.01%     
===========================================
  Files         1425     1427       +2     
  Lines        49669    49709      +40     
  Branches     13895    13904       +9     
===========================================
+ Hits         34833    34867      +34     
- Misses       14836    14842       +6

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

metamaskbot · 2024-08-14T21:18:35Z

Builds ready [2412d15]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
builds (test): chrome, firefox
builds (test-flask): 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, 5, 6
- common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (80 ± 8 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	81	157	108	18	9
		domContentLoaded	11	54	28	11	5
		load	50	109	80	17	8
		domInteractive	11	54	28	11	5

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

background: 0 Bytes (0.00%)
ui: 5.8 KiB (0.08%)
common: 587 Bytes (0.01%)

…to MMPD-1296

metamaskbot · 2024-08-16T17:59:03Z

Builds ready [4095418]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
builds (test): chrome, firefox
builds (test-flask): 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, 5, 6
- common: 0, 1, 10, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (89 ± 15 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	66	242	131	50	24
		domContentLoaded	44	156	84	33	16
		load	51	163	89	32	15
		domInteractive	14	49	29	9	4

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

background: 0 Bytes (0.00%)
ui: 6.74 KiB (0.09%)
common: 587 Bytes (0.01%)

metamaskbot · 2024-08-16T18:38:17Z

Builds ready [16a45b6]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
builds (test): chrome, firefox
builds (test-flask): 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, 5, 6
- common: 0, 1, 10, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (90 ± 22 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	84	365	121	59	28
		domContentLoaded	57	281	86	47	22
		load	62	281	90	46	22
		domInteractive	19	92	37	17	8

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

background: 0 Bytes (0.00%)
ui: 6.75 KiB (0.09%)
common: 587 Bytes (0.01%)

metamaskbot · 2024-09-06T16:26:18Z

Builds ready [e7eaf09]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
builds (test): chrome, firefox
builds (test-flask): 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, 5
- common: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1899 ± 121 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	229	3103	1665	678	326
		domContentLoaded	1611	2658	1878	236	113
		load	1623	2753	1899	252	121
		domInteractive	17	96	41	19	9

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

background: 0 Bytes (0.00%)
ui: 6.75 KiB (0.09%)
common: 587 Bytes (0.01%)

metamaskbot · 2024-09-06T17:14:00Z

Builds ready [317e976]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
builds (test): chrome, firefox
builds (test-flask): 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, 5
- common: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1894 ± 122 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	286	2779	1746	532	255
		domContentLoaded	1647	2771	1864	250	120
		load	1656	2781	1894	253	122
		domInteractive	14	178	44	33	16

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

background: 0 Bytes (0.00%)
ui: 6.75 KiB (0.09%)
common: 587 Bytes (0.01%)

darkwing

Added a quick nit but this looks great :)

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

metamaskbot · 2024-09-09T17:11:49Z

Builds ready [615430d]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
builds (test): chrome, firefox
builds (test-flask): 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, 5
- common: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1802 ± 128 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	221	2501	1660	516	248
		domContentLoaded	1487	2491	1783	261	125
		load	1495	2503	1802	266	128
		domInteractive	14	186	40	36	17

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

background: 0 Bytes (0.00%)
ui: 6.75 KiB (0.09%)
common: 587 Bytes (0.01%)

…to MMPD-1296

metamaskbot · 2024-09-09T18:13:04Z

Builds ready [8406107]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
builds (test): chrome, firefox
builds (test-flask): 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, 5
- common: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1682 ± 82 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	1424	2147	1684	170	82
		domContentLoaded	1417	2140	1667	172	83
		load	1425	2145	1682	172	82
		domInteractive	15	181	41	34	16

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

background: 0 Bytes (0.00%)
ui: 6.76 KiB (0.09%)
common: 587 Bytes (0.01%)

metamaskbot · 2024-09-10T15:52:10Z

Builds ready [9a31f2a]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
builds (test): chrome, firefox
builds (test-flask): 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, 5
- common: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1907 ± 96 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	224	2290	1841	417	200
		domContentLoaded	1602	2263	1885	196	94
		load	1638	2280	1907	200	96
		domInteractive	13	70	36	13	6

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

background: 0 Bytes (0.00%)
ui: 6.76 KiB (0.09%)
common: 587 Bytes (0.01%)

metamaskbot · 2024-09-10T16:58:00Z

Builds ready [0f146e2]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
builds (test): chrome, firefox
builds (test-flask): 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, 5
- common: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1685 ± 79 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	283	2046	1605	342	164
		domContentLoaded	1393	2038	1665	165	79
		load	1401	2046	1685	164	79
		domInteractive	14	133	46	29	14

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

background: 0 Bytes (0.00%)
ui: 6.76 KiB (0.09%)
common: 587 Bytes (0.01%)

sonarqubecloud · 2024-09-12T18:27:42Z

Quality Gate passed

Issues
6 New issues
0 Accepted issues

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

See analysis details on SonarCloud

metamaskbot · 2024-09-12T18:58:28Z

Builds ready [28c4fa9]

builds: chrome, firefox
builds (beta): chrome
builds (flask): chrome, firefox
builds (MMI): chrome, firefox
builds (test): chrome, firefox
builds (test-flask): 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, 5
- common: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1780 ± 48 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	205	2004	1576	564	271
		domContentLoaded	1551	1935	1769	100	48
		load	1570	1941	1780	99	48
		domInteractive	18	72	33	13	6

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

background: 0 Bytes (0.00%)
ui: 6.76 KiB (0.09%)
common: 587 Bytes (0.01%)

metamaskbot · 2024-09-29T17:09:49Z

Missing release label release-12.5.0 on PR. Adding release label release-12.5.0 on PR and removing other release labels(release-12.6.0), as PR was added to branch 12.5.0 when release was cut.

feat: funding method modal

9d3de43

julesat22 added DO-NOT-MERGE Pull requests that should not be merged team-portfolio labels Aug 14, 2024

julesat22 requested a review from a team as a code owner August 14, 2024 19:23

chore: move receive modal

d90c605

julesat22 self-assigned this Aug 14, 2024

Julia Collins and others added 5 commits August 14, 2024 12:50

fix: eslint errors

cfbf763

Merge branch 'develop' into MMPD-1296

f43aac0

chore: update type to resolve linting error

5fd6f9e

Merge branch 'MMPD-1296' of github.com:MetaMask/metamask-extension in…

76bf952

…to MMPD-1296

fix: linting errors

2412d15

Julia Collins and others added 8 commits August 14, 2024 14:20

chore: update url

50ca969

chore: add tab to portfolio url

248f9c4

fix: prettier and failing unit test

c0a6c52

Merge branch 'develop' into MMPD-1296

221d4a8

chore: add tracking events in for nav items

af3814d

Merge branch 'develop' into MMPD-1296

a4da8ff

Merge branch 'MMPD-1296' of github.com:MetaMask/metamask-extension in…

276c559

…to MMPD-1296

chore: fix tests

4095418

chore: add deps

16a45b6

julesat22 added 5 commits August 19, 2024 08:24

Merge branch 'develop' into MMPD-1296

0420d34

Merge branch 'develop' into MMPD-1296

40a0f16

Merge branch 'develop' into MMPD-1296

f7ab659

Merge branch 'develop' into MMPD-1296

6181009

Merge branch 'develop' into MMPD-1296

7368d7c

Merge branch 'develop' into MMPD-1296

e7eaf09

julesat22 requested a review from a team as a code owner September 6, 2024 15:56

Merge branch 'develop' into MMPD-1296

317e976

julesat22 added 2 commits September 9, 2024 08:37

Merge branch 'develop' into MMPD-1296

d206128

Merge branch 'develop' into MMPD-1296

615430d

darkwing reviewed Sep 9, 2024

View reviewed changes

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

Julia Collins added 2 commits September 9, 2024 10:41

chore: add conditional address check

617510d

Merge branch 'MMPD-1296' of github.com:MetaMask/metamask-extension in…

8406107

…to MMPD-1296

julesat22 requested a review from darkwing September 9, 2024 17:44

darkwing approved these changes Sep 9, 2024

View reviewed changes

Merge branch 'develop' into MMPD-1296

9a31f2a

Merge branch 'develop' into MMPD-1296

0f146e2

jclancy93 approved these changes Sep 11, 2024

View reviewed changes

julesat22 added 2 commits September 12, 2024 08:28

Merge branch 'develop' into MMPD-1296

8b9e3c6

Merge branch 'develop' into MMPD-1296

28c4fa9

julesat22 merged commit dfc12b6 into develop Sep 12, 2024

julesat22 deleted the MMPD-1296 branch September 12, 2024 18:48

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

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

metamaskbot added release-12.5.0 Issue or pull request that will be included in release 12.5.0 and removed release-12.6.0 Issue or pull request that will be included in release 12.6.0 labels Sep 29, 2024

Conversation

julesat22 commented Aug 14, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Related issues

Manual testing steps

Screenshots/Recordings

Before

After

Pre-merge author checklist

Pre-merge reviewer checklist

Uh oh!

github-actions bot commented Aug 14, 2024

Uh oh!

codecov bot commented Aug 14, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

metamaskbot commented Aug 14, 2024

Uh oh!

metamaskbot commented Aug 16, 2024

Uh oh!

metamaskbot commented Aug 16, 2024

Uh oh!

metamaskbot commented Sep 6, 2024

Uh oh!

metamaskbot commented Sep 6, 2024

Uh oh!

darkwing left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

metamaskbot commented Sep 9, 2024

Uh oh!

metamaskbot commented Sep 9, 2024

Uh oh!

metamaskbot commented Sep 10, 2024

Uh oh!

metamaskbot commented Sep 10, 2024

Uh oh!

sonarqubecloud bot commented Sep 12, 2024

Quality Gate passed

Uh oh!

metamaskbot commented Sep 12, 2024

Uh oh!

metamaskbot commented Sep 29, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

julesat22 commented Aug 14, 2024 •

edited

Loading

codecov bot commented Aug 14, 2024 •

edited

Loading