Inconsistent 404 Handling with Parallel Routes

Link to the code that reproduces this issue

https://github.com/r4sheed/nextjs-parallel-routes-404-repro

To Reproduce

1. Set up the project:

   • Option A: Clone the repository:

     git clone https://github.com/r4sheed/nextjs-parallel-routes-404-repro.git
     cd nextjs-parallel-routes-404-repro
     

   • Option B: Use CodeSandbox: Open the project directly in CodeSandbox: https://codesandbox.io/p/github/r4sheed/nextjs-parallel-routes-404-repro/master?import=true

   Ensure you have the project files as structured. The key files for reproducing the bug are:

   • src/app/(main)/layout.tsx (defines the main layout with the parallel route slot)
   • src/app/(main)/@breadcrumb/default.tsx
   • src/app/(main)/@breadcrumb/[...catchAll]/page.tsx (provides the content for the breadcrumb slot)
   • src/app/(main)/not-found.tsx (custom 404 page for the (main) group)
   • src/app/page.tsx (root page with a link to a non-existent page)
   • src/app/(main)/main-group-page/page.tsx (a page within the group, also with a link to a non-existent page)
   • src/app/(main)/exists/page.tsx (another page within the group)

2. Install dependencies:

   npm install
   

3. Run the development server:

   npm run dev
   

4. Open the application: Open http://localhost:3000 in your browser.

5. Test Scenario 1 (Correct 404):

   • On the home page (/), you will see a "Go to a page that does not exist (from root)" link.
   • Click this link.
   • Expected: You should see the "Not Found" page defined in src/app/(main)/not-found.tsx. The browser's network tools should show a 200 status for the navigation.

6. Test Scenario 2 (Incorrect 200 OK):

   • Navigate back to the home page (/).