I am trying to intercept my /form
routes from my [draftVersion]
page.
I have outlined my folder structure below (copy and pasted from tree
command).
app
├── error.tsx
├── layout.tsx
├── page.tsx
├── [draftVersion]
│ ├── page.tsx
│ ├── layout.tsx
│ └── @modal
│ ├── page.tsx
│ ├── default.tsx
│ ├── [...catchAll]
│ │ └── page.tsx
│ └── (...)form
│ ├── create
│ │ └── page.tsx
│ └── [draftVer]
│ ├── import
│ │ └── page.tsx
│ └── row
│ └── page.tsx
└── form
├── create
│ └── page.tsx
└── [draftVer]
├── import
│ └── page.tsx
└── row
└── page.tsx
I am able to intercept form/[draftVer]/import
and form/[draftVer]/row
, when navigating to /form/create
its @modal/[...catchall]
that intercepts.
After removing @modal/[...catchall]
nothing catches form/create
.
I tried removing the .next
directory and clearing my browser cache, but I can't see to find the problem. Any help would be appreciated.
I had to pull the slots from the dynamic segment.
Updating my folder structure to
app
├── layout.tsx
├── page.tsx
├── view
| ├── layout.tsx
| ├── page.tsx
| ├── [draftVersion]
| │ ├── page.tsx
| │ └── diff
| │ └── page.tsx
| ├── @modal
| │ ├── default.tsx
| │ ├── error.tsx
| │ ├── page.tsx
| │ ├── [...catchAll]
| │ │ └── page.tsx
| │ └── (...)form
| │ ├── create
| │ │ └── page.tsx
| │ └── [draftVersion]
| │ ├── import
| │ │ └── page.tsx
| │ └── row
| │ ├── page.tsx
| │ └── [rowId]
| │ └── page.tsx
| └── @review
| ├── default.tsx
| └── [draftVersion]
| └── page.tsx
├── form
├── create
│ └── page.tsx
└── [draftVersion]
├── import
│ └── page.tsx
└── row
├── page.tsx
└── [rowId]
└── page.tsx
fixed the issue.