feat: add shield rewards modal

[lionellbriones]

Description

• adds reward points details on shield plan
• adds shield reward points modal

Changelog

CHANGELOG entry: adds shield rewards modal

Related issues

Fixes:

Manual testing steps

1. Login to MetaMask with an account without shield subscription
2. Go to Menu > Settings : click on Transaction Shield
3. Shows Shield Entry modal: click on get started
4. Redirects to Shield plan form
5. Observe what you get list
6. Click on Rewards detail
7. Shows Rewards modal

Screenshots/Recordings

Before

After

Yearly view

Monthly view

Rewards modal

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]

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]

✨ Files requiring CODEOWNER review ✨

🔐 @MetaMask/web3auth (2 files, +109 -0)

• 📁 ui/
  • 📁 pages/
    • 📁 shield-plan/
      • 📄 shield-plan.tsx +27 -0
      • 📄 shield-rewards-modal.tsx +82 -0

[metamaskbot]

Builds ready [b8020e0]

• 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 (1220 ± 115 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	1220	1002	1633	115	1304	1426
			load	1028	864	1441	104	1089	1227
			domContentLoaded	1023	859	1433	103	1083	1216
			domInteractive	25	15	88	19	20	83
			firstPaint	487	86	1231	383	954	1173
			backgroundConnect	212	189	275	13	215	238
			firstReactRender	30	19	62	10	33	54
			getState	34	14	113	15	39	62
			initialActions	1	0	6	1	1	2
			loadScripts	816	661	1231	101	871	988
			setupStore	11	6	29	4	13	18
			numNetworkReqs	12	5	77	21	5	73
	Browserify	Power User Home	uiStartup	2106	1794	2888	264	2271	2658
			load	1028	898	1528	138	1031	1399
			domContentLoaded	1013	885	1506	137	1017	1390
			domInteractive	35	18	132	23	32	109
			firstPaint	527	83	1522	406	958	1365
			backgroundConnect	267	200	811	120	232	561
			firstReactRender	57	40	96	12	62	87
			getState	202	140	759	96	203	301
			initialActions	1	0	8	1	1	3
			loadScripts	805	677	1295	137	793	1191
			setupStore	21	11	50	8	26	40
			numNetworkReqs	149	69	398	70	203	302
	Webpack	Standard Home	uiStartup	859	719	1136	94	898	1064
			load	657	580	885	72	680	826
			domContentLoaded	652	576	880	72	676	820
			domInteractive	28	16	136	24	22	96
			firstPaint	210	89	677	125	200	601
			backgroundConnect	10	5	47	6	11	27
			firstReactRender	32	20	290	27	34	42
			getState	28	13	91	13	36	49
			initialActions	1	0	5	1	1	2
			loadScripts	649	574	871	70	674	811
			setupStore	11	7	41	5	13	19
			numNetworkReqs	12	5	77	20	5	73
	Webpack	Power User Home	uiStartup	1704	1335	2352	270	1965	2187
			load	689	591	1013	101	690	956
			domContentLoaded	679	583	1007	102	678	949
			domInteractive	37	18	192	34	34	137
			firstPaint	278	87	958	185	266	669
			backgroundConnect	99	7	618	185	21	567
			firstReactRender	62	44	92	10	69	84
			getState	183	138	772	80	181	221
			initialActions	1	0	3	1	1	2
			loadScripts	676	581	998	100	675	940
			setupStore	19	9	56	9	22	48
			numNetworkReqs	162	66	397	80	211	387
Firefox	Browserify	Standard Home	uiStartup	1339	1128	1745	147	1438	1621
			load	1097	931	1343	86	1158	1259
			domContentLoaded	1097	931	1342	87	1157	1258
			domInteractive	64	31	163	31	90	124
			firstPaint	-	-	-	-	-	-
			backgroundConnect	50	22	198	34	57	128
			firstReactRender	24	19	56	7	24	39
			getState	17	6	216	32	10	72
			initialActions	1	0	3	1	2	2
			loadScripts	1066	915	1256	76	1115	1213
			setupStore	15	5	151	20	12	63
			numNetworkReqs	11	5	68	16	7	61
	Browserify	Power User Home	uiStartup	2609	2022	4240	380	2721	3635
			load	1180	1025	1610	139	1185	1535
			domContentLoaded	1180	1025	1609	139	1185	1535
			domInteractive	128	37	582	115	115	457
			firstPaint	-	-	-	-	-	-
			backgroundConnect	121	28	1046	124	118	372
			firstReactRender	61	38	135	16	65	98
			getState	280	49	916	214	315	818
			initialActions	3	0	40	5	2	6
			loadScripts	1146	1002	1586	134	1151	1484
			setupStore	168	8	849	208	193	713
			numNetworkReqs	100	59	303	61	79	239
	Webpack	Standard Home	uiStartup	1504	1281	2051	147	1585	1773
			load	1252	1075	1620	102	1304	1434
			domContentLoaded	1252	1074	1620	102	1304	1434
			domInteractive	57	25	156	35	85	132
			firstPaint	-	-	-	-	-	-
			backgroundConnect	47	20	192	29	47	118
			firstReactRender	26	19	90	10	26	35
			getState	18	7	191	31	13	110
			initialActions	1	0	2	1	2	2
			loadScripts	1226	1058	1595	97	1279	1393
			setupStore	12	6	73	9	13	34
			numNetworkReqs	11	5	65	15	7	53
	Webpack	Power User Home	uiStartup	2955	2313	6221	688	2986	4544
			load	1402	1137	2775	301	1382	2190
			domContentLoaded	1401	1137	2775	301	1382	2190
			domInteractive	107	29	493	104	100	414
			firstPaint	-	-	-	-	-	-
			backgroundConnect	131	30	961	118	130	340
			firstReactRender	71	41	244	36	67	184
			getState	327	85	1741	284	543	790
			initialActions	2	0	8	1	2	3
			loadScripts	1359	1117	2596	273	1333	2091
			setupStore	124	6	1143	197	129	620
			numNetworkReqs	101	59	252	60	79	244

📊 Page Load Benchmark Results

Current Commit: b8020e0 | Date: 11/28/2025

📄 Localhost MetaMask Test Dapp

Samples: 100

Summary

• pageLoadTime-> current mean value: 1.05s (±49ms) 🟡 | historical mean value: 1.03s ⬆️ (historical data)
• domContentLoaded-> current mean value: 736ms (±64ms) 🟢 | historical mean value: 720ms ⬆️ (historical data)
• firstContentfulPaint-> current mean value: 91ms (±128ms) 🟢 | historical mean value: 77ms ⬆️ (historical data)

📈 Detailed Results

Metric	Mean	Std Dev	Min	Max	P95	P99
pageLoadTime	1.05s	49ms	1.02s	1.40s	1.10s	1.40s
domContentLoaded	736ms	64ms	707ms	1.29s	748ms	1.29s
firstPaint	91ms	128ms	60ms	1.36s	88ms	1.36s
firstContentfulPaint	91ms	128ms	60ms	1.36s	88ms	1.36s
largestContentfulPaint	0ms	0ms	0ms	0ms	0ms	0ms

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

• background: 58 Bytes (0%)
• ui: 3.29 KiB (0.04%)
• common: 344 Bytes (0%)