Next.js Discord

Discord Forum

Modal intercept/parallel routes clash when intercepting from different routes

Unanswered
Mini Lop posted this in #help-forum
Open in Discord
Mini LopOP
Made a GitHub issue here: https://github.com/vercel/next.js/issues/49878

I'm trying to integrate the route intercept feature from different pages. However, I'm seeing issues such as clashing.

For example, let's say that:
- We have a foo page
- We have a bar page
- We have post pages at /posts/{post_id}
- Clicking on a link to a post (e.g./posts/1) on the foo page -> should show modal of the post on the foo page
- Clicking on a link to a post (e.g./posts/1) on the bar page -> should show modal of the post on the bar page

However, as shown in this code reproduction: https://codesandbox.io/p/sandbox/nextjs-clashing-intercept-routes-7fb9i9?file=/app/page.tsx:1,1

What actually happens is the following:
- Go to foo page
- Click on link to post 1 on foo page -> correctly shows modal from foo page
- Close modal and go home
- Go to bar page
- Click on link to post 1 on bar page -> incorrectly shows modal from foo page

(e.g. load a post on bar page, but it instead loads on foo page instead

Any help would be appreciated. I've had the GitHub issue up for months but without response unfortunately.

0 Replies