chore(perps): opt in useNavigation to AppNavigationProp (Phase 4)

[weitingsun]

Description

Phase 4 of the incremental React Navigation typing migration — Perps feature.

Perps production call sites still used untyped useNavigation(), so they received the loose global ReactNavigation.RootParamList and did not enforce route names / params against RootStackParamList. This PR opts Perps into the strict path via useNavigation<AppNavigationProp>().

This is effectively types-only. No navigation destinations, route names, or user-facing flows were intentionally changed. A small number of call-site / param-list adjustments were required so TypeScript’s stricter overloads accept the existing (already-correct) navigate shapes.

What changed

1. Opt-in across Perps (~53 files)

   • useNavigation() → useNavigation<AppNavigationProp>()
   • PerpsPillItem: NavigationProp<PerpsNavigationParamList> → AppNavigationProp
   • Added import type { AppNavigationProp } from app/core/NavigationService/types

2. Param-list alignment (app/components/UI/Perps/types/navigation.ts) so real call sites type-check under AppNavigationProp:

   • Extracted shared PerpsOrderRouteParams
   • Optional screens that are navigated without params: PerpsMarketListView, PerpsTutorial, PerpsTrendingView → … | undefined
   • PerpsMarketDetails.market widened to PerpsMarketData | Partial<PerpsMarketData> (trade-details deep entries)
   • PerpsPnlHeroCard accepts optional source
   • RedesignedConfirmations (Perps stack) → Partial<PerpsOrderRouteParams> | undefined

3. Root stack shared confirmation route (app/core/NavigationService/types.ts)

   • RedesignedConfirmations widened to ConfirmationParams | Partial<PerpsOrderRouteParams> | undefined so both confirmations and the Perps order flow can open it under the same root key

4. Minimal call-site / helper typing fixes (no intended behavior change)

   • PerpsOrderView: szDecimals ?? undefined (null → undefined); market navigate fallback when navigationMarketData is missing
   • getRedesignedConfirmationsHeaderOptions: take optional params object instead of destructuring a possibly-undefined param list

Changelog

CHANGELOG entry:null

Related issues

Fixes:https://consensyssoftware.atlassian.net/browse/MCWP-675

Manual testing steps

N/A

Screenshots/Recordings

N/A

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.

---

Note

Low Risk
Compile-time navigation typing and param-list widening only; runtime flows are unchanged aside from defensive fallbacks for already-handled edge cases.

Overview
Phase 4 of the React Navigation typing migration for Perps. Production Perps screens, components, and hooks switch from untyped useNavigation() to useNavigation<AppNavigationProp>() so navigate / goBack are checked against RootStackParamList.

Param lists in navigation.ts are adjusted so existing call sites compile: shared PerpsOrderRouteParams, optional undefined for screens opened without params, PerpsMarketDetails.market accepts partial market data, and Perps-stack RedesignedConfirmations aligns with order-flow params. Root RedesignedConfirmations in NavigationService/types.ts is widened to ConfirmationParams | Partial<PerpsOrderRouteParams> | undefined.

Small typing-only fixes in PerpsOrderView (e.g. szDecimals ?? undefined, market param fallback) and getRedesignedConfirmationsHeaderOptions (safe handling of optional params). No intentional navigation or UX behavior changes.

^{Reviewed by Cursor Bugbot for commit 229acc8. 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.

[metamask-ci]

PR template — items to address before "Ready for review"

Warnings — informational, address before merging:

• Pre-merge author checklist has unchecked items (e.g. "I've tested on Android"). Every box must be consciously checked — see docs/readme/ready-for-review.md.

See docs/readme/ready-for-review.md for the full Definition of Ready for Review.

[github-actions]

🔍 Smart E2E Test Selection

• Selected E2E tags: SmokePerps, SmokeWalletPlatform, SmokeConfirmations
• Selected Performance tags: @PerformancePreps
• Risk Level: medium
• AI Confidence: 85%

click to see 🤖 AI reasoning details

E2E Test Selection:
The PR makes changes across 55 files, primarily in the Perps UI components and navigation system:

1. Navigation type system changes (app/core/NavigationService/types.ts - CRITICAL): The RedesignedConfirmations route in RootStackParamList now accepts ConfirmationParams | Partial<PerpsOrderRouteParams> | undefined. This is a type-level change but affects how the confirmation screen is navigated to from Perps flows. This warrants testing the confirmation flow from Perps.

2. Perps navigation type refactoring (types/navigation.ts): PerpsOrderRouteParams extracted as a shared type; several route params now accept undefined (e.g., PerpsMarketListView, PerpsTutorial, PerpsTrendingView). Making params optional could affect navigation guards or conditional rendering.

3. TypeScript type safety improvements (all Perps Views/Hooks): Adding useNavigation<AppNavigationProp>() generic type annotation across all Perps views and hooks. While primarily a TypeScript improvement, it ensures navigation calls are type-checked against the full app navigation tree.

4. Functional fixes in PerpsOrderView.tsx:

   • szDecimals ?? undefined (null safety)
   • Fallback market data { symbol: orderForm.asset, name: orderForm.asset } when navigationMarketData is null - this is a real behavioral change that prevents crashes when navigating to market details

5. routes/index.tsx: Refactors header options function to use optional chaining for showPerpsHeader - affects how the Perps confirmation screen header is rendered.

Tag selection rationale:

• SmokePerps: Primary area affected - all Perps views, hooks, navigation, and order flows are changed. The Add Funds flow, market list, order view, and position management are all touched.
• SmokeWalletPlatform: Per tag description, Perps is a section inside the Trending tab. Changes to Perps views (PerpsHomeView, PerpsMarketListView, etc.) affect Trending. Also required when selecting SmokePerps.
• SmokeConfirmations: Required when selecting SmokePerps (Add Funds deposits are on-chain transactions). Additionally, the RedesignedConfirmations route type was directly modified to accept PerpsOrderRouteParams, making confirmation flow testing essential.

The changes are primarily TypeScript type improvements with some functional null-safety fixes. Risk is medium because the navigation type changes and null-safety fixes could affect runtime behavior in Perps flows and confirmation navigation.

Performance Test Selection:
The PR modifies multiple Perps views (PerpsHomeView, PerpsMarketListView, PerpsMarketDetailsView, PerpsOrderView, etc.) and hooks that are directly involved in the Perps trading flow. The @PerformancePreps tag covers perps market loading, position management, add funds flow, and order execution - all of which are touched by these changes. The navigation type changes and null-safety fixes in PerpsOrderView could affect rendering performance. No other performance tags are warranted as the changes are scoped to Perps functionality.

View GitHub Actions results

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

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

See analysis details on SonarQube Cloud

[github-actions]

⚡ Performance Test Results

ℹ️ Performance test results are currently non-blocking and will not block this PR.

✅ All tests passed · 2 tests · 1 device

📱 Devices tested (1)

Android: Google Pixel 8 Pro (v14.0)

✅ Passed Tests (2)

Test	Platform	Device	Duration	Team	Recording
Perps add funds	Android	Google Pixel 8 Pro (v14.0)	9.96s	@mm-perps-engineering-team	📹 Watch
Perps open position and close it	Android	Google Pixel 8 Pro (v14.0)	19.73s	@mm-perps-engineering-team	📹 Watch

---

Branch: chore/navigation-typing-phase-4-perps · Build: Normal · Commit: e438362 · View full run