@prismicio/next 0.0.1 → 0.0.5

package/README.md

@@ -0,0 +1,90 @@
+# @prismicio/next
+
+[![npm version][npm-version-src]][npm-version-href]
+[![npm downloads][npm-downloads-src]][npm-downloads-href]
+[![Github Actions CI][github-actions-ci-src]][github-actions-ci-href]
+[![Codecov][codecov-src]][codecov-href]
+[![Conventional Commits][conventional-commits-src]][conventional-commits-href]
+[![License][license-src]][license-href]
+
+> ⚠ This project is in an experimental state and therefore primarily meant to be used by Prismic kits. Use it at your own risks or stay tuned for the official release!
+
+<!-- TODO: Replacing link to Prismic with [Prismic][prismic] is useful here -->
+
+A Next.js Integration with Prismic that makes it easier to take advantage of Next.js features.
+
+- 🎥 &nbsp;Easily set up Prismic Previews;
+
+## Install
+
+```bash
+npm install @prismicio/next
+```
+
+## Documentation
+
+To discover what's new on this package check out [the changelog][changelog]. For full documentation, visit the [official Prismic documentation][prismic-docs].
+
+## Contributing
+
+Whether you're helping us fix bugs, improve the docs, or spread the word, we'd love to have you as part of the Prismic developer community!
+
+**Asking a question**: [Open a new topic][forum-question] on our community forum explaining what you want to achieve / your question. Our support team will get back to you shortly.
+
+**Reporting a bug**: [Open an issue][repo-bug-report] explaining your application's setup and the bug you're encountering.
+
+**Suggesting an improvement**: [Open an issue][repo-feature-request] explaining your improvement or feature so we can discuss and learn more.
+
+**Submitting code changes**: For small fixes, feel free to [open a pull request][repo-pull-requests] with a description of your changes. For large changes, please first [open an issue][repo-feature-request] so we can discuss if and how the changes should be implemented.
+
+For more clarity on this project and its structure you can also check out the detailed [CONTRIBUTING.md][contributing] document.
+
+## License
+
+```
+   Copyright 2013-2021 Prismic <contact@prismic.io> (https://prismic.io)
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
+```
+
+<!-- Links -->
+
+[prismic]: https://prismic.io
+
+<!-- TODO: Replace link with a more useful one if available -->
+
+[prismic-docs]: https://prismic.io/docs
+[changelog]: ./CHANGELOG.md
+[contributing]: ./CONTRIBUTING.md
+
+<!-- TODO: Replace link with a more useful one if available -->
+
+[forum-question]: https://community.prismic.io
+[repo-bug-report]: https://github.com/prismicio/prismic-next/issues/new?assignees=&labels=bug&template=bug_report.md&title=
+[repo-feature-request]: https://github.com/prismicio/prismic-next/issues/new?assignees=&labels=enhancement&template=feature_request.md&title=
+[repo-pull-requests]: https://github.com/prismicio/prismic-next/pulls
+
+<!-- Badges -->
+
+[npm-version-src]: https://img.shields.io/npm/v/@prismicio/next/latest.svg
+[npm-version-href]: https://npmjs.com/package/@prismicio/next
+[npm-downloads-src]: https://img.shields.io/npm/dm/@prismicio/next.svg
+[npm-downloads-href]: https://npmjs.com/package/@prismicio/next
+[github-actions-ci-src]: https://github.com/prismicio/prismic-next/workflows/ci/badge.svg
+[github-actions-ci-href]: https://github.com/prismicio/prismic-next/actions?query=workflow%3Aci
+[codecov-src]: https://img.shields.io/codecov/c/github/prismicio/prismic-next.svg
+[codecov-href]: https://codecov.io/gh/prismicio/prismic-next
+[conventional-commits-src]: https://img.shields.io/badge/Conventional%20Commits-1.0.0-yellow.svg
+[conventional-commits-href]: https://conventionalcommits.org
+[license-src]: https://img.shields.io/npm/l/@prismicio/next.svg
+[license-href]: https://npmjs.com/package/@prismicio/next

package/dist/index.cjs

