refactor: remove circular dependencies in `ui/components/app/snaps` folder #30022

davidmurdoch · 2025-01-30T22:31:38Z

In snaps, COMPONENT_MAPPING imports all (most?) components, and these components then import a file with a function named mapToTemplate, which in turn imports COMPONENT_MAPPING. And round and round it goes.

This PR solved this:

First, we stop importing COMPONENT_MAPPING in mapToTemplate, and instead, pass COMPONENT_MAPPING to the component as a prop.

Then, whenever mapToTemplate is called, a COMPONENT_MAPPING must be given.

github-actions · 2025-01-30T22:31:50Z

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.

metamaskbot · 2025-01-30T23:04:37Z

Builds ready [2427690]

builds: chrome, firefox
builds (flask): chrome, firefox
builds (MMI): chrome
builds (test): chrome, firefox
builds (test-flask): chrome, firefox
build viz: Build System
mv3: Bundle Size Stats
mv2: E2e Actions Stats
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4, 5, 6, 7
- common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
- ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
- content-script: 0
- offscreen: 0

Page Load Metrics (1578 ± 56 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	296	1961	1520	305	146
		domContentLoaded	1388	1949	1557	117	56
		load	1401	1960	1578	117	56
		domInteractive	15	113	43	27	13
		backgroundConnect	9	57	28	17	8
		firstReactRender	15	92	38	26	13
		getState	4	55	13	14	7
		initialActions	0	1	0	0	0
		loadScripts	995	1410	1129	89	43
		setupStore	8	52	13	13	6
		uiStartup	1616	2154	1814	143	69

Bundle size diffs

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

metamaskbot · 2025-01-31T18:59:06Z

Builds ready [b9a429e]

builds: chrome, firefox
builds (flask): chrome, firefox
builds (MMI): chrome
builds (test): chrome, firefox
builds (test-flask): chrome, firefox
build viz: Build System
mv3: Bundle Size Stats
mv2: E2e Actions Stats
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4, 5, 6, 7
- common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
- ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
- content-script: 0
- offscreen: 0

Page Load Metrics (1769 ± 66 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	393	2002	1682	311	150
		domContentLoaded	1587	2161	1745	133	64
		load	1598	2167	1769	137	66
		domInteractive	26	67	37	11	5
		backgroundConnect	10	86	27	21	10
		firstReactRender	17	99	43	29	14
		getState	5	58	21	19	9
		initialActions	0	0	0	0	0
		loadScripts	1103	1566	1273	112	54
		setupStore	8	58	17	17	8
		uiStartup	1797	2456	2063	180	86

Bundle size diffs

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

metamaskbot · 2025-02-03T23:05:22Z

Builds ready [bff7bfe]

builds: chrome, firefox
builds (flask): chrome, firefox
builds (MMI): chrome
builds (test): chrome, firefox
builds (test-flask): chrome, firefox
build viz: Build System
mv3: Bundle Size Stats
mv2: E2e Actions Stats
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4, 5, 6, 7
- common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
- ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12
- content-script: 0
- offscreen: 0

Page Load Metrics (1806 ± 67 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	1625	2090	1810	151	73
		domContentLoaded	1609	2058	1768	129	62
		load	1623	2087	1806	140	67
		domInteractive	25	92	40	20	10
		backgroundConnect	9	183	40	40	19
		firstReactRender	16	100	35	27	13
		getState	5	91	22	24	11
		initialActions	0	1	0	0	0
		loadScripts	1108	1598	1280	129	62
		setupStore	7	76	30	25	12
		uiStartup	1874	2807	2133	238	114

Bundle size diffs

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

metamaskbot · 2025-02-05T23:46:33Z

Builds ready [f4cf334]

builds: chrome, firefox
builds (flask): chrome, firefox
builds (MMI): chrome
builds (test): chrome, firefox
builds (test-flask): chrome, firefox
build viz: Build System
mv3: Bundle Size Stats
mv2: E2e Actions Stats
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4, 5, 6, 7
- common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
- ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12
- content-script: 0
- offscreen: 0

Page Load Metrics (1767 ± 99 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	266	2300	1550	528	253
		domContentLoaded	1486	2225	1732	188	90
		load	1490	2305	1767	207	99
		domInteractive	24	111	42	27	13
		backgroundConnect	8	112	35	30	14
		firstReactRender	15	97	37	25	12
		getState	4	87	14	17	8
		initialActions	0	1	0	0	0
		loadScripts	1075	1729	1261	163	78
		setupStore	7	63	24	22	10
		uiStartup	1737	2800	2015	263	126

metamaskbot · 2025-02-06T22:20:25Z

Builds ready [8e3a1bb]

builds: chrome, firefox
builds (flask): chrome, firefox
builds (MMI): chrome
builds (test): chrome, firefox
builds (test-flask): chrome, firefox
build viz: Build System
mv3: Bundle Size Stats
mv2: E2e Actions Stats
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4, 5, 6, 7
- common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
- ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12
- content-script: 0
- offscreen: 0

Page Load Metrics (1828 ± 60 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	246	2103	1683	454	218
		domContentLoaded	1576	2088	1802	130	62
		load	1594	2102	1828	126	60
		domInteractive	24	176	41	31	15
		backgroundConnect	11	56	30	16	8
		firstReactRender	17	77	35	23	11
		getState	5	62	25	23	11
		initialActions	0	1	0	0	0
		loadScripts	1103	1550	1322	114	55
		setupStore	8	54	13	10	5
		uiStartup	1815	2533	2111	176	85

metamaskbot · 2025-02-07T01:56:53Z

Builds ready [7f5a706]

builds: chrome, firefox
builds (flask): chrome, firefox
builds (MMI): chrome
builds (test): chrome, firefox
builds (test-flask): chrome, firefox
build viz: Build System
mv3: Bundle Size Stats
mv2: E2e Actions Stats
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4, 5, 6, 7
- common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
- ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12
- content-script: 0
- offscreen: 0

Page Load Metrics (1988 ± 93 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	267	2306	1894	418	200
		domContentLoaded	1581	2225	1950	189	91
		load	1617	2287	1988	193	93
		domInteractive	27	86	41	15	7
		backgroundConnect	10	69	35	20	10
		firstReactRender	17	101	48	28	14
		getState	5	67	24	22	11
		initialActions	0	1	0	0	0
		loadScripts	1134	1711	1436	166	80
		setupStore	8	68	17	17	8
		uiStartup	1869	3072	2318	296	142

Bundle size diffs

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

…older

metamaskbot · 2025-02-07T15:31:02Z

Builds ready [0c4d93d]

builds: chrome, firefox
builds (flask): chrome, firefox
builds (MMI): chrome
builds (test): chrome, firefox
builds (test-flask): chrome, firefox
build viz: Build System
mv3: Bundle Size Stats
mv2: E2e Actions Stats
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4, 5, 6, 7
- common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
- ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12
- content-script: 0
- offscreen: 0

Page Load Metrics (1867 ± 158 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	268	2621	1738	552	265
		domContentLoaded	1465	2522	1834	323	155
		load	1473	2547	1867	329	158
		domInteractive	24	84	48	20	10
		backgroundConnect	10	83	38	25	12
		firstReactRender	15	100	47	29	14
		getState	5	85	23	25	12
		initialActions	0	0	0	0	0
		loadScripts	1047	1922	1349	272	130
		setupStore	7	64	22	20	10
		uiStartup	1722	3490	2197	474	227

Bundle size diffs

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

metamaskbot added the team-extension-platform Extension Platform team label Jan 30, 2025

gauthierpetetin assigned davidmurdoch Feb 3, 2025

davidmurdoch marked this pull request as ready for review February 3, 2025 21:59

davidmurdoch requested a review from a team as a code owner February 3, 2025 21:59

davidmurdoch marked this pull request as draft February 3, 2025 22:16

davidmurdoch changed the base branch from main to circles-metrics February 5, 2025 22:58

davidmurdoch force-pushed the circles-metrics branch from fd717cc to b9cdf86 Compare February 5, 2025 23:06

davidmurdoch force-pushed the circles-snaps branch from cb74127 to f4cf334 Compare February 5, 2025 23:09

davidmurdoch marked this pull request as ready for review February 6, 2025 22:57

davidmurdoch requested review from HowardBraham, dbrans and a team as code owners February 6, 2025 22:57

davidmurdoch changed the base branch from circles-metrics to main February 7, 2025 00:07

davidmurdoch requested review from a team as code owners February 7, 2025 00:07

HowardBraham previously approved these changes Feb 7, 2025

View reviewed changes

refactor: remove circular dependencies in ui/components/app/snaps f…

0c4d93d

…older

davidmurdoch dismissed HowardBraham’s stale review via 0c4d93d February 7, 2025 14:55

davidmurdoch force-pushed the circles-snaps branch from 7f5a706 to 0c4d93d Compare February 7, 2025 14:55

davidmurdoch requested a review from HowardBraham February 7, 2025 15:56

HowardBraham approved these changes Feb 7, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

refactor: remove circular dependencies in `ui/components/app/snaps` folder #30022

refactor: remove circular dependencies in `ui/components/app/snaps` folder #30022

davidmurdoch commented Jan 30, 2025 •

edited

Loading

github-actions bot commented Jan 30, 2025

metamaskbot commented Jan 30, 2025

metamaskbot commented Jan 31, 2025

metamaskbot commented Feb 3, 2025

metamaskbot commented Feb 5, 2025

metamaskbot commented Feb 6, 2025

metamaskbot commented Feb 7, 2025

metamaskbot commented Feb 7, 2025

refactor: remove circular dependencies in ui/components/app/snaps folder #30022

Are you sure you want to change the base?

refactor: remove circular dependencies in ui/components/app/snaps folder #30022

Conversation

davidmurdoch commented Jan 30, 2025 • edited Loading

github-actions bot commented Jan 30, 2025

metamaskbot commented Jan 30, 2025

metamaskbot commented Jan 31, 2025

metamaskbot commented Feb 3, 2025

metamaskbot commented Feb 5, 2025

metamaskbot commented Feb 6, 2025

metamaskbot commented Feb 7, 2025

metamaskbot commented Feb 7, 2025

refactor: remove circular dependencies in `ui/components/app/snaps` folder #30022

refactor: remove circular dependencies in `ui/components/app/snaps` folder #30022

davidmurdoch commented Jan 30, 2025 •

edited

Loading