/next-parallel-routes-issue

Next.js 13.4.3 Repro of useParams issue with conditional routes and parallel routes

Primary LanguageTypeScript

Repro of useParams issue from Next.js version 13.4.3

Set up Locally

After pulling down, can run

yarn && yarn dev

Repro steps

  • go to url localhost:3000/one
  • click on the link to go to /one/two
  • witness the url rendered saying /one/two correctly
  • click on the link again to go to /one/two/three
  • witness the url rendered saying /one/two/three correctly
  • click on the link again to go back to /one/two
  • witness the Index Page text updating as expected (this comes from the server)

Expected result:

  • the url rendered should say /one/two (like the url)
  • the link should say Go to /one/two/three

Actual result:

  • the url rendered still says /one/two/three
  • the link still says Go to /one/two
Screen.Recording.2023-05-31.at.11.23.18.AM.mov

Summary

The issue seems to happen when you have conditional route logic that depends on the useParams hook to render layouts server side based on whether a specific param exists. No matter where the useParams hook is called, the values are stale...

Notes

  • Using browser back/forward buttons works as expected
  • The Server side params are correct