@@ -2,19 +2,40 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+const prismic = require('@prismicio/client');
 const React = require('react');
 const react = require('@prismicio/react');
+const router = require('next/router');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
+	const n = Object.create(null);
+	if (e) {
+		for (const k in e) {
+			if (k !== 'default') {
+				const d = Object.getOwnPropertyDescriptor(e, k);
+				Object.defineProperty(n, k, d.get ? d : {
+					enumerable: true,
+					get: function () { return e[k]; }
+				});
+			}
+		}
+	}
+	n["default"] = e;
+	return Object.freeze(n);
+}
+
+const prismic__namespace = /*#__PURE__*/_interopNamespace(prismic);
 const React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 async function setPreviewData({
   req,
   res
 }) {
-  if (req.query.token) {
-    const { token: ref } = req.query;
+  const ref = req.query.token || req.cookies[prismic__namespace.cookie.preview];
+  if (ref) {
     res.setPreviewData({ ref });
   }
 }
@@ -32,6 +53,50 @@ function exitPreview(config) {
   config.res.redirect("/");
 }
 
+const readValue = (value) => {
+  return value.replace(/%3B/g, ";");
+};
+const parse = (cookieString) => {
+  const result = {};
+  const cookies = cookieString.split("; ");
+  for (const cookie of cookies) {
+    const parts = cookie.split("=");
+    const value = parts.slice(1).join("=");
+    const name = readValue(parts[0]).replace(/%3D/g, "=");
+    result[name] = readValue(value);
+  }
+  return result;
+};
+const getAll = (cookieStore) => parse(cookieStore);
+const getCookie = (name, cookieStore) => getAll(cookieStore)[name];
+
+const extractFirstSubdomain = (host) => host.split(".")[0];
+const extractRepositoryNameFromObjectRef = (previewRef) => {
+  try {
+    const parsed = JSON.parse(decodeURIComponent(previewRef));
+    const keys = Object.keys(parsed);
+    const domainKey = keys.find((key) => /\.prismic\.io$/.test(key));
+    if (domainKey) {
+      return extractFirstSubdomain(domainKey);
+    } else {
+      return void 0;
+    }
+  } catch (e) {
+    return void 0;
+  }
+};
+const extractRepositoryNameFromURLRef = (previewRef) => {
+  try {
+    const url = new URL(previewRef);
+    return extractFirstSubdomain(url.host);
+  } catch (e) {
+    return void 0;
+  }
+};
+const extractPreviewRefRepositoryName = (previewRef) => {
+  return extractRepositoryNameFromObjectRef(previewRef) || extractRepositoryNameFromURLRef(previewRef);
+};
+
 const isPrismicUpdateToolbarEvent = (event) => {
   return "detail" in event && typeof event.detail.ref === "string";
 };
@@ -41,27 +106,36 @@ function PrismicPreview({
   updatePreviewURL = "/api/preview",
   exitPreviewURL = "/api/exit-preview"
 }) {
+  const router$1 = router.useRouter();
   React.useEffect(() => {
-    const prismicPreviewUpdate = async (event) => {
+    const previewRefRepositoryName = extractPreviewRefRepositoryName(getCookie("io.prismic.preview", globalThis.document.cookie));
+    const startPreviewIfLoadedFromSharedLink = async () => {
+      if (previewRefRepositoryName === repositoryName && !router$1.isPreview) {
+        await fetch(updatePreviewURL);
+        window.location.reload();
+      }
+    };
+    startPreviewIfLoadedFromSharedLink();
+    const handlePrismicPreviewUpdate = async (event) => {
       if (isPrismicUpdateToolbarEvent(event)) {
         event.preventDefault();
-        await fetch(`${updatePreviewURL}?token=${event.detail.ref}`);
+        await fetch(updatePreviewURL);
         window.location.reload();
       }
     };
-    const prismicPreviewEnd = async (event) => {
+    const handlePrismicPreviewEnd = async (event) => {
       event.preventDefault();
       await fetch(exitPreviewURL);
       window.location.reload();
     };
     if (window) {
-      window.addEventListener("prismicPreviewUpdate", prismicPreviewUpdate);
-      window.addEventListener("prismicPreviewEnd", prismicPreviewEnd);
+      window.addEventListener("prismicPreviewUpdate", handlePrismicPreviewUpdate);
+      window.addEventListener("prismicPreviewEnd", handlePrismicPreviewEnd);
     }
     return () => {
       if (window) {
-        window.removeEventListener("prismicPreviewUpdate", prismicPreviewUpdate);
-        window.removeEventListener("prismicPreviewEnd", prismicPreviewEnd);
+        window.removeEventListener("prismicPreviewUpdate", handlePrismicPreviewUpdate);
+        window.removeEventListener("prismicPreviewEnd", handlePrismicPreviewEnd);
       }
     };
   }, []);
@@ -74,8 +148,8 @@ const isPrismicNextPreviewData = (previewData) => {
   return typeof previewData === "object" && "ref" in previewData;
 };
 const enableAutoPreviews = (config) => {
-  if ("context" in config && config.context) {
-    const previewData = config.context.previewData;
+  if ("previewData" in config && config.previewData) {
+    const { previewData } = config;
     if (isPrismicNextPreviewData(previewData) && previewData.ref) {
       config.client.queryContentFromRef(previewData.ref);
     }
@@ -101,6 +175,7 @@ async function redirectToPreviewURL({
       previewToken: token
     });
     res.redirect(previewUrl);
+    return;
   }
   res.redirect(defaultURL);
 }

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import { NextApiRequest, NextApiResponse, PreviewData } from 'next';
 import { Client, HttpRequestLike } from '@prismicio/client';
-import { LinkResolverFunction } from '@prismicio/helpers';
 import React from 'react';
+import { LinkResolverFunction } from '@prismicio/helpers';
 
 /**
  * Configuration for `setPreviewData`.
@@ -15,6 +15,7 @@ declare type SetPreviewDataConfig = {
      */
     req: {
         query: NextApiRequest["query"];
+        cookies: NextApiRequest["cookies"];
     };
     /**
      * The `res` object from a Next.js API route. This is given as a parameter to
@@ -31,70 +32,6 @@ declare type SetPreviewDataConfig = {
  */
 declare function setPreviewData({ req, res, }: SetPreviewDataConfig): Promise<void>;
 
-/**
- * Next.js context object from APIs supporting Preview Mode. This includes the
- * context object from `getStaticProps` and `getServerSideProps`.
- */
-declare type NextContextLike<TPreviewData extends PreviewData = PreviewData> = {
-    previewData?: TPreviewData;
-};
-/**
- * Configuration for creating a Prismic client with automatic preview support in
- * Next.js apps.
- */
-declare type CreateClientConfig = {
-    /**
-     * A Next.js context object (such as the context object from `getStaticProps`
-     * or `getServerSideProps`).
-     *
-     * Pass a `context` when using outside a Next.js API endpoint.
-     */
-    context?: NextContextLike;
-    /**
-     * A Next.js API endpoint request object.
-     *
-     * Pass a `req` object when using in a Next.js API endpoint.
-     */
-    req?: NextApiRequest;
-};
-/**
- * Preview config for enabling previews with redirectToPreviewURL
- */
-declare type PreviewConfig = {
-    /**
-     * The `req` object from a Next.js API route. This is given as a parameter to
-     * the API route.
-     *
-     * @see Next.js API route docs: {@link https://nextjs.org/docs/api-routes/introduction}
-     */
-    req: {
-        query: NextApiRequest["query"];
-    };
-    /**
-     * The `res` object from a Next.js API route. This is given as a parameter to
-     * the API route.
-     *
-     * @see Next.js API route docs: {@link https://nextjs.org/docs/api-routes/introduction}
-     */
-    res: {
-        redirect: NextApiResponse["redirect"];
-    };
-    /**
-     * The Prismic client configured for the preview session's repository.
-     */
-    client: Client;
-    /**
-     * A Link Resolver used to resolve the previewed document's URL.
-     *
-     * @see To learn more about Link Resolver: {@link https://prismic.io/docs/core-concepts/link-resolver-route-resolver}
-     */
-    linkResolver?: LinkResolverFunction;
-    /**
-     * The default redirect URL if a URL cannot be determined for the previewed document.
-     */
-    defaultURL?: string;
-};
-
 /**
  * Configuration for `enableAutoPreviews`.
  *
@@ -113,7 +50,7 @@ declare type EnableAutoPreviewsConfig<TPreviewData extends PreviewData = Preview
      * Pass a `context` object when using `enableAutoPreviews` outside a
      * Next.js API endpoint.
      */
-    context?: NextContextLike<TPreviewData>;
+    previewData?: TPreviewData;
 } | {
     /**
      * A Next.js API endpoint request object.
@@ -129,7 +66,7 @@ declare type EnableAutoPreviewsConfig<TPreviewData extends PreviewData = Preview
  *
  * @param config - Configuration for the function.
  */
-declare const enableAutoPreviews: <TPreviewData extends PreviewData = PreviewData>(config: EnableAutoPreviewsConfig<TPreviewData>) => void;
+declare const enableAutoPreviews: <TPreviewData extends PreviewData>(config: EnableAutoPreviewsConfig<TPreviewData>) => void;
 
 /**
  * Configuration for `exitPreview`.
@@ -203,4 +140,61 @@ declare function PrismicPreview({ repositoryName, children, updatePreviewURL, ex
  */
 declare function redirectToPreviewURL({ req, res, client, linkResolver, defaultURL, }: PreviewConfig): Promise<void>;
 
-export { CreateClientConfig, EnableAutoPreviewsConfig, ExitPreviewConfig as ExitPreviewParams, NextContextLike, PreviewConfig, PrismicPreview, SetPreviewDataConfig, enableAutoPreviews, exitPreview, redirectToPreviewURL, setPreviewData };
+/**
+ * Configuration for creating a Prismic client with automatic preview support in
+ * Next.js apps.
+ */
+declare type CreateClientConfig = {
+    /**
+     * Preview data coming from Next.js context object. This context object comes
+     * from `getStaticProps` or `getServerSideProps`.
+     *
+     * Pass `previewData` when using outside a Next.js API endpoint.
+     */
+    previewData?: PreviewData;
+    /**
+     * A Next.js API endpoint request object.
+     *
+     * Pass a `req` object when using in a Next.js API endpoint.
+     */
+    req?: NextApiRequest;
+};
+/**
+ * Preview config for enabling previews with redirectToPreviewURL
+ */
+declare type PreviewConfig = {
+    /**
+     * The `req` object from a Next.js API route. This is given as a parameter to
+     * the API route.
+     *
+     * @see Next.js API route docs: {@link https://nextjs.org/docs/api-routes/introduction}
+     */
+    req: {
+        query: NextApiRequest["query"];
+    };
+    /**
+     * The `res` object from a Next.js API route. This is given as a parameter to
+     * the API route.
+     *
+     * @see Next.js API route docs: {@link https://nextjs.org/docs/api-routes/introduction}
+     */
+    res: {
+        redirect: NextApiResponse["redirect"];
+    };
+    /**
+     * The Prismic client configured for the preview session's repository.
+     */
+    client: Client;
+    /**
+     * A Link Resolver used to resolve the previewed document's URL.
+     *
+     * @see To learn more about Link Resolver: {@link https://prismic.io/docs/core-concepts/link-resolver-route-resolver}
+     */
+    linkResolver?: LinkResolverFunction;
+    /**
+     * The default redirect URL if a URL cannot be determined for the previewed document.
+     */
+    defaultURL?: string;
+};
+
+export { CreateClientConfig, EnableAutoPreviewsConfig, ExitPreviewConfig as ExitPreviewParams, PreviewConfig, PrismicPreview, SetPreviewDataConfig, enableAutoPreviews, exitPreview, redirectToPreviewURL, setPreviewData };

package/dist/index.mjs

@@ -1,12 +1,14 @@
+import * as prismic from '@prismicio/client';
 import React, { useEffect } from 'react';
 import { PrismicToolbar } from '@prismicio/react';
+import { useRouter } from 'next/router';
 
 async function setPreviewData({
   req,
   res
 }) {
-  if (req.query.token) {
-    const { token: ref } = req.query;
+  const ref = req.query.token || req.cookies[prismic.cookie.preview];
+  if (ref) {
     res.setPreviewData({ ref });
   }
 }
@@ -24,6 +26,50 @@ function exitPreview(config) {
   config.res.redirect("/");
 }
 
+const readValue = (value) => {
+  return value.replace(/%3B/g, ";");
+};
+const parse = (cookieString) => {
+  const result = {};
+  const cookies = cookieString.split("; ");
+  for (const cookie of cookies) {
+    const parts = cookie.split("=");
+    const value = parts.slice(1).join("=");
+    const name = readValue(parts[0]).replace(/%3D/g, "=");
+    result[name] = readValue(value);
+  }
+  return result;
+};
+const getAll = (cookieStore) => parse(cookieStore);
+const getCookie = (name, cookieStore) => getAll(cookieStore)[name];
+
+const extractFirstSubdomain = (host) => host.split(".")[0];
+const extractRepositoryNameFromObjectRef = (previewRef) => {
+  try {
+    const parsed = JSON.parse(decodeURIComponent(previewRef));
+    const keys = Object.keys(parsed);
+    const domainKey = keys.find((key) => /\.prismic\.io$/.test(key));
+    if (domainKey) {
+      return extractFirstSubdomain(domainKey);
+    } else {
+      return void 0;
+    }
+  } catch (e) {
+    return void 0;
+  }
+};
+const extractRepositoryNameFromURLRef = (previewRef) => {
+  try {
+    const url = new URL(previewRef);
+    return extractFirstSubdomain(url.host);
+  } catch (e) {
+    return void 0;
+  }
+};
+const extractPreviewRefRepositoryName = (previewRef) => {
+  return extractRepositoryNameFromObjectRef(previewRef) || extractRepositoryNameFromURLRef(previewRef);
+};
+
 const isPrismicUpdateToolbarEvent = (event) => {
   return "detail" in event && typeof event.detail.ref === "string";
 };
@@ -33,27 +79,36 @@ function PrismicPreview({
   updatePreviewURL = "/api/preview",
   exitPreviewURL = "/api/exit-preview"
 }) {
+  const router = useRouter();
   useEffect(() => {
-    const prismicPreviewUpdate = async (event) => {
+    const previewRefRepositoryName = extractPreviewRefRepositoryName(getCookie("io.prismic.preview", globalThis.document.cookie));
+    const startPreviewIfLoadedFromSharedLink = async () => {
+      if (previewRefRepositoryName === repositoryName && !router.isPreview) {
+        await fetch(updatePreviewURL);
+        window.location.reload();
+      }
+    };
+    startPreviewIfLoadedFromSharedLink();
+    const handlePrismicPreviewUpdate = async (event) => {
       if (isPrismicUpdateToolbarEvent(event)) {
         event.preventDefault();
-        await fetch(`${updatePreviewURL}?token=${event.detail.ref}`);
+        await fetch(updatePreviewURL);
         window.location.reload();
       }
     };
-    const prismicPreviewEnd = async (event) => {
+    const handlePrismicPreviewEnd = async (event) => {
       event.preventDefault();
       await fetch(exitPreviewURL);
       window.location.reload();
     };
     if (window) {
-      window.addEventListener("prismicPreviewUpdate", prismicPreviewUpdate);
-      window.addEventListener("prismicPreviewEnd", prismicPreviewEnd);
+      window.addEventListener("prismicPreviewUpdate", handlePrismicPreviewUpdate);
+      window.addEventListener("prismicPreviewEnd", handlePrismicPreviewEnd);
     }
     return () => {
       if (window) {
-        window.removeEventListener("prismicPreviewUpdate", prismicPreviewUpdate);
-        window.removeEventListener("prismicPreviewEnd", prismicPreviewEnd);
+        window.removeEventListener("prismicPreviewUpdate", handlePrismicPreviewUpdate);
+        window.removeEventListener("prismicPreviewEnd", handlePrismicPreviewEnd);
       }
     };
   }, []);
@@ -66,8 +121,8 @@ const isPrismicNextPreviewData = (previewData) => {
   return typeof previewData === "object" && "ref" in previewData;
 };
 const enableAutoPreviews = (config) => {
-  if ("context" in config && config.context) {
-    const previewData = config.context.previewData;
+  if ("previewData" in config && config.previewData) {
+    const { previewData } = config;
     if (isPrismicNextPreviewData(previewData) && previewData.ref) {
       config.client.queryContentFromRef(previewData.ref);
     }
@@ -93,6 +148,7 @@ async function redirectToPreviewURL({
       previewToken: token
     });
     res.redirect(previewUrl);
+    return;
   }
   res.redirect(defaultURL);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@prismicio/next",
-	"version": "0.0.1",
+	"version": "0.0.5",
 	"description": "Integrate Prismic into a Next.js app",
 	"keywords": [
 		"typescript",

package/src/PrismicPreview.tsx

@@ -1,5 +1,9 @@
 import React, { useEffect } from "react";
 import { PrismicToolbar } from "@prismicio/react";
+import { useRouter } from "next/router";
+
+import { getCookie } from "../lib/getCookie";
+import { extractPreviewRefRepositoryName } from "../lib/extractPreviewRefRepositoryName";
 
 /**
  * Props for `<PrismicPreview>`.
@@ -56,38 +60,66 @@ export function PrismicPreview({
 	updatePreviewURL = "/api/preview",
 	exitPreviewURL = "/api/exit-preview",
 }: PrismicPreviewProps): JSX.Element {
+	const router = useRouter();
+
 	useEffect(() => {
-		const prismicPreviewUpdate = async (event: Event) => {
+		const previewRefRepositoryName = extractPreviewRefRepositoryName(
+			getCookie("io.prismic.preview", globalThis.document.cookie) as string,
+		);
+
+		const startPreviewIfLoadedFromSharedLink = async () => {
+			if (previewRefRepositoryName === repositoryName && !router.isPreview) {
+				await fetch(updatePreviewURL);
+				window.location.reload();
+			}
+		};
+
+		startPreviewIfLoadedFromSharedLink();
+
+		const handlePrismicPreviewUpdate = async (event: Event) => {
 			if (isPrismicUpdateToolbarEvent(event)) {
 				// Prevent the toolbar from reloading the page.
 				event.preventDefault();
-				// Update the preview cookie.
-				await fetch(`${updatePreviewURL}?token=${event.detail.ref}`);
 
-				// Reload the page with the updated token.
+				// Start Next.js Preview Mode via the given preview API endpoint.
+				await fetch(updatePreviewURL);
+
+				// Reload the page with an active Preview Mode.
 				window.location.reload();
 			}
 		};
 
-		const prismicPreviewEnd = async (event: Event) => {
+		const handlePrismicPreviewEnd = async (event: Event) => {
+			// Prevent the toolbar from reloading the page.
 			event.preventDefault();
+
+			// Exit Next.js Preview Mode via the given preview API endpoint.
 			await fetch(exitPreviewURL);
+
+			// Reload the page with an active Preview Mode.
 			window.location.reload();
 		};
 
+		// Register Prismic Toolbar event handlers.
 		if (window) {
-			window.addEventListener("prismicPreviewUpdate", prismicPreviewUpdate);
-
-			window.addEventListener("prismicPreviewEnd", prismicPreviewEnd);
+			window.addEventListener(
+				"prismicPreviewUpdate",
+				handlePrismicPreviewUpdate,
+			);
+			window.addEventListener("prismicPreviewEnd", handlePrismicPreviewEnd);
 		}
 
+		// On cleanup, unregister Prismic Toolbar event handlers.
 		return () => {
 			if (window) {
 				window.removeEventListener(
 					"prismicPreviewUpdate",
-					prismicPreviewUpdate,
+					handlePrismicPreviewUpdate,
+				);
+				window.removeEventListener(
+					"prismicPreviewEnd",
+					handlePrismicPreviewEnd,
 				);
-				window.removeEventListener("prismicPreviewEnd", prismicPreviewEnd);
 			}
 		};
 	}, []);

package/src/enableAutoPreviews.ts

@@ -1,6 +1,5 @@
 import { PreviewData } from "next";
 import { Client, HttpRequestLike } from "@prismicio/client";
-import { NextContextLike } from "./types";
 
 interface PrismicNextPreviewData {
 	ref: string;
@@ -40,7 +39,7 @@ export type EnableAutoPreviewsConfig<
 			 * Pass a `context` object when using `enableAutoPreviews` outside a
 			 * Next.js API endpoint.
 			 */
-			context?: NextContextLike<TPreviewData>;
+			previewData?: TPreviewData;
 	  }
 	| {
 			/**
@@ -58,16 +57,14 @@ export type EnableAutoPreviewsConfig<
  *
  * @param config - Configuration for the function.
  */
-export const enableAutoPreviews = <
-	TPreviewData extends PreviewData = PreviewData,
->(
+export const enableAutoPreviews = <TPreviewData extends PreviewData>(
 	config: EnableAutoPreviewsConfig<TPreviewData>,
 ): void => {
 	/**
 	 * If preview data is being passed from Next Context then use queryContentFromRef
 	 */
-	if ("context" in config && config.context) {
-		const previewData = config.context.previewData;
+	if ("previewData" in config && config.previewData) {
+		const { previewData } = config;
 
 		if (isPrismicNextPreviewData(previewData) && previewData.ref) {
 			config.client.queryContentFromRef(previewData.ref);

package/src/index.ts

@@ -6,8 +6,4 @@ export { exitPreview } from "./exitPreview";
 export { PrismicPreview } from "./PrismicPreview";
 export { enableAutoPreviews } from "./enableAutoPreviews";
 export { redirectToPreviewURL } from "./redirectToPreviewURL";
-export type {
-	NextContextLike,
-	CreateClientConfig,
-	PreviewConfig,
-} from "./types";
+export type { CreateClientConfig, PreviewConfig } from "./types";

package/src/redirectToPreviewURL.ts

@@ -40,6 +40,8 @@ export async function redirectToPreviewURL({
 		});
 
 		res.redirect(previewUrl);
+
+		return;
 	}
 
 	res.redirect(defaultURL);

package/src/setPreviewData.ts

@@ -1,4 +1,5 @@
 import { NextApiResponse, NextApiRequest } from "next";
+import * as prismic from "@prismicio/client";
 
 /**
  * Configuration for `setPreviewData`.
@@ -12,6 +13,7 @@ export type SetPreviewDataConfig = {
 	 */
 	req: {
 		query: NextApiRequest["query"];
+		cookies: NextApiRequest["cookies"];
 	};
 
 	/**
@@ -32,8 +34,9 @@ export async function setPreviewData({
 	req,
 	res,
 }: SetPreviewDataConfig): Promise<void> {
-	if (req.query.token) {
-		const { token: ref } = req.query;
+	const ref = req.query.token || req.cookies[prismic.cookie.preview];
+
+	if (ref) {
 		res.setPreviewData({ ref });
 	}
 }

package/src/types.ts

@@ -2,26 +2,18 @@ import { PreviewData, NextApiRequest, NextApiResponse } from "next";
 import { LinkResolverFunction } from "@prismicio/helpers";
 import { Client } from "@prismicio/client";
 
-/**
- * Next.js context object from APIs supporting Preview Mode. This includes the
- * context object from `getStaticProps` and `getServerSideProps`.
- */
-export type NextContextLike<TPreviewData extends PreviewData = PreviewData> = {
-	previewData?: TPreviewData;
-};
-
 /**
  * Configuration for creating a Prismic client with automatic preview support in
  * Next.js apps.
  */
 export type CreateClientConfig = {
 	/**
-	 * A Next.js context object (such as the context object from `getStaticProps`
-	 * or `getServerSideProps`).
+	 * Preview data coming from Next.js context object. This context object comes
+	 * from `getStaticProps` or `getServerSideProps`.
 	 *
-	 * Pass a `context` when using outside a Next.js API endpoint.
+	 * Pass `previewData` when using outside a Next.js API endpoint.
 	 */
-	context?: NextContextLike;
+	previewData?: PreviewData;
 
 	/**
 	 * A Next.js API endpoint request object.