Infinite Redirect Loop on 404 Page in Production

[lorenzrabs]

Link to reproduction

No response

Environment Info

Website Template
Payload: 3.0.0-beta.107

Describe the Bug

When visiting a non-existent page (404) in production, the page flickers continuously, suggesting an infinite redirect loop. The browser console shows the following error:

Server Error: NEXT_NOT_FOUND
    at PayloadRedirects (webpack-internal:///(rsc)/./src/components/PayloadRedirects/index.tsx:34:69)

This issue only appears in production mode. In development mode, the error is displayed in the console, but the 404 page loads correctly without flickering.

Reproduction Steps

1. Use the latest website template.
2. Seed the database.
3. Remove the seed page redirect in [slug]/page.tsx.
4. Visit any non-existent page in production mode.

Adapters and Plugins

No response

[akhrarovsaid]

Hey @lorenzrabs,

I'm able to reproduce your issue consistently by building (via npm run build) the app and navigating to a page I know doesn't exist - triggering the 404.

I'm attaching a video of the current behavior. I haven't deployed this application, it's currently running on my local windows machine however I'm able to reproduce your issue with both mongodb and the postgres adapter. I've attached a video of the issue. Looking at console logs indicates it's an RSC problem.

chrome_2024-09-19_18-51-07.mp4