Skip to content

refactor: Removed TitleLeft-related components from components-temp#25997

Merged
brianacnguyen merged 5 commits intomainfrom
remove-title-left
Feb 13, 2026
Merged

refactor: Removed TitleLeft-related components from components-temp#25997
brianacnguyen merged 5 commits intomainfrom
remove-title-left

Conversation

@brianacnguyen
Copy link
Copy Markdown
Contributor

@brianacnguyen brianacnguyen commented Feb 12, 2026 •
edited by cursor bot
Loading

Description

This PR aligns subpage headers with the stacked-standard pattern by replacing all HeaderWithTitleLeft usage with HeaderStackedStandard and removing the deprecated title-left components.

Reason for change: HeaderWithTitleLeft and related components (HeaderWithTitleLeftScrollable, TitleLeft) are being retired in favor of the shared HeaderStackedStandard / TitleStandard pattern used elsewhere. Using one header pattern improves consistency and reduces maintenance.

What changed:

  1. Consumer updates – Replaced HeaderWithTitleLeft with HeaderStackedStandard (and titleLeftProps → titleStandardProps) in:
    • Connect Hardware → Select Hardware (SelectHardware/index.tsx)
    • Import Secret Recovery Phrase (ImportNewSecretRecoveryPhrase/index.tsx)
    • Import Private Key (ImportPrivateKey/index.tsx)
  2. Cleanup – Removed unused components from component-library/components-temp:
    • HeaderWithTitleLeft (and getHeaderWithTitleLeftNavbarOptions)
    • HeaderWithTitleLeftScrollable (and its hook / navbar helper)
    • TitleLeft

No behavior or visual change for users; same header layout and props, different component names and implementation.

Changelog

This PR is not end-user-facing.

CHANGELOG entry: null

Related issues

Fixes:

Manual testing steps

Feature: Header alignment – stacked standard on import/hardware screens

  Scenario: user opens Select Hardware, Import SRP, or Import Private Key
    Given the app is open and the user can navigate

    When user goes to Connect Hardware → Select Hardware
    Or user goes to Import wallet flow → Import Secret Recovery Phrase
    Or user goes to Import wallet flow → Import Private Key
    Then the screen shows the same header as before (title + optional subtitle/accessory and back button)

Screenshots/Recordings

Before

After

Simulator.Screen.Recording.-.iPhone.15.Pro.Max.-.2026-02-11.at.22.07.01.mov

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

Low Risk
Primarily a UI refactor and component cleanup; risk is limited to possible header layout/behavior regressions on the migrated screens.

Overview
Migrates several screens to the stacked-standard header pattern by replacing HeaderWithTitleLeft with HeaderStackedStandard and renaming titleLeftProps to titleStandardProps while preserving back/close actions and bottom-accessory subtitle content.

Removes the deprecated temp components HeaderWithTitleLeft, HeaderWithTitleLeftScrollable (including hook/navbar helpers), and TitleLeft, and updates Storybook’s auto-generated requires list plus the ImportPrivateKey snapshot to match the new header render output.

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

@brianacnguyen brianacnguyen self-assigned this Feb 12, 2026
@brianacnguyen brianacnguyen requested a review from a team as a code owner February 12, 2026 06:07
@brianacnguyen brianacnguyen added No QA Needed Apply this label when your PR does not need any QA effort. team-design-system All issues relating to design system in Mobile no changelog required No changelog entry is required for this change labels Feb 12, 2026
@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Feb 12, 2026

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
Copy link
Copy Markdown
Contributor

github-actions bot commented Feb 12, 2026

🔍 Smart E2E Test Selection

  • Selected E2E tags: SmokeAccounts
  • Selected Performance tags: None (no tests recommended)
  • Risk Level: medium
  • AI Confidence: 85%
click to see 🤖 AI reasoning details

E2E Test Selection:
This PR is a component library refactoring that deletes three temporary header components (HeaderWithTitleLeft, HeaderWithTitleLeftScrollable, TitleLeft) and migrates their usages to the existing HeaderStackedStandard component.

The affected views are:

  1. ConnectHardware/SelectHardware - Hardware wallet connection flow for QR-based hardware wallets
  2. ImportNewSecretRecoveryPhrase - Multi-SRP import flow for importing additional Secret Recovery Phrases
  3. ImportPrivateKey - Private key import flow for importing accounts via private key

All three views are directly related to account management functionality covered by SmokeAccounts, which tests:

  • Adding QR-based hardware wallet accounts (ConnectHardware/SelectHardware)
  • Importing accounts via private key (ImportPrivateKey)
  • Multi-account workflows

The changes are purely UI component swaps - the prop structure is nearly identical (titleLeftProps → titleStandardProps), and the snapshot diff shows the layout is simplified but functionally equivalent. The header components provide back navigation and title display, which are critical for these account import flows.

While ImportNewSecretRecoveryPhrase relates to multi-SRP architecture (SmokeWalletPlatform), the primary testing coverage for these specific import flows is through SmokeAccounts. The changes don't affect the underlying import logic, only the header UI presentation.

Performance Test Selection:
This PR is a pure UI component refactoring that swaps one header component for another with equivalent functionality. The changes don't affect rendering performance, data loading, state management, or any critical user flows that would impact app performance. The snapshot diff shows the component hierarchy is actually slightly simplified (fewer nested Views), which if anything would be a minor improvement. No performance tests are needed.

View GitHub Actions results

@sonarqubecloud
Copy link
Copy Markdown

sonarqubecloud bot commented Feb 12, 2026

Quality Gate Passed Quality Gate passed

Issues
0 New issues
0 Accepted issues

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

See analysis details on SonarQube Cloud

@brianacnguyen brianacnguyen added this pull request to the merge queue Feb 12, 2026
Merged via the queue into main with commit cab6522 Feb 13, 2026
85 of 86 checks passed
@brianacnguyen brianacnguyen deleted the remove-title-left branch February 13, 2026 00:06
@github-actions github-actions bot locked and limited conversation to collaborators Feb 13, 2026
@metamaskbot metamaskbot added the release-7.67.0 Issue or pull request that will be included in release 7.67.0 label Feb 13, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Reviewers

@georgewrmarshall georgewrmarshall georgewrmarshall approved these changes

Assignees

@brianacnguyen brianacnguyen

Labels

no changelog required No changelog entry is required for this change No QA Needed Apply this label when your PR does not need any QA effort. release-7.67.0 Issue or pull request that will be included in release 7.67.0 size-XL team-design-system All issues relating to design system in Mobile

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@brianacnguyen @georgewrmarshall @metamaskbot