feat: ✨ better storybook stories for the notification pages #27861

matteoscurati · 2024-10-15T10:12:32Z

Description

This pull request enhances the Storybook stories for the notification pages. The improvements aim to provide better clarity and usability for developers working with notification components. The changes include more detailed and organized stories, making it easier to understand and test different notification states and components.

Related issues

N/A

Manual testing steps

Open Storybook in your development environment
Navigate to the notification pages section
Review the updated stories for clarity and completeness
Verify that all notification states are represented and functioning as expected

Screenshots/Recordings

Before

N/A

After

N/A

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-10-15T10:12:45Z

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.

Prithpal-Sooriya · 2024-10-15T11:25:34Z

ui/pages/notification-details/notification-details.stories.tsx

+import { NotificationDetailsFooter } from './notification-details-footer/notification-details-footer';
+
+type Notification = NotificationServicesController.Types.INotification;
+const { processNotification } = NotificationServicesController.Processors;


I kind of want us to use the new subpath exports.

In future I want us to deprecate imports like this (since they are expensive)

metamaskbot · 2024-10-16T10:07:51Z

Builds ready [cf66689]

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, 11, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1909 ± 109 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	350	2511	1827	406	195
		domContentLoaded	1593	2498	1878	226	109
		load	1597	2514	1909	227	109
		domInteractive	16	184	57	37	18
		backgroundConnect	8	83	33	26	13
		firstReactRender	46	210	88	43	21
		getState	5	60	14	16	7
		initialActions	0	1	0	0	0
		loadScripts	1168	2050	1432	219	105
		setupStore	12	72	37	25	12
		uiStartup	1800	2711	2135	232	112

Bundle size diffs

background: 0 Bytes (0.00%)
ui: 37 Bytes (0.00%)
common: 0 Bytes (0.00%)

sonarcloud · 2024-10-16T12:25:49Z

Quality Gate passed

Issues
0 New issues
0 Accepted issues

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

See analysis details on SonarCloud

metamaskbot · 2024-10-16T12:45:05Z

Builds ready [2322c20]

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, 11, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1795 ± 141 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	283	2984	1714	440	211
		domContentLoaded	1515	2923	1770	287	138
		load	1519	2956	1795	294	141
		domInteractive	27	162	48	28	14
		backgroundConnect	8	89	29	22	11
		firstReactRender	45	306	102	53	26
		getState	4	74	14	18	9
		initialActions	0	1	0	0	0
		loadScripts	1083	2543	1309	300	144
		setupStore	11	90	29	26	13
		uiStartup	1739	3187	2022	324	156

Bundle size diffs

background: 0 Bytes (0.00%)
ui: 37 Bytes (0.00%)
common: 0 Bytes (0.00%)

metamaskbot · 2024-10-21T15:29:05Z

Builds ready [36288c3]

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, 11, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1948 ± 98 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	1653	2377	1936	163	78
		domContentLoaded	1604	2084	1877	137	66
		load	1653	2622	1948	203	98
		domInteractive	19	95	53	24	12
		backgroundConnect	9	494	71	107	51
		firstReactRender	49	417	132	91	44
		getState	5	225	30	51	25
		initialActions	0	0	0	0	0
		loadScripts	1169	1600	1404	115	55
		setupStore	11	304	52	65	31
		uiStartup	1797	4423	2298	565	271

Bundle size diffs

background: 0 Bytes (0.00%)
ui: 37 Bytes (0.00%)
common: 0 Bytes (0.00%)

metamaskbot · 2024-10-21T17:22:49Z

Builds ready [7f9b8c6]

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, 11, 2, 3, 4, 5, 6, 7, 8, 9
- content-script: 0
- offscreen: 0
- ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1990 ± 97 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	342	2422	1813	502	241
		domContentLoaded	1674	2386	1948	195	94
		load	1682	2402	1990	202	97
		domInteractive	27	95	47	19	9
		backgroundConnect	10	118	45	32	15
		firstReactRender	64	136	95	16	8
		getState	4	84	27	25	12
		initialActions	0	1	0	0	0
		loadScripts	1203	1880	1444	166	80
		setupStore	10	88	33	22	11
		uiStartup	1878	3095	2225	285	137

Bundle size diffs

background: 0 Bytes (0.00%)
ui: 37 Bytes (0.00%)
common: 0 Bytes (0.00%)

feat: ✨ better storybook stories for the notification pages

5019bf2

matteoscurati added the team-notifications Notifications team label Oct 15, 2024

matteoscurati added 2 commits October 15, 2024 12:28

feat: ✨ avoid to have a null value in the storybook main.js file

910651a

feat: ✨ use default args

1b492ff

Prithpal-Sooriya reviewed Oct 15, 2024

View reviewed changes

matteoscurati added 2 commits October 16, 2024 11:34

revert: ⏪ revert bump @metamask/notification-services-controller package

59d7b22

Merge branch 'develop' into feat/improve-notifications-stories

cf66689

matteoscurati added 3 commits October 16, 2024 13:57

feat: ✨ add storybook env to use the right infura project id

e7bb1b2

Merge branch 'develop' into feat/improve-notifications-stories

6f24104

feat: 💚 update build file

2322c20

Merge branch 'develop' into feat/improve-notifications-stories

36288c3

Merge branch 'develop' into feat/improve-notifications-stories

7f9b8c6

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: ✨ better storybook stories for the notification pages #27861

feat: ✨ better storybook stories for the notification pages #27861

matteoscurati commented Oct 15, 2024

github-actions bot commented Oct 15, 2024

Prithpal-Sooriya Oct 15, 2024

metamaskbot commented Oct 16, 2024

sonarcloud bot commented Oct 16, 2024

metamaskbot commented Oct 16, 2024

metamaskbot commented Oct 21, 2024

metamaskbot commented Oct 21, 2024

feat: ✨ better storybook stories for the notification pages #27861

Are you sure you want to change the base?

feat: ✨ better storybook stories for the notification pages #27861

Conversation

matteoscurati commented Oct 15, 2024

Description

Related issues

Manual testing steps

Screenshots/Recordings

Before

After

Pre-merge author checklist

Pre-merge reviewer checklist

github-actions bot commented Oct 15, 2024

Prithpal-Sooriya Oct 15, 2024

Choose a reason for hiding this comment

metamaskbot commented Oct 16, 2024

sonarcloud bot commented Oct 16, 2024

Quality Gate passed

metamaskbot commented Oct 16, 2024

metamaskbot commented Oct 21, 2024

metamaskbot commented Oct 21, 2024