Skip to content

Conversation

@sophieqgu
Copy link
Contributor

@sophieqgu sophieqgu commented Nov 17, 2025

Description

https://consensyssoftware.atlassian.net/browse/RWDS-268
Part 6 of #36827 introduces new rewards onboarding components

Open in GitHub Codespaces

Changelog

CHANGELOG entry: null

Related issues

Fixes:

Manual testing steps

  1. Go to this page...

Screenshots/Recordings

Before

After

Pre-merge author checklist

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.

Note

Implements the Rewards onboarding flow (modal with steps, error toast/banner, referral opt‑in) with full tests and new locale strings.

  • UI/Flow:
    • Add Rewards onboarding modal ui/components/app/rewards/onboarding/OnboardingModal.tsx with steps OnboardingIntroStep, OnboardingStep1, OnboardingStep2, OnboardingStep3, OnboardingStep4 and ProgressIndicator.
    • New error surfaces: RewardsErrorBanner and RewardsErrorToast.
  • Logic:
    • Intro step handles geo eligibility, hardware wallet checks, and candidate subscription ID states (pending/retry/error) with retry actions; advances through steps; persists modal‑shown flag.
    • Step 4 supports referral code validation UI and opt‑in action; legal links via constants in onboarding/constants.ts.
  • i18n:
    • Add/enhance Rewards onboarding and error strings in app/_locales/en/messages.json and app/_locales/en_GB/messages.json.
  • Tests:
    • Comprehensive tests for modal, steps 1–4, error banner/toast, and progress indicator.

Written by Cursor Bugbot for commit 978bad2. This will update automatically on new commits. Configure here.

@github-actions
Copy link
Contributor

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 metamaskbot added the team-rewards Rewards team label Nov 17, 2025
onActionClick,
}),
);
}, [actionText, description, dispatch, onActionClick, title]);
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Bug: Functions Break Redux State Principles

The handleClose callback stores a function reference (onActionClick) in Redux state via setErrorToast. Redux state must only contain serializable data, and storing functions violates this principle. This breaks Redux DevTools, time-travel debugging, state persistence, and can cause unexpected behavior when the function reference changes. The function should be stored outside Redux state or referenced by an identifier instead.

Fix in Cursor Fix in Web

@sophieqgu sophieqgu force-pushed the rewards-onboarding-components branch from 6b69107 to 7536625 Compare November 17, 2025 20:05
@metamaskbot
Copy link
Collaborator

Builds ready [7536625]
UI Startup Metrics (1223 ± 111 ms)
PlatformBuildTypePageMetricMean (ms)Min (ms)Max (ms)Std Dev (ms)P 75 (ms)P 95 (ms)
ChromeBrowserifyStandard HomeuiStartup12231067188311112911398
load1060915173210911391187
domContentLoaded1053913172310911311181
domInteractive221486161873
firstPaint64796123642710801170
backgroundConnect2292172799231251
firstReactRender25185552635
getState20793102438
initialActions104112
loadScripts8306821499109911958
setupStore1072731114
numNetworkReqs1367520673
BrowserifyPower User HomeuiStartup21491991285220921862852
load1162981172121314091721
domContentLoaded1137959171121913971711
domInteractive561814451140144
firstPaint580188140140110061401
backgroundConnect26023728715274287
firstReactRender75471262187126
getState21316528236241282
initialActions104124
loadScripts906727146121511731461
setupStore281255123355
numNetworkReqs1249518531145185
WebpackStandard HomeuiStartup8156941177988091070
load60254994787600842
domContentLoaded59554493584595828
domInteractive1711106151354
firstPaint20954938206194768
backgroundConnect241081142660
firstReactRender29198093436
getState1162631215
initialActions103111
loadScripts59254292581593818
setupStore1153741215
numNetworkReqs1367419871
WebpackPower User HomeuiStartup1107929158222813151582
load647576863101778863
domContentLoaded63356583693740836
domInteractive33131183378118
firstPaint324119744206575744
backgroundConnect641122876148228
firstReactRender40374524145
getState1389416323151163
initialActions101011
loadScripts62956482690730826
setupStore1262682526
numNetworkReqs846514127124141
FirefoxBrowserifyStandard HomeuiStartup15071323184710815591749
load1276113915278713241460
domContentLoaded1276113915278713231459
domInteractive62332934259154
firstPaint------
backgroundConnect4325172225090
firstReactRender28235262943
getState1278891124
initialActions102122
loadScripts1250112114878512961419
setupStore147111151237
numNetworkReqs1266616759
BrowserifyPower User HomeuiStartup33142641444160341984441
load15471331209724118122097
domContentLoaded15471330209724118122097
domInteractive257109651170387651
firstPaint------
backgroundConnect53710412914119661291
firstReactRender926511413102114
getState193102589107204589
initialActions216136
loadScripts14971294194521617831945
setupStore85352575198257
numNetworkReqs1277424363228243
WebpackStandard HomeuiStartup16231453215113816441953
load1372123616569614121602
domContentLoaded1372123616569614121601
domInteractive55301542663115
firstPaint------
backgroundConnect49201752953108
firstReactRender342581113759
getState127131131124
initialActions203123
loadScripts1341120216329213711576
setupStore196183261587
numNetworkReqs1366816866
WebpackPower User HomeuiStartup33602392449665440774496
load17071412208121819522081
domContentLoaded17061410208021819502080
domInteractive22960634182436634
firstPaint------
backgroundConnect5566811193719251119
firstReactRender876412719105127
getState19896566109219566
initialActions213133
loadScripts16501389201120318912011
setupStore91244429599442
numNetworkReqs1287222653199226
📊 Page Load Benchmark Results

