metamask-extension feat: shield-carousel-in-app-nav

Description

Previously, carousel and notification were using deeplink href in contentful data which open new extension tab on user click. This PR check for shield carousel slide and navigate in app instead

Changelog

CHANGELOG entry: Update in app navigation for shield carousel slide

Related issues

Fixes:

Manual testing steps

Go home page
Click on shield carousel
App should navigate to shield page instead of open new extension tab

Screenshots/Recordings

Before

After

Pre-merge author checklist

[x] I've followed MetaMask Contributor Docs and MetaMask Extension Coding Standards.
[x] I've completed the PR template to the best of my ability
[x] I’ve included tests if applicable
[x] I’ve documented my code using JSDoc format if applicable
[x] I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

[x] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
[x] 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.

[!NOTE] Routes Shield carousel banner clicks to the in-app Shield plan route using a new carousel ID constant.

UI

Carousel click handling: When SHIELD_CAROUSEL_ID is clicked, navigate to ${SHIELD_PLAN_ROUTE} with UTM params in ui/components/multichain/account-overview/carousel.tsx.

Integrates useNavigate for in-app routing.

Shared

Adds SHIELD_CAROUSEL_ID in shared/modules/shield/constants.ts.

^{Written by Cursor Bugbot for commit 44a6b84073145728c927bedef76f77ead8b8b2b9. This will update automatically on new commits. Configure here.}

Dec 10 '25 03:12 tuna1207

✨ Files requiring CODEOWNER review ✨

🔑 @MetaMask/accounts-engineers (1 files, +11 -0)

📁 ui/
- 📁 components/
  - 📁 multichain/
    - 📁 account-overview/
      - 📄 carousel.tsx +11 -0

👨‍🔧 @MetaMask/core-extension-ux (1 files, +11 -0)

📁 ui/
- 📁 components/
  - 📁 multichain/
    - 📁 account-overview/
      - 📄 carousel.tsx +11 -0

Dec 10 '25 03:12 metamaskbot

Builds ready [44a6b84]

builds: chrome, firefox
builds (beta): chrome, firefox
builds (flask): chrome, firefox
builds (test): chrome, firefox
builds (test-flask): chrome, firefox
bundle size: Bundle Size Stats
user-actions-benchmark: User Actions Stats
storybook: Storybook
typescript migration: Dashboard
all artifacts
bundle viz:
- background: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9
- common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15
- ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18
- content-script: 0
- offscreen: 0

UI Startup Metrics (1279 ± 94 ms)

Platform	BuildType	Page	Metric	Mean (ms)	Min (ms)	Max (ms)	Std Dev (ms)	P 75 (ms)	P 95 (ms)
Chrome	Browserify	Standard Home	uiStartup	1279	1072	1566	94	1344	1425
			load	1042	872	1320	86	1091	1191
			domContentLoaded	1034	865	1314	85	1084	1186
			domInteractive	26	15	92	17	22	78
			firstPaint	620	74	1332	417	1047	1173
			backgroundConnect	224	199	278	15	232	256
			firstReactRender	50	31	132	18	56	89
			getState	42	17	126	20	51	73
			initialActions	1	0	9	1	1	4
			loadScripts	819	659	1039	81	869	959
			setupStore	14	7	35	6	17	27
			numNetworkReqs	14	6	78	20	6	75
	Browserify	Power User Home	uiStartup	1911	1523	2362	155	1983	2229
			load	1070	889	1346	118	1161	1258
			domContentLoaded	1060	880	1338	117	1151	1250
			domInteractive	30	17	101	21	27	93
			firstPaint	578	93	1345	422	1025	1243
			backgroundConnect	253	198	637	97	236	555
			firstReactRender	47	39	67	5	49	57
			getState	196	139	698	78	203	276
			initialActions	1	0	3	1	1	2
			loadScripts	846	677	1111	116	940	1044
			setupStore	15	7	57	7	14	34
			numNetworkReqs	71	57	207	22	69	126
	Webpack	Standard Home	uiStartup	805	669	1001	79	852	948
			load	647	564	861	75	712	790
			domContentLoaded	641	557	855	75	706	782
			domInteractive	26	15	115	21	22	87
			firstPaint	286	103	793	202	269	756
			backgroundConnect	13	6	93	10	15	31
			firstReactRender	53	33	190	29	60	130
			getState	28	14	58	10	35	47
			initialActions	1	0	5	1	1	2
			loadScripts	638	555	848	74	704	780
			setupStore	11	6	31	5	13	21
			numNetworkReqs	14	6	81	21	6	76
	Webpack	Power User Home	uiStartup	1382	1076	2162	192	1509	1724
			load	721	589	918	91	804	900
			domContentLoaded	714	583	910	91	795	893
			domInteractive	31	16	133	26	25	108
			firstPaint	273	77	878	216	266	823
			backgroundConnect	69	7	651	134	52	552
			firstReactRender	49	41	65	5	51	61
			getState	184	78	662	57	196	251
			initialActions	1	0	2	0	1	1
			loadScripts	711	581	907	90	793	884
			setupStore	16	8	47	9	15	37
			numNetworkReqs	71	57	218	25	66	134
