Skip to content

App reproducing incorrect behavior of parallel + intercepting routes for the root path in Next.js 13

Notifications You must be signed in to change notification settings

jasonsilberman/nextgram13-root-path

Repository files navigation

NextGram with Root Path Bug Reproduction

This is a fork of the NextGram app built as a demo for Instagram style routes in Next.js 13 with Parallel and Intercepting routes.

The original has a / root page that shows the grid of photos and then individual /photos/:id pages. However, for my use case, I would like to have the individual pages be at /:id without the /photos route segment. This is not currently possible as of Next.js 13.5.5. I have recorded two videos below showing the correct and incorrect behavior (you can see the URL changes in the Arc browser below).

├── app
|  ├── @modal
|  |  ├── (.)
|  |  |  └── [id]
|  |  |     └── page.tsx
|  |  └── default.tsx
|  ├── [id]
|  |  └── page.tsx
|  ├── default.tsx
|  ├── layout.tsx
|  └── page.tsx

Working with /photos/:id pages

CleanShot.2023-10-18.at.12.59.09.mp4

Not working with /:id pages

CleanShot.2023-10-18.at.13.01.36.mp4

Other reports of this behavior

I found some other reports of this buggy behavior below:

Try it Yourself

I have also gone through and deployed this app to Vercel and updated the below instructions for this repo so you can see the issues for yourself.

Demo

https://nextgram.vercel.app

Deploy with Vercel

Locally

git clone https://github.com/jasonsilberman/nextgram13-root-path.git
cd nextgram13-root-path/
yarn
yarn dev

About

App reproducing incorrect behavior of parallel + intercepting routes for the root path in Next.js 13

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published