Current Commit: 7536625 | Date: 11/17/2025

📄 Localhost MetaMask Test Dapp

Samples: 100

Summary

  • pageLoadTime-> current mean value: 1.04s (±38ms) 🟡 | historical mean value: 1.05s ⬇️ (historical data)
  • domContentLoaded-> current mean value: 724ms (±36ms) 🟢 | historical mean value: 730ms ⬇️ (historical data)
  • firstContentfulPaint-> current mean value: 77ms (±12ms) 🟢 | historical mean value: 80ms ⬇️ (historical data)

📈 Detailed Results

Metric Mean Std Dev Min Max P95 P99
pageLoadTime 1.04s 38ms 1.01s 1.33s 1.07s 1.33s
domContentLoaded 724ms 36ms 701ms 987ms 748ms 987ms
firstPaint 77ms 12ms 60ms 180ms 88ms 180ms
firstContentfulPaint 77ms 12ms 60ms 180ms 88ms 180ms
largestContentfulPaint 0ms 0ms 0ms 0ms 0ms 0ms

jbblanc
jbblanc previously approved these changes Nov 18, 2025
VGR-GIT
VGR-GIT previously approved these changes Nov 18, 2025
borderColor: referralCodeIsError
? 'border-error-default'
: 'border-muted',
}}
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Bug: Style Prop Misuse Breaks TextField Appearance

The style prop on the TextField component contains Tailwind CSS class names as values (e.g., 'bg-background-pressed') instead of actual inline CSS values. This will cause the styles to not be applied, as browsers cannot interpret class names as inline style properties. The backgroundColor and borderColor should use actual CSS values or valid CSS custom properties.

Fix in Cursor Fix in Web

@metamaskbot
Copy link
Collaborator

Builds ready [cb40b68]
UI Startup Metrics (1252 ± 93 ms)
PlatformBuildTypePageMetricMean (ms)Min (ms)Max (ms)Std Dev (ms)P 75 (ms)P 95 (ms)
ChromeBrowserifyStandard HomeuiStartup1252109314989313151441
load108294312768411421240
domContentLoaded107693912688411361234
domInteractive231390181977
firstPaint61787127241910731179
backgroundConnect2342222617239249
firstReactRender3120118113445
getState23774122646
initialActions108112
loadScripts8487141046839061001
setupStore1272431319
numNetworkReqs1367519672
BrowserifyPower User HomeuiStartup21681908289423722932894
load1165972182723513821827
domContentLoaded1146954181223913691812
domInteractive571721657107216
firstPaint792217185750610901857
backgroundConnect2502362678256267
firstReactRender73471231983123
getState23318236553275365
initialActions103113
loadScripts915728157523511441575
setupStore29185083550
numNetworkReqs1209218028160180
WebpackStandard HomeuiStartup8517231193948481134
load62055796384619900
domContentLoaded61255294679613882
domInteractive181280131456
firstPaint19457954205180736
backgroundConnect261173143162
firstReactRender3320236233640
getState1163541216
initialActions103111
loadScripts60954993577611871
setupStore1264251321
numNetworkReqs1367519872
WebpackPower User HomeuiStartup1088921179626013341796
load670576985150793985
domContentLoaded647565946127780946
domInteractive36131073898107
firstPaint38870952273585952
backgroundConnect571019664149196
firstReactRender40374424144
getState1439516121156161
initialActions101011
loadScripts643563935123769935
setupStore1362982529
numNetworkReqs916613428130134
FirefoxBrowserifyStandard HomeuiStartup15221371213513115531796
load1277117415438213111474
domContentLoaded1276117415428213101474
domInteractive56341843356144
firstPaint------
backgroundConnect4324170194974
firstReactRender28235262843
getState1276661321
initialActions213123
loadScripts1251114114637712811411
setupStore177241271338
numNetworkReqs1267215756
BrowserifyPower User HomeuiStartup34792688466258742594662
load15921280212725718792127
domContentLoaded15921280212625718782126
domInteractive23672551169474551
firstPaint------
backgroundConnect708163146042011031460
firstReactRender83491342295134
getState14910020227175202
initialActions213133
loadScripts15271251208823117872088
setupStore13236489102146489
numNetworkReqs1277324562213245
WebpackStandard HomeuiStartup16971439228116217192105
load14281214179411414661695
domContentLoaded14271214179411414661695
domInteractive58311883064123
firstPaint------
backgroundConnect51271522457116
firstReactRender3627102123648
getState138134141227
initialActions217123
loadScripts13961194172010514411652
setupStore16899161459
numNetworkReqs1366817765
WebpackPower User HomeuiStartup32822642416052639834160
load16771459215022719352150
domContentLoaded16771459215022719352150
domInteractive24883649194427649
firstPaint------
backgroundConnect451111918278737918
firstReactRender995014324121143
getState18910741670214416
initialActions224134
loadScripts16241412208923218822089
setupStore903350410981504
numNetworkReqs1297225059186250
📊 Page Load Benchmark Results

Current Commit: cb40b68 | Date: 11/18/2025

📄 Localhost MetaMask Test Dapp

Samples: 100

Summary

  • pageLoadTime-> current mean value: 1.04s (±61ms) 🟡 | historical mean value: 1.05s ⬇️ (historical data)
  • domContentLoaded-> current mean value: 732ms (±71ms) 🟢 | historical mean value: 730ms ⬆️ (historical data)
  • firstContentfulPaint-> current mean value: 89ms (±130ms) 🟢 | historical mean value: 80ms ⬆️ (historical data)

📈 Detailed Results

Metric Mean Std Dev Min Max P95 P99
pageLoadTime 1.04s 61ms 1.01s 1.46s 1.07s 1.46s
domContentLoaded 732ms 71ms 704ms 1.30s 750ms 1.30s
firstPaint 89ms 130ms 56ms 1.38s 88ms 1.38s
firstContentfulPaint 89ms 130ms 56ms 1.38s 88ms 1.38s
largestContentfulPaint 0ms 0ms 0ms 0ms 0ms 0ms

@sophieqgu sophieqgu requested review from a team as code owners November 18, 2025 17:46
Base automatically changed from rewards-hooks to main November 18, 2025 18:45
@sophieqgu sophieqgu dismissed stale reviews from jbblanc and VGR-GIT November 18, 2025 18:45

The base branch was changed.

Update translation
@sophieqgu sophieqgu force-pushed the rewards-onboarding-components branch from cb40b68 to 978bad2 Compare November 18, 2025 18:55
@sophieqgu sophieqgu enabled auto-merge November 18, 2025 19:11
@metamaskbot
Copy link
Collaborator

Builds ready [978bad2]
UI Startup Metrics (1229 ± 111 ms)
PlatformBuildTypePageMetricMean (ms)Min (ms)Max (ms)Std Dev (ms)P 75 (ms)P 95 (ms)
ChromeBrowserifyStandard HomeuiStartup12291058161811113001443
load1073930148610511361268
domContentLoaded1067924147810511291263
domInteractive2214100162070
firstPaint72893149243610801267
backgroundConnect2322202919235244
firstReactRender2819157142839
getState1976192241
initialActions103112
loadScripts84167912551059031036
setupStore1052331016
numNetworkReqs1367318670
BrowserifyPower User HomeuiStartup24662110302023626413020
load12541073165520614911655
domContentLoaded12311051164120714551641
domInteractive682218457155184
firstPaint683231164656614861646
backgroundConnect27825831915285319
firstReactRender905514626102146
getState26419347172311471
initialActions217127
loadScripts980808138320111991383
setupStore27964123364
numNetworkReqs1219618929150189
WebpackStandard HomeuiStartup8417041256988421136
load61755699387610907
domContentLoaded61055095882606889
domInteractive181279121550
firstPaint23755962234208791
backgroundConnect251169132658
firstReactRender311977103651
getState1163141216
initialActions104111
loadScripts60754894780603878
setupStore1163551319
numNetworkReqs1367719871
WebpackPower User HomeuiStartup1132922180430314531804
load684579994163940994
domContentLoaded664567959146879959
domInteractive34131013485101
firstPaint28470932246527932
backgroundConnect651027086174270
firstReactRender40364424244
getState1399216925154169
initialActions101011
loadScripts660565945142869945
setupStore1272682426
numNetworkReqs826213727126137
FirefoxBrowserifyStandard HomeuiStartup14991322202812615451805
load1261112915017813151427
domContentLoaded1261112915017813141427
domInteractive54341632859128
firstPaint------
backgroundConnect4326198234783
firstReactRender27225662843
getState1172841120
initialActions103123
loadScripts1235110914767512931358
setupStore13698111233
numNetworkReqs1267515755
BrowserifyPower User HomeuiStartup32432503474878344424748
load15471289227830618852278
domContentLoaded15471289227830718852278
domInteractive26689608189496608
firstPaint------
backgroundConnect49011114474169051447
firstReactRender895312919101129
getState18196537101192537
initialActions41174317
loadScripts14941246224728818142247
setupStore902325054120250
numNetworkReqs1308026469232264
WebpackStandard HomeuiStartup16251432236219716252188
load13731212188613313941706
domContentLoaded13721212188513313931705
domInteractive57304504760113
firstPaint------
backgroundConnect50241452759136
firstReactRender342483123480
getState138147151123
initialActions103122
loadScripts13401194185112113641614
setupStore197242381277
numNetworkReqs1366917766
WebpackPower User HomeuiStartup31772477441247634314412
load16991413220922419072209
domContentLoaded16981413220822519072208
domInteractive23268644182420644
firstPaint------
backgroundConnect340116951235495951
firstReactRender896012320107123
getState17979553102196553
initialActions52419341
loadScripts16431388214222718682142
setupStore13527488125159488
numNetworkReqs1275722153182221
📊 Page Load Benchmark Results

Current Commit: 978bad2 | Date: 11/18/2025

📄 Localhost MetaMask Test Dapp

Samples: 100

Summary

  • pageLoadTime-> current mean value: 1.04s (±81ms) 🟡 | historical mean value: 1.04s ⬆️ (historical data)
  • domContentLoaded-> current mean value: 725ms (±79ms) 🟢 | historical mean value: 726ms ⬇️ (historical data)
  • firstContentfulPaint-> current mean value: 82ms (±61ms) 🟢 | historical mean value: 77ms ⬆️ (historical data)

📈 Detailed Results

Metric Mean Std Dev Min Max P95 P99
pageLoadTime 1.04s 81ms 1.01s 1.81s 1.06s 1.81s
domContentLoaded 725ms 79ms 697ms 1.48s 741ms 1.48s
firstPaint 82ms 61ms 60ms 684ms 84ms 684ms
firstContentfulPaint 82ms 61ms 60ms 684ms 84ms 684ms
largestContentfulPaint 0ms 0ms 0ms 0ms 0ms 0ms
Bundle size diffs [🚨 Warning! Bundle size has increased!]
  • background: 53 Bytes (0%)
  • ui: 0 Bytes (0%)
  • common: 3.2 KiB (0.04%)

@sophieqgu sophieqgu added this pull request to the merge queue Nov 18, 2025
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Nov 18, 2025
@sophieqgu sophieqgu added this pull request to the merge queue Nov 18, 2025
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Nov 18, 2025
@sophieqgu sophieqgu added this pull request to the merge queue Nov 18, 2025
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Nov 18, 2025
@sophieqgu sophieqgu added this pull request to the merge queue Nov 18, 2025
Merged via the queue into main with commit d5f1dbb Nov 18, 2025
173 of 174 checks passed
@sophieqgu sophieqgu deleted the rewards-onboarding-components branch November 18, 2025 22:27
@github-actions github-actions bot locked and limited conversation to collaborators Nov 18, 2025
@metamaskbot metamaskbot added the release-13.11.0 Issue or pull request that will be included in release 13.11.0 label Nov 18, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

release-13.11.0 Issue or pull request that will be included in release 13.11.0 size-XL team-rewards Rewards team

Projects

None yet

Development

Successfully merging this pull request may close these issues.

6 participants