Firefox	Browserify	Standard Home	uiStartup	1307	1041	1976	180	1405	1672
			load	1045	881	1261	90	1104	1210
			domContentLoaded	1044	876	1261	90	1104	1210
			domInteractive	57	31	154	29	84	114
			firstPaint	-	-	-	-	-	-
			backgroundConnect	60	22	806	89	62	177
			firstReactRender	37	30	70	9	37	60
			getState	14	7	138	18	11	28
			initialActions	1	0	2	0	1	2
			loadScripts	1015	860	1192	80	1065	1161
			setupStore	12	6	84	12	10	33
			numNetworkReqs	15	6	85	20	9	74
	Browserify	Power User Home	uiStartup	2675	1646	4020	579	3126	3575
			load	1653	963	2650	509	2133	2371
			domContentLoaded	1653	963	2650	509	2132	2371
			domInteractive	177	33	1114	282	95	988
			firstPaint	-	-	-	-	-	-
			backgroundConnect	171	29	1024	192	200	491
			firstReactRender	58	36	117	15	61	101
			getState	128	62	241	39	157	204
			initialActions	2	0	40	4	2	3
			loadScripts	1593	947	2532	492	2072	2336
			setupStore	34	4	276	44	43	113
			numNetworkReqs	74	56	127	21	76	123
	Webpack	Standard Home	uiStartup	1527	1311	2275	153	1588	1785
			load	1269	1099	1518	98	1329	1461
			domContentLoaded	1269	1098	1518	98	1329	1461
			domInteractive	66	27	169	36	89	133
			firstPaint	-	-	-	-	-	-
			backgroundConnect	55	22	155	32	57	134
			firstReactRender	42	32	146	15	43	77
			getState	13	7	155	15	13	23
			initialActions	1	0	2	1	2	2
			loadScripts	1240	1051	1482	94	1306	1420
			setupStore	15	7	126	19	12	53
			numNetworkReqs	15	6	87	21	8	75
	Webpack	Power User Home	uiStartup	2626	1726	3754	481	2985	3320
			load	1801	1122	2813	435	2164	2383
			domContentLoaded	1801	1121	2813	435	2163	2382
			domInteractive	147	31	1029	238	92	892
			firstPaint	-	-	-	-	-	-
			backgroundConnect	188	21	1050	243	194	895
			firstReactRender	57	37	186	18	63	88
			getState	122	67	257	43	148	212
			initialActions	2	0	30	3	2	7
			loadScripts	1691	1099	2658	411	2025	2354
			setupStore	58	6	943	116	51	306
			numNetworkReqs	71	49	130	21	74	121

📊 Page Load Benchmark Results

Current Commit: 44a6b84 | Date: 12/10/2025

📄 Localhost MetaMask Test Dapp

Samples: 100

Summary

pageLoadTime-> current mean value: 1.04s (±43ms) 🟡 | historical mean value: 1.04s ⬆️ (historical data)
domContentLoaded-> current mean value: 725ms (±36ms) 🟢 | historical mean value: 727ms ⬇️ (historical data)
firstContentfulPaint-> current mean value: 79ms (±14ms) 🟢 | historical mean value: 83ms ⬇️ (historical data)

📈 Detailed Results

Metric	Mean	Std Dev	Min	Max	P95	P99
pageLoadTime	1.04s	43ms	1.02s	1.34s	1.05s	1.34s
domContentLoaded	725ms	36ms	707ms	1.00s	736ms	1.00s
firstPaint	79ms	14ms	60ms	204ms	84ms	204ms
firstContentfulPaint	79ms	14ms	60ms	204ms	84ms	204ms
largestContentfulPaint	0ms	0ms	0ms	0ms	0ms	0ms

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

background: 58 Bytes (0%)
ui: 781 Bytes (0.01%)
common: 98 Bytes (0%)

Dec 10 '25 04:12 metamaskbot