refactor: introduce `useAsyncCallback` and simplify `useAsyncResult` #30538

dbrans · 2025-02-24T20:15:22Z

Description

This PR introduces useAsyncCallback for manual execution of asynchronous functions (e.g., on button clicks) with state management (idle, pending, success, error). useAsyncResult is refactored to build upon useAsyncCallback. This separates concerns of manual execution from automatic execution on mount/update.

Related issues

Fixes:

Manual testing steps

Go to this page...

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 · 2025-02-24T20:15:37Z

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-02-24T20:50:39Z

Builds ready [54b5dc5]

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 (1714 ± 66 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	1470	1937	1706	140	67
		domContentLoaded	1461	1907	1679	133	64
		load	1480	1973	1714	137	66
		domInteractive	26	230	54	51	24
		backgroundConnect	9	106	39	24	12
		firstReactRender	15	73	24	16	7
		getState	5	66	26	23	11
		initialActions	0	1	0	0	0
		loadScripts	1050	1483	1251	130	62
		setupStore	8	70	16	18	9
		uiStartup	1755	2207	1952	144	69

Bundle size diffs

background: 0 Bytes (0.00%)
ui: -70 Bytes (-0.00%)
common: 0 Bytes (0.00%)

metamaskbot · 2025-02-24T21:54:28Z

Builds ready [9c994ee]

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 (1788 ± 84 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	221	2273	1711	385	185
		domContentLoaded	1497	2238	1759	164	79
		load	1510	2258	1788	175	84
		domInteractive	28	164	57	38	18
		backgroundConnect	10	97	31	21	10
		firstReactRender	15	72	36	23	11
		getState	5	60	17	16	8
		initialActions	0	1	0	0	0
		loadScripts	1105	1664	1309	123	59
		setupStore	7	58	19	18	8
		uiStartup	1672	2522	2021	178	85

Bundle size diffs

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

metamaskbot · 2025-02-25T14:03:14Z

Builds ready [c082a29]

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 (1613 ± 86 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	359	2204	1474	408	196
		domContentLoaded	1401	2180	1590	174	84
		load	1406	2208	1613	180	86
		domInteractive	24	153	47	32	15
		backgroundConnect	8	62	29	17	8
		firstReactRender	13	68	30	21	10
		getState	4	66	19	23	11
		initialActions	0	1	0	0	0
		loadScripts	978	1667	1154	148	71
		setupStore	7	55	11	10	5
		uiStartup	1621	2494	1833	200	96

Bundle size diffs

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

metamaskbot · 2025-02-25T17:12:27Z

Builds ready [8aae873]

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 (1495 ± 43 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	422	1689	1442	251	120
		domContentLoaded	1295	1662	1475	88	42
		load	1303	1691	1495	90	43
		domInteractive	21	94	41	23	11
		backgroundConnect	10	63	26	15	7
		firstReactRender	13	59	21	14	7
		getState	5	61	13	17	8
		initialActions	0	1	0	0	0
		loadScripts	932	1264	1079	80	39
		setupStore	7	64	14	16	8
		uiStartup	1505	1880	1694	95	46

Bundle size diffs

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

metamaskbot · 2025-02-25T18:43:28Z

Builds ready [fbcb67b]

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 (1791 ± 76 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	360	2169	1720	350	168
		domContentLoaded	1578	2155	1767	158	76
		load	1588	2172	1791	159	76
		domInteractive	26	121	59	31	15
		backgroundConnect	10	84	32	20	9
		firstReactRender	14	76	39	25	12
		getState	5	62	15	15	7
		initialActions	0	1	0	0	0
		loadScripts	1104	1586	1305	130	63
		setupStore	8	58	20	18	9
		uiStartup	1829	2470	2040	162	78

Bundle size diffs

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

metamaskbot · 2025-02-25T20:03:50Z

Builds ready [d147959]

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 (1656 ± 84 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	1391	1928	1649	166	80
		domContentLoaded	1384	1890	1625	161	77
		load	1392	1950	1656	174	84
		domInteractive	24	76	39	17	8
		backgroundConnect	10	90	34	22	11
		firstReactRender	13	71	37	24	11
		getState	4	68	20	20	9
		initialActions	0	1	0	0	0
		loadScripts	1010	1461	1201	142	68
		setupStore	7	73	17	19	9
		uiStartup	1602	2205	1881	189	91

Bundle size diffs

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

add useAsyncCallback for executing async requests on user action

54b5dc5

metamaskbot added the team-extension-platform Extension Platform team label Feb 24, 2025

fix type errors

9c994ee

simplifying result types and creation

c082a29

dbrans marked this pull request as ready for review February 25, 2025 13:31

dbrans requested review from a team as code owners February 25, 2025 13:31

dbrans requested review from matthewwalsh0 and pedronfigueiredo February 25, 2025 13:32

dbrans added 2 commits February 25, 2025 09:36

fix error type

2c2c0d0

fix result value type

8aae873

fix and clean up types

fbcb67b

fix unit tests

d147959

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

refactor: introduce `useAsyncCallback` and simplify `useAsyncResult` #30538

refactor: introduce `useAsyncCallback` and simplify `useAsyncResult` #30538

dbrans commented Feb 24, 2025 •

edited by github-actions bot

Loading

github-actions bot commented Feb 24, 2025

metamaskbot commented Feb 24, 2025

metamaskbot commented Feb 24, 2025

metamaskbot commented Feb 25, 2025

metamaskbot commented Feb 25, 2025

metamaskbot commented Feb 25, 2025

metamaskbot commented Feb 25, 2025

refactor: introduce useAsyncCallback and simplify useAsyncResult #30538

Are you sure you want to change the base?

refactor: introduce useAsyncCallback and simplify useAsyncResult #30538

Conversation

dbrans commented Feb 24, 2025 • edited by github-actions bot Loading

Description

Related issues

Manual testing steps

Screenshots/Recordings

Before

After

Pre-merge author checklist

Pre-merge reviewer checklist

github-actions bot commented Feb 24, 2025

metamaskbot commented Feb 24, 2025

metamaskbot commented Feb 24, 2025

metamaskbot commented Feb 25, 2025

metamaskbot commented Feb 25, 2025

metamaskbot commented Feb 25, 2025

metamaskbot commented Feb 25, 2025

refactor: introduce `useAsyncCallback` and simplify `useAsyncResult` #30538

refactor: introduce `useAsyncCallback` and simplify `useAsyncResult` #30538

dbrans commented Feb 24, 2025 •

edited by github-actions bot

Loading