react-router-guards
react-router-guards copied to clipboard
Fix nested route changes triggering parent guards
Description
The current way we are tracking route changes is through a changing location pathname; unfortunately, this location change is true for both parent and child nested routes, causing both guards to be triggered.
This PR introduces a new route change detection function, which checks the route path and params (instead of just comparing the location pathname)
Related issues
Fixes #59
What this does
- Updates
hasPathChanged
->hasRouteChanged
, updates detection to checkmatch.*
instead oflocation.*
- Removes
null
render for when route has changed but without guards - Updates intermediate demo to use nested route on Pokémon detail page
- Updates RRDom to
5.3.0
to take advantage of theuseRouteMatch
hook helper
- Updates RRDom to
How to test
- Visit the intermediate demo
- Open a Pokémon page. Confirm the parent route loader appears, then the child route loader
- Click on a sublink in the page (Physique, Statistics, Moves). Confirm only the child route loader appears
- Click on a previous or next link. Confirm the parent route loader appears, then the child route loader