Preview mode

[caesarsol]

Hi, pardon me in advance if it's obvious, but I haven't found the answer anywhere.

is it possible to use this library with Prismic preview mode?

I'm particularly unclear on how to apply this step in particular in the Prismic documentation.

Thanks!

[JoiGud]

Also looking for a solution 😅

[sarahkirby]

Hi @caesarsol & @JoiGud,

I came across this thread and thought I might be able to help.
I'm using Prismic with GraphQL & NextJS.

To setup previews follow the documentation you linked above, then you'll need to pass the previewData.ref value to your query.

export const getStaticProps = async ({ previewData }) => {
  const context = {
    headers: {
      'Prismic-Ref': previewData.ref,
    },
  };

  const { data } = await client.query({
    query: QUERY_HOME_PAGE,
    context,
  });
...

I hope this helps 🙂

[JoiGud]

Thanks! I'm doing exactly that. Just need to finish the redirect part from your-site/preview/* to the proper URL, with the previewRef set in the queries.

It's addressed in this PR https://github.com/prismicio/apollo-link-prismic/pull/5/files 😄