Navigation stack hierarchy is logically organized
Why it matters
A flat or tangled navigator hierarchy breaks the mental model users have of mobile apps: tabs that don't own their own stack lose history when switched, modals that sit inside a regular stack trap the user behind a back button that dismisses the wrong screen, and competing root navigators fight over linking. The result is jank that iOS and Android HIG reviewers catch, and that users describe as "the app feels weird."
Severity rationale
High because a broken hierarchy corrupts back-button semantics and tab-state preservation across the entire app.
Remediation
Restructure navigators so one root (Tab or Stack) contains nested child stacks per tab, with modals layered above via a separate group. Put this shape in src/navigation/RootNavigator.tsx:
<Tab.Navigator>
<Tab.Screen name="HomeTab" component={HomeStack} />
<Tab.Screen name="SettingsTab" component={SettingsStack} />
</Tab.Navigator>
Each tab component returns its own Stack.Navigator, and modal screens live in a RootStack.Group with presentation: 'modal'.
DetectionPro
The detection method for this pattern is part of AuditBuffet Pro.
The full method (what to look for, pass and fail conditions, and how results get reported) ships inside the Mobile Navigation & Deep Linking Audit. The pattern definition, severity rationale, and remediation remain openly licensed under CC-BY-4.0.
Taxons
History
- 2026-04-18·v1.0.0·Initial import from mobile-navigation-linking·automated