navigation-pattern-validator
Navigation Pattern Validator
Overview
This skill enforces consistent Expo Router navigation patterns across React Native applications, preventing navigation stack mismatches that cause blank screens, broken back buttons, and confusing user experiences. The skill validates import usage, navigation method calls, and stack consistency to ensure all header components follow the established "Expo Router First" pattern.
Core Principle: Expo Router provides file-based routing with built-in stack management. Mixing Expo Router and React Navigation in the same component creates navigation stack mismatches where forward navigation uses one system but back navigation uses another, resulting in undefined behavior.
Common Problem: A screen navigates forward using router.push() (Expo Router), but the destination screen's header uses navigation.goBack() (React Navigation). Since no React Navigation stack entry was created, goBack() fails silently or navigates to an unexpected screen, often showing a blank screen.