Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

inconsistent NavLink matching #3

Closed
hi-ogawa opened this issue Apr 8, 2024 · 0 comments · Fixed by hi-ogawa/vite-plugins#276
Closed

inconsistent NavLink matching #3

hi-ogawa opened this issue Apr 8, 2024 · 0 comments · Fixed by hi-ogawa/vite-plugins#276

Comments

@hi-ogawa
Copy link
Owner

hi-ogawa commented Apr 8, 2024

I thought this would be fixed by

but, it looks like it has more things to consider (like react router PR has indicated the complexity already remix-run/react-router#9477).

For this page https://react-server-demo-remix-tutorial.hiro18181.workers.dev/contacts/kent%20c.-dodds, initial render misses NavLink highlight, but after client side navigation, it gets right.

Partly, the inconsistency is also coming from @tanstack/history's location.pathname, so it's worth investigating.


OK, so this line has pathname = /contacts/kent%20c.-dodds on initial render, but has /contacts/kent c.-dodds on client side navigation (i.e. history.push).

export function NavLink(props: React.ComponentProps<typeof Link>) {
const pathname = useRouter((s) => s.location.pathname);

The same issue might repro on tanstack router?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
1 participant