Whats new popup #10583

danjm · 2021-03-04T06:26:39Z

Fixes /~https://github.com/MetaMask/MetaMask-planning/issues/23

This PR adds the "See what's new" feature to the extension. This PR requires #329 of /~https://github.com/MetaMask/controllers, and #375 which aims to update #329

Videos of the behaviour are below:

Peek.2021-03-04.02-22.mp4

Peek.2021-03-04.02-20.mp4

Peek.2021-03-03.17-55.mp4

github-actions · 2021-03-04T06:26:57Z

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.

shared/notifications/index.js

danjm · 2021-03-05T14:17:55Z

This requires a migration to ensure that users who have already seen the swaps popup do not see the swaps notification

danjm · 2021-03-08T11:18:10Z

This requires a migration to ensure that users who have already seen the swaps popup do not see the swaps notification

Done in d84fb66

danjm · 2021-03-08T11:19:35Z

e2e test failures will be resolved when MetaMask/core#375 and MetaMask/core#329 are merged and a new version of controllers is released

shared/notifications/index.js

ui/app/pages/swaps/build-quote/build-quote.js

ui/app/pages/home/home.container.js

ui/app/components/ui/popover/popover.component.js

ui/app/components/app/whats-new-popup/whats-new-popup.js

ui/app/selectors/selectors.js

Gudahtt · 2021-03-18T21:07:35Z

There are a few conflicts to resolve it seems

metamaskbot · 2021-03-24T13:39:40Z

Builds ready [b0d8463]

builds: chrome, firefox, opera
bundle viz: background, ui, inpage, contentscript, ui-libs, bg-libs, phishing-detect
build viz: Build System
code coverage: Report
storybook: Storybook
all artifacts

Page Load Metrics (660 ± 22 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	45	79	60	8	4
		domContentLoaded	585	754	659	47	22
		load	590	755	660	46	22
		domInteractive	584	754	659	47	22

metamaskbot · 2021-03-25T20:26:15Z

Builds ready [0c882e3]

builds: chrome, firefox, opera
bundle viz: background, ui, inpage, contentscript, ui-libs, bg-libs, phishing-detect
build viz: Build System
code coverage: Report
storybook: Storybook
all artifacts

Page Load Metrics (646 ± 23 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	44	72	58	9	4
		domContentLoaded	572	742	645	48	23
		load	573	743	646	49	23
		domInteractive	572	742	644	48	23

app/scripts/platforms/extension.js

ui/app/store/actionConstants.js

ui/app/components/app/whats-new-popup/whats-new-popup.js

ui/app/selectors/selectors.js

danjm · 2021-04-28T00:42:09Z

Final notification images and messages (as confirmed with Jacob and Omna) were added in this commit: 63128a1

danjm · 2021-04-28T00:46:45Z

QA test of a couple scenarios looks like this:

Peek.2021-04-27.22-15.mp4

metamaskbot · 2021-04-28T00:51:54Z

Builds ready [233b70e]

builds: chrome, firefox, opera
bundle viz: background, ui, inpage, contentscript, ui-libs, bg-libs, phishing-detect
build viz: Build System
code coverage: Report
storybook: Storybook
all artifacts

Page Load Metrics (570 ± 40 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	43	80	61	9	4
		domContentLoaded	403	663	569	83	40
		load	405	664	570	83	40
		domInteractive	403	662	568	83	40

…te on img load

ui/app/components/app/whats-new-popup/whats-new-popup.js

metamaskbot · 2021-04-28T13:13:56Z

Builds ready [e805cf2]

builds: chrome, firefox, opera
bundle viz: background, ui, inpage, contentscript, ui-libs, bg-libs, phishing-detect
build viz: Build System
code coverage: Report
storybook: Storybook
all artifacts

Page Load Metrics (615 ± 64 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	50	84	66	8	4
		domContentLoaded	384	864	614	134	65
		load	386	865	615	134	64
		domInteractive	384	864	614	134	65

Co-authored-by: Mark Stacey <markjstacey@gmail.com>

…n functions

Gudahtt

LGTM!

Had a few more suggestions that don't need to block, about how the notification render functions could be simplified.

ui/app/components/app/whats-new-popup/whats-new-popup.js

metamaskbot · 2021-04-28T13:56:57Z

Builds ready [b4849b5]

builds: chrome, firefox, opera
bundle viz: background, ui, inpage, contentscript, ui-libs, bg-libs, phishing-detect
build viz: Build System
code coverage: Report
storybook: Storybook
all artifacts

Page Load Metrics (658 ± 42 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	46	78	62	8	4
		domContentLoaded	487	777	657	87	42
		load	489	779	658	86	42
		domInteractive	487	777	656	86	42

danjm · 2021-04-28T13:58:42Z

@Gudahtt I addressed your latest comments in the latest commit. You said they were non-blocking, but I liked those suggestions and its probably easier to resolve them in this PR.

ui/app/components/app/whats-new-popup/whats-new-popup.js

Co-authored-by: Mark Stacey <markjstacey@gmail.com>

danjm · 2021-04-28T14:13:40Z

Okay, final QA pass looks good:

Peek.2021-04-28.11-43.mp4

metamaskbot · 2021-04-28T14:30:10Z

Builds ready [190fbcb]

builds: chrome, firefox, opera
bundle viz: background, ui, inpage, contentscript, ui-libs, bg-libs, phishing-detect
build viz: Build System
code coverage: Report
storybook: Storybook
all artifacts

Page Load Metrics (723 ± 58 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	46	94	67	13	6
		domContentLoaded	480	821	722	120	58
		load	481	823	723	121	58
		domInteractive	480	821	722	120	58

Gudahtt

LGTM!

Left one more suggestion that I thought of after seeing that video. Also I hadn't noticed how small this popup looks until now. It looks especially silly on large screens, having to squish the text into such a small area. This seems to match the designs, so maybe this is good for now, but I think it would be better to let the popup be larger, to make the best use of the space we have.

ui/app/components/app/whats-new-popup/whats-new-popup.js

metamaskbot · 2021-04-28T15:26:58Z

Builds ready [7b120a4]

builds: chrome, firefox, opera
bundle viz: background, ui, inpage, contentscript, ui-libs, bg-libs, phishing-detect
build viz: Build System
code coverage: Report
storybook: Storybook
all artifacts

Page Load Metrics (830 ± 64 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	46	107	75	15	7
		domContentLoaded	513	1094	826	134	64
		load	522	1095	830	133	64
		domInteractive	513	1093	825	134	64

shared/notifications/index.js

Gudahtt

LGTM!

metamaskbot · 2021-04-28T16:40:46Z

Builds ready [507263b]

builds: chrome, firefox, opera
bundle viz: background, ui, inpage, contentscript, ui-libs, bg-libs, phishing-detect
build viz: Build System
code coverage: Report
storybook: Storybook
all artifacts

Page Load Metrics (637 ± 42 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	46	86	63	10	5
		domContentLoaded	386	721	636	88	42
		load	387	723	637	88	42
		domInteractive	386	720	635	88	42

danjm requested a review from a team as a code owner March 4, 2021 06:26

danjm requested a review from ryanml March 4, 2021 06:26

Gudahtt requested changes Mar 4, 2021

View reviewed changes

shared/notifications/index.js Outdated Show resolved Hide resolved

shared/notifications/index.js Outdated Show resolved Hide resolved

ryanml reviewed Mar 4, 2021

View reviewed changes

shared/notifications/index.js Show resolved Hide resolved

danjm force-pushed the whats-new-popup branch from f92f532 to 7943400 Compare March 5, 2021 00:32