404 page could not be found only on "draft" preview

The 404 page is shown in Gatsby develop and in our deploy. However, when I check out a preview I get the following error message:

This is only happening for when I hit the preview button on a "draft" page, but when I create a new update under "website updates" I can preview them correctly.

src/pages/404.tsx

import { withUnpublishedPreview } from 'gatsby-source-prismic';
import * as React from 'react';

import Page from '../templates/Page';

const NotFoundPage = () => (
  <main style={pageStyles}>
  404
  </main>
);

export default withUnpublishedPreview(NotFoundPage, {
  templateMap: {
    page: Page,
  },
});

Hello, thanks for reaching out.
I've seen this error commonly because an alternate value in the templateMap is missing, add the prismicPage option to your code:

export default withUnpublishedPreview(NotFoundPage, {
  templateMap: {
    page: Page,
    prismicPage: Page,
  },

What are "website updates", are these documents that have never been published, or maybe docs in a release?

1 Like

Thanks! I tried it and it seemed to solve some of the erros. But the 404 page could not be found is still persisting:

I meant docs in a release, this is working. documents that never been published are not working.

I'm looking at some similar closed issues added to the Github repository. I believe you're missing to add a page for the unpublished documents so that your project has somewhere to render the unrecognized page.

This issue has been closed due to inactivity. Flag to reopen.