blitz-js / blitz-js/legacy-framework
Dynamic catch-all route also catches API routes
- Dominant language
- JavaScript
- Stars
- 3
- Forks
- 2
- PR merge metrics
- No merged PRs in 30d
Description
### What is the problem?
I have a catch-all route in the `pages` folder: `pages/[...params].tsx`. Now, when I have an anchor tag pointing to my api routes (e.g. `api/auth/google`) or if I do `Router.replace(/api/auth/google)` the catch-all route `pages/[...params].tsx` is triggered where `params=['api','auth','google']`. Manually entering `api/auth/google` in the browser however correctly triggers the API route.
Additionally, this issue seems to happen only in production (Vercel deployment).
### Paste all your error logs here:
No errors
### Paste all relevant code snippets here:
```
PASTE_HERE (leave the ``` marks)
```
### What are detailed steps to reproduce this?
1. Create `pages/[...params].tsx`
2. Create API route.
3. Deploy to production (Vercel).
4. Redirect to API routes using anchor tag or Router.
### Run `blitz -v` and paste the output here:
```
macOS Big Sur | darwin-x64 | Node: v16.3.0
blitz: 0.38.0 (global)
blitz: 0.39.0 (local)
Package manager: yarn
System:
OS: macOS 11.4
CPU: (8) x64 Intel(R) Core(TM) i5-8259U CPU @ 2.30GHz
Memory: 47.21 MB / 16.00 GB
Shell: 5.8 - /bin/zsh
Binaries:
Node: 16.3.0 - ~/.nvm/versions/node/v16.3.0/bin/node
Yarn: 1.22.10 - /usr/local/bin/yarn
npm: 7.15.1 - ~/.nvm/versions/node/v16.3.0/bin/npm
Watchman: 2021.08.23.00 - /usr/local/bin/watchman
npmPackages:
@prisma/client: 3.1.1 => 3.1.1
blitz: 0.39.0 => 0.39.0
prisma: 3.1.1 => 3.1.1
react: 0.0.0-experimental-3310209d0 => 0.0.0-experimental-3310209d0
react-dom: 0.0.0-experimental-3310209d0 => 0.0.0-experimental-3310209d0
typescript: 4.3.4 => 4.3.4
```
### Please include below any other applicable logs and screenshots that show your problem:
_No response_
Contributor guide
Research direction
Reproduce the production case with pages/[...params].tsx, an API route, an anchor link, and Router.replace, then compare those results with direct browser navigation. Trace how client-side routing resolves the API path and confirm the API route is selected instead of the catch-all page. Done means both anchor navigation and Router.replace reach the API route in the deployed production build.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- api, backend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 25/100