[andrewchra]

Description

Social profile onboarding showed Connect X account and Create profile manually above a large gap. The screen already pads for the home indicator, and the marketing moment added that same inset again, so the actions sat one inset too high.

The marketing moment now reads safe-area insets from context. The intro screen clears the top and bottom insets it already accounts for, so the actions rest just above the home indicator. The headline and trade card stay above them.

Changelog

CHANGELOG entry: Fixed social onboarding actions sitting above the bottom of the screen

Related issues

Fixes: none. Layout correction from design review, with no tracked issue.

Manual testing steps

Feature: social profile onboarding actions

  Scenario: intro actions sit at the bottom of the screen
    Given the social experience is enabled
    And the user has not finished profile onboarding

    When the user opens social profile onboarding
    Then "Connect X account" and "Create profile manually" sit just above the home indicator
    And the headline and trade illustration remain above the actions

  Scenario: later onboarding steps keep their continue action
    Given the user is on the intro step

    When the user chooses "Create profile manually"
    Then the username step shows its continue action at the bottom of the screen

Screenshots/Recordings

Before

After

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.

Made with Cursor

---

Note

Low Risk
UI layout change in a shared marketing component with targeted inset logic and unit test coverage; no auth or data handling impact.

^{Reviewed by Cursor Bugbot for commit a432f12. Bugbot is set up for automated code reviews on this repo. Configure here.}

[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.

[github-actions]

Smart E2E Test Selection

Selected E2E tags

SmokeMoney
SmokePerps
SmokeWalletPlatform
SmokeConfirmations

AI Confidence: 80

E2E reasoning

Expand to read

The PR makes three changes:

1. MarketingMoment.tsx — A UI layout fix: uses useSafeAreaInsets() to filter out edges that already have zero insets, preventing double-padding when a parent screen already accounts for safe area. Also adds a testID to the SafeAreaView body element for testability.

2. MarketingMoment.test.tsx — Unit test updates covering the new safe area edge filtering behavior. Comment-only change to SocialProfileOnboardingView.tsx (no functional change).

3. SocialProfileOnboardingView.tsx — Comment-only change explaining why top/bottom insets are zeroed. No functional code change.

Impact analysis:

• MarketingMoment is consumed by: Card flows (CardWelcome, OrderCompleted, Onboarding/Complete → SmokeMoney), Perps (PerpsGTMModal → SmokePerps), Rewards (VipSplashScreenLayout), and SocialLeaderboard.
• The safe area fix is a corrective layout change — it prevents double-padding on devices with notches/home indicators. This could affect visual layout in Card and Perps onboarding/welcome screens.
• Per tag dependency rules: SmokePerps requires SmokeWalletPlatform (Trending section) and SmokeConfirmations (Add Funds deposits are on-chain transactions). SmokeMoney requires SmokeWalletPlatform when touching wallet home/actions entry.
• No critical files (controllers, engine, auth, navigation) were touched.
• No E2E smoke spec files or shared test infrastructure were changed.
• The change is low risk — purely a UI layout correction with good unit test coverage.

Performance reasoning

Expand to read

The changes are limited to safe area inset handling in a UI component (MarketingMoment) and a comment-only change in SocialProfileOnboardingView. These are minor layout corrections that do not affect rendering performance, data loading, or any performance-sensitive code paths. No performance test tags are warranted.

View run

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
100.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud