not-found.js does not work within a route group

[viniciusbitt]

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
      Platform: linux
      Arch: x64
      Version: #22 SMP Tue Jan 10 18:39:00 UTC 2023
    Binaries:
      Node: 16.17.0
      npm: 8.15.0
      Yarn: 1.22.19
      pnpm: 7.1.0
    Relevant packages:
      next: 13.4.5-canary.9
      eslint-config-next: N/A
      react: 18.2.0
      react-dom: 18.2.0
      typescript: 4.9.5

Which area(s) of Next.js are affected? (leave empty if unsure)

App directory (appDir: true), Routing (next/router, next/navigation, next/link)

Link to the code that reproduces this issue or a replay of the bug

https://codesandbox.io/p/sandbox/youthful-zhukovsky-qpjl36

To Reproduce

1. Create a route group and create not-found.js inside the group.
2. Navigate to any not found page

Describe the Bug

not-found.js file isn't working within a route group.

Expected Behavior

Reading the documentation I saw that it has no limitation for route group.

Which browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

No response

[viniciusbitt]

Related: #50034

[surjithctly]

I confirm this does not work and created a Stackblitz Reproduction and found this issue.

[dbrxnds]

Running into this same issue now. I think that's on purpose though, the docs state that only the root not-found page will render for unmatched routes. Not necessarily the nearest one. Although I think it would make sense for it do so.

Edit: I think it could be because it doesn't match a part of the URL, it either matches it completely or not at all.

Some clarification on all of this from the Next team would be great though.

[hughlv]

I'm running into this issue too. The problem is related to the use of next-intl, to get all pages (including app/page.tsx) localized properly, we have to put everything under app/(locales) route group. And then not-found.tsx itself became NOT FOUND.

Any workround or fixing suggestions are welcome.

[hughlv]

I'm running into this issue too. The problem is related to the use of next-intl, to get all pages (including app/page.tsx) localized properly, we have to put everything under app/(locales) route group. And then not-found.tsx itself became NOT FOUND.

Any workround or fixing suggestions are welcome.

The solution mentioned in #50034 (i.e. adding a [...not-found] route) worked. Saved my day.

[github-actions]

This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.