feat(engagement): GE 217 design updates and feature flag cp-7.80.0 by samir-acle · Pull Request #30985 · MetaMask/metamask-mobile

samir-acle · 2026-06-03T03:38:20Z

Description

Revises the push notification onboarding UI (NewUserSheet, ExistingUserSheet) to match updated Figma specs — adjusting typography, spacing, icon alignment, and close button positioning. Gates the pre-push prompt behind the prePushPromptEnabled remote feature flag, which enables/disables the sheet based on a minimum app version. Registers the flag in the feature flag registry and wires the selector to read from it.

Changelog

CHANGELOG entry: Update push notification onboarding sheets with revised designs and wire pre-push prompt behind a remote feature flag

Related issues

Fixes:

Manual testing steps

Feature: my feature name

  Scenario: user [verb for user action]
    Given [describe expected initial app state]

    When user [verb for user action]
    Then [describe expected outcome]

Screenshots/Recordings

Before

After

IOS

ANDROID

Pre-merge author checklist

I've followed MetaMask Contributor Docs and MetaMask Mobile 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.

Performance checks (if applicable)

I've tested on Android
- Ideally on a mid-range device; emulator is acceptable
I've tested with a power user scenario
- Use these power-user SRPs to import wallets with many accounts and tokens
I've instrumented key operations with Sentry traces for production performance metrics
- See trace() for usage and addToken for an example

For performance guidelines and tooling, see the Performance Guide.

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 · 2026-06-03T03:38:30Z

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.

baptiste-marchand · 2026-06-03T13:15:52Z

+    inProd: false,
+    productionDefault: {
+      enabled: false,
+      minimumVersion: '7.99.0',


Why are you setting it to 7.99? Shouldn't it be 7.81 since it's only impacting tests?

This is the production default, which is a disabled state, so I don't think it really matters.

baptiste-marchand

LGTM. I'll approve once the CI passes

Adds a new version-gated feature flag selector `selectPrePushPromptEnabled` under a new `engagement/` folder in `featureFlagController/` selectors. The folder is scoped for engagement-related flags and follows the same `validatedVersionGatedFeatureFlag` pattern as `brazeBannerHome`. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

… flag When the `prePushPromptMinVersion` feature flag is OFF (default), suppress the soft pre-push prompt sheets. If the user is eligible for the push_permission variant, the canonical `useEnableNotifications` path still requests native OS push permission directly (preserving pre-feature behavior). The `marketing_consent` prompt is simply suppressed. `PushNotificationOnboardingRoot` is now a thin gate: it waits for remote flags to load (`selectRemoteFeatureFlagsLoaded`, based on `cacheTimestamp > 0`) before choosing between the existing `PushNotificationOnboardingRootContent` (flag ON) and the new `PushNotificationPermissionFallback` (flag OFF). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

- Replace inline NotifCard with a shared NotifCard component that has a gradient border and dark outer container - Add close (X) button to NewUserSheet and ExistingUserSheet - ExistingUserSheet: add notification preview card, remove consent card, make both buttons Primary - NewUserSheet: reduce to single preview card, rename CTA to "Enable notifications", change "Not now" to Tertiary variant - Update copy for new_user body and existing_user body Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

- Extract shared NotifCard with fading border overlay (MaskedView + LinearGradient), bg-muted icon container, and BodyXs text - Add close button (ButtonIcon Lg) to both sheets, positioned near top-right edge outside content padding - Align sheet layout: px-6 for NotifCard area, px-4 for text/buttons, pt-2 top padding - Bump sheet title from HeadingMd to HeadingLg - Hardcode selectPrePushPromptEnabled to true for local testing (TODO: revert) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Removes the local-testing hardcode that forced the flag to true. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

… spec Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

…ire selector Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

…omptEnabled Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

This reverts commit ca1ebab.

…s in push onboarding sheets Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

github-actions · 2026-06-03T15:23:24Z

🔍 Smart E2E Test Selection

Selected E2E tags: SmokeSeedlessOnboarding, SmokeWalletPlatform
Selected Performance tags: None (no tests recommended)
Risk Level: low
AI Confidence: 78%

click to see 🤖 AI reasoning details

E2E Test Selection:

The PR introduces:

A new prePushPromptEnabled remote feature flag selector and registry entry (disabled by default, inProd: false).
UI redesign of ExistingUserSheet and NewUserSheet push notification onboarding components (layout changes, new shared NotifCard component, button style changes).
A new PushNotificationPermissionFallback component rendered when the flag is OFF.
A critical behavioral change in PushNotificationOnboardingRoot.tsx: isTestEnvironment replaced with isE2EOrExpEnvironment. Both still return null in E2E environments, so the component is still suppressed during E2E tests — no test breakage expected from this.
Minor localization string updates.

E2E Impact Analysis:

The PushNotificationOnboardingRoot still returns null in E2E environments (the guard condition if (isE2EOrExpEnvironment) { return null; } is preserved), so the push notification sheets won't appear during E2E tests.
The ExistingUserSheet test IDs (BUTTON_CONFIRM, BUTTON_NOT_NOW, CONTAINER, TITLE, BODY) are unchanged, so dismissPushNotificationExistingUserSheet in wallet.flow.ts will continue to work correctly.
SmokeSeedlessOnboarding is selected because it tests the full onboarding lifecycle (including social login flows) where the push notification onboarding component is most relevant. The PushNotificationPermissionFallback is a new component that runs in the onboarding path.
SmokeWalletPlatform is selected because it covers wallet lifecycle analytics and the wallet home arrival flow where the push notification root component is mounted (via app/components/Nav/Main/index.js).

Not selected:

Most other tags are unaffected since the push notification component is suppressed in E2E environments and the feature flag defaults to disabled.
Performance tests: The dismissPushNotificationExistingUserSheet function used in performance onboarding specs relies on unchanged test IDs, so no performance test changes are needed.

Performance Test Selection:
The changes are to push notification onboarding UI components and a feature flag. The feature flag defaults to disabled (inProd: false), and the push notification component is suppressed in E2E/performance test environments. The dismissPushNotificationExistingUserSheet function used in performance onboarding specs relies on unchanged test IDs (ExistingUserSheetSelectorsIDs.BUTTON_CONFIRM), so no performance test impact is expected. No performance-sensitive code paths (rendering loops, state management, data loading) were modified.

View GitHub Actions results

joaoloureirop

platform changes lgtm

mm-token-exchange-service Bot added the team-engagement label Jun 3, 2026

github-actions Bot added the size-L label Jun 3, 2026

samir-acle changed the title ~~Ge 217 design updates and feature flag~~ feat(Engagement): GE 217 design updates and feature flag Jun 3, 2026

samir-acle marked this pull request as ready for review June 3, 2026 04:00

samir-acle requested review from a team as code owners June 3, 2026 04:00

samir-acle enabled auto-merge June 3, 2026 04:00

samir-acle changed the title ~~feat(Engagement): GE 217 design updates and feature flag~~ feat(Engagement): GE 217 design updates and feature flag cp-7.80.0 Jun 3, 2026

samir-acle added this to PR review queue Jun 3, 2026

github-project-automation Bot moved this to Needs dev review in PR review queue Jun 3, 2026

github-actions Bot added the risk:medium AI analysis: medium risk label Jun 3, 2026

samir-acle changed the title ~~feat(Engagement): GE 217 design updates and feature flag cp-7.80.0~~ feat(engagement): GE 217 design updates and feature flag cp-7.80.0 Jun 3, 2026

github-actions Bot added risk:low AI analysis: low risk and removed risk:medium AI analysis: medium risk labels Jun 3, 2026

baptiste-marchand reviewed Jun 3, 2026

View reviewed changes

samir-acle force-pushed the ge-217-design-updates-and-feature-flag branch from edbc524 to f7e862e Compare June 3, 2026 13:41

github-actions Bot added risk:medium AI analysis: medium risk and removed risk:low AI analysis: low risk labels Jun 3, 2026

samir-acle and others added 9 commits June 3, 2026 11:18

fix(engagement): restore selectPrePushPromptEnabled to use remote flag

504eed2

Removes the local-testing hardcode that forced the flag to true. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat(engagement): adjust close button position in push prompt sheets

24be8af

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat(engagement): align fox icon to top in NotifCard

48d2641

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat(engagement): fix NotifCard typography and spacing to match Figma…

578290d

… spec Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat(engagement): reduce gap between sheet title and body to 8px

bc8e19d

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

samir-acle and others added 7 commits June 3, 2026 11:19

feat(engagement): register prePushPromptMinVersion feature flag and w…

c447f48

…ire selector Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

fix(engagement): correct NewUserSheet test to match single preview card

f3bd81c

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

fix(engagement): revert string changes

fdb9f93

fix(engagement): rename pre-push prompt feature flag key to prePushPr…

945daa2

…omptEnabled Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Revert "fix(engagement): revert string changes"

a920e81

This reverts commit ca1ebab.

fix(engagement): use looser isE2EOrExpEnvironment

2ed9bcf

test(engagement): replace fragile string checks with testId assertion…

9809cdb

…s in push onboarding sheets Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

samir-acle force-pushed the ge-217-design-updates-and-feature-flag branch from 3c4d05a to 9809cdb Compare June 3, 2026 15:19

github-actions Bot added risk:low AI analysis: low risk and removed risk:medium AI analysis: medium risk labels Jun 3, 2026

baptiste-marchand approved these changes Jun 3, 2026

View reviewed changes

cortisiko approved these changes Jun 3, 2026

View reviewed changes

joaoloureirop approved these changes Jun 3, 2026

View reviewed changes

samir-acle added this pull request to the merge queue Jun 3, 2026

github-project-automation Bot moved this from Needs dev review to Review finalised - Ready to be merged in PR review queue Jun 3, 2026

Merged via the queue into main with commit 1644b77 Jun 3, 2026
214 of 216 checks passed

samir-acle deleted the ge-217-design-updates-and-feature-flag branch June 3, 2026 17:35

github-project-automation Bot moved this from Review finalised - Ready to be merged to Merged, Closed or Archived in PR review queue Jun 3, 2026

github-actions Bot locked and limited conversation to collaborators Jun 3, 2026

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat(engagement): GE 217 design updates and feature flag cp-7.80.0#30985

feat(engagement): GE 217 design updates and feature flag cp-7.80.0#30985
samir-acle merged 16 commits into
mainfrom
ge-217-design-updates-and-feature-flag

samir-acle commented Jun 3, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Jun 3, 2026

Uh oh!

baptiste-marchand Jun 3, 2026

Uh oh!

samir-acle Jun 3, 2026

Uh oh!

baptiste-marchand left a comment

Uh oh!

github-actions Bot commented Jun 3, 2026

Uh oh!

joaoloureirop left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Uh oh!

Conversation

samir-acle commented Jun 3, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Changelog

Related issues

Manual testing steps

Screenshots/Recordings

Before

After

Pre-merge author checklist

Performance checks (if applicable)

Pre-merge reviewer checklist

Uh oh!

github-actions Bot commented Jun 3, 2026

Uh oh!

baptiste-marchand Jun 3, 2026

Choose a reason for hiding this comment

Uh oh!

samir-acle Jun 3, 2026

Choose a reason for hiding this comment

Uh oh!

baptiste-marchand left a comment

Choose a reason for hiding this comment

Uh oh!

github-actions Bot commented Jun 3, 2026

🔍 Smart E2E Test Selection

Uh oh!

joaoloureirop left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

samir-acle commented Jun 3, 2026 •

edited

Loading