Use Catch-all Segments with modal and intercepting routes

[padupuy]

Summary

Hi !
I'm trying to get "intercepting route" to work with the "catch-all segment".
I fork the nextgram repo and i replace the hardcoded photos folder with a dynamic route [...slug] to catch the route photos/[id].

1. The result seems buggy : behind the photo modal we can see the photo page instead of the feed.
2. When the modal is open : the params.slug is equal to [ 'photos2' ] instead of ['photos', 2]

Am I doing something wrong ?

Additional information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 22.6.0: Wed Oct  4 21:25:26 PDT 2023; root:xnu-8796.141.3.701.17~4/RELEASE_X86_64
Binaries:
  Node: 20.9.0
  npm: 10.1.0
  Yarn: 1.22.19
  pnpm: N/A
Relevant Packages:
  next: 14.0.3
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.1.3
Next.js Config:
  output: N/A

Example

https://nextgram-three.vercel.app/

[hannupekka]

I have the same problem, I think.

We have catch all route at root (app/[...slug]/page.tsx) where we check params.slug and show matching content from CMS or return notFound() if no content is found with slug.

Problem is that this same route catches also intercepting routes so when modal is open, in the background we have our 404 page instead of the page where modal was opened.

Is this by design or is this a bug?

[palmamartin]

We are experiencing the same issue where we have something like src/app/[locale]/[...code] and intercepting routes in combination with parallel routes do not work when building the app. In dev mode they work...

Here the full layout of the app

├── src
│   ├── app
│   │   ├── [locale]
│   │   │   ├── @drawer
│   │   │   │   ├── (..)[locale]
│   │   │   │   │   ├── [...code]
│   │   │   │   │   │   └── page.tsx
│   │   │   │   │   └── default.tsx
│   │   │   │   └── default.tsx
│   │   │   ├── [...code] <--subpage
│   │   │   │   └── page.tsx
│   │   │   ├── globals.css
│   │   │   ├── layout.tsx
│   │   │   └── page.tsx

As a said when running in dev mode everything works as expected. When I build my subpages get the following params subpage: { params: { code: [ '(..)de' ] }, searchParams: {} }

[davialcantaraa]

Same here. Any update?