NextJS 14.2 Parallel Routes Change?
Finally going through Theo's awesome modern react tutorial [1]. I got to the point of deleting images and when the modal is visible it fails. This is because /src/app/@modal/(.)img/[id]/page.tsx has the modal which has the FullPageImageView component. That component calls getImage which checks to see if the image exists while getting it and throws an exception if it's not found (queries.ts->getImage if(!image) throw). Since the image was just deleted, it doesn't exist.
I was bashing my head against the wall trying to find what was different. I even pulled the sample repo down and got it locally running without the error. Then I changed my package.json to reference "next": "14.1.3" (from sample code) instead of "^14.2.4" which it pulled in when I created the project.
So, did something change in Next 14.2 parallel routes that causes a re-render before redirect('/') (imported from "next/navigation") where it didn't re-render before redirect on next 14.1? Looking at release notes [2, 3] there are several mentions about parallel routes [4 - 7]. But 4 is about not requiring a dummy default. 5 is about multi-slot layouts, which I don't think is at play here. 6 is about catch all slots, which again, doesn't seem to be in play. 7 may be related, but I frankly can't tell what it means. I think it has to do with inadvertant blank pages instead of loading states.
Thanks
zd
[1] https://www.youtube.com/watch?v=d5x0JCZbAJs
[2] https://nextjs.org/blog/next-14-2
[3] https://github.com/vercel/next.js/releases?q=14.2&expanded=true
[4] https://github.com/vercel/next.js/pull/60776
[5] https://github.com/vercel/next.js/pull/61115
[6] https://github.com/vercel/next.js/pull/61174
[7] https://github.com/vercel/next.js/pull/61597
Theo - t3․gg
YouTube
From 0 to Production - The Modern React Tutorial (RSCs, Next.js, Sh...
The Modern React Tutorial is FINALLY done. This one took awhile.
Shoutout to ALL the awesome sponsors who made this possible:
- Vercel
- Clerk
- Posthog
- Sentry
- Upstash
NOTES I MENTION DURING VIDEO
"Nextgram": https://github.com/vercel/nextgram/tree/main/app
"useUploadThingInputProps": https://gist.github.com/t3dotgg/0464ca78e94acce80ba04ca...
Next.js 14.2
Next.js 14.2 includes development, production, and caching improvements. Including new configuration options, 99% Turbopack tests passing, and more.
GitHub
14.2 · Releases · vercel/next.js
The React Framework. Contribute to vercel/next.js development by creating an account on GitHub.
GitHub
fix parallel route top-level catch-all normalization logic to suppo...
Fix NEXT-2165
What?
Addresses the limitation of #60240, where a dummy default file is required in parallel route child slot to prevent errors in dev server rendering (TypeError: Cannot read propert...
GitHub
parallel routes: support multi-slot layouts by ztanner · Pull Reque...
What?
When using layouts in multiple parallel route slots, only 1 of the layouts would render.
Why?
The resolveParallelSegments logic responsible for populating the loader tree was incorrectly bail...
0 Replies