next-sanity 2.0.2 → 2.1.0-webhook.1

package/README.md

@@ -28,6 +28,7 @@
   - [Opt-in to using `StudioProvider` and `StudioLayout`](#opt-in-to-using-studioprovider-and-studiolayout)
   - [Customize `<ServerStyleSheetDocument />`](#customize-serverstylesheetdocument-)
   - [Full-control mode](#full-control-mode)
+- [`next-sanity/webhook`](#next-sanitywebhook)
 - [Migrate](#migrate)
   - [From `v1`](#from-v1)
     - [`createPreviewSubscriptionHook` is replaced with `definePreview`](#createpreviewsubscriptionhook-is-replaced-with-definepreview)
@@ -596,6 +597,42 @@ function Studiopage() {
 }
 ```
 
+## `next-sanity/webhook`
+
+Implements [`@sanity/webhook`](https://github.com/sanity-io/webhook-toolkit) to parse and verify that a [Webhook](https://www.sanity.io/docs/webhooks) is indeed coming from Sanity infrastructure.
+
+`pages/api/revalidate`:
+
+```ts
+import type {NextApiRequest, NextApiResponse} from 'next'
+import {parseBody} from 'next-sanity/webhook'
+
+// Export the config from next-sanity to enable validating the request body signature properly
+export {config} from 'next-sanity/webhook'
+
+export default async function revalidate(req: NextApiRequest, res: NextApiResponse) {
+  try {
+    const {isValidSignature, body} = await parseBody(req, process.env.SANITY_REVALIDATE_SECRET)
+
+    if (!isValidSignature) {
+      const message = 'Invalid signature'
+      console.warn(message)
+      res.status(401).json({message})
+      return
+    }
+
+    const staleRoute = `/${body.slug.current}`
+    await res.revalidate(staleRoute)
+    const message = `Updated route: ${staleRoute}`
+    console.log(message)
+    return res.status(200).json({message})
+  } catch (err) {
+    console.error(err)
+    return res.status(500).json({message: err.message})
+  }
+}
+```
+
 ## Migrate
 
 ### From `v1`

package/dist/webhook.cjs

@@ -0,0 +1,46 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var sanityWebhook = require('@sanity/webhook');
+function _interopDefaultLegacy(e) {
+  return e && typeof e === 'object' && 'default' in e ? e : {
+    'default': e
+  };
+}
+var sanityWebhook__default = /*#__PURE__*/_interopDefaultLegacy(sanityWebhook);
+const config = {
+  api: {
+    bodyParser: false
+  }
+};
+async function _readBody(readable) {
+  const chunks = [];
+  for await (const chunk of readable) {
+    chunks.push(typeof chunk === "string" ? Buffer.from(chunk) : chunk);
+  }
+  return Buffer.concat(chunks).toString("utf8");
+}
+const {
+  isValidSignature,
+  SIGNATURE_HEADER_NAME
+} = sanityWebhook__default["default"];
+async function parseBody(req, secret, waitForContentLakeEventualConsistency) {
+  let signature = req.headers[SIGNATURE_HEADER_NAME];
+  if (Array.isArray(signature)) {
+    signature = signature[0];
+  }
+  const body = await _readBody(req);
+  const validSignature = secret ? isValidSignature(body, signature, secret.trim()) : null;
+  if (validSignature !== false && waitForContentLakeEventualConsistency) {
+    await new Promise(resolve => setTimeout(resolve, 1e3));
+  }
+  return {
+    body: JSON.parse(body),
+    isValidSignature: validSignature
+  };
+}
+exports.config = config;
+exports.parseBody = parseBody;
+//# sourceMappingURL=webhook.cjs.map

package/dist/webhook.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"webhook.cjs","sources":["../src/webhook/config.ts","../src/webhook/readBody.ts","../src/webhook/parseBody.ts"],"sourcesContent":["/**\n * Next.js will by default parse the body, which can lead to invalid signatures\n * @public\n */\nexport const config = {api: {bodyParser: false}}\n","import type {NextApiRequest} from 'next'\n\n/** @internal */\nexport async function _readBody(readable: NextApiRequest): Promise<string> {\n  const chunks = []\n  for await (const chunk of readable) {\n    chunks.push(typeof chunk === 'string' ? Buffer.from(chunk) : chunk)\n  }\n  return Buffer.concat(chunks).toString('utf8')\n}\n","import type {SanityDocument} from '@sanity/types'\nimport sanityWebhook from '@sanity/webhook'\nimport type {NextApiRequest} from 'next'\n\n// As `@sanity/webhook` isn't shipping ESM, extracting from the default export have the best ecosystem support\nconst {isValidSignature, SIGNATURE_HEADER_NAME} = sanityWebhook\n\nimport {_readBody as readBody} from './readBody'\n\n/** @public */\nexport type ParseBody = {\n  /**\n   * If a secret is given then it returns a boolean. If no secret is provided then no validation is done on the signature, and it'll return `null`\n   */\n  isValidSignature: boolean | null\n  body: SanityDocument\n}\n/**\n * Handles parsing the body JSON, and validating its signature. Also waits for Content Lake eventual consistency so you can run your queries\n * without worrying about getting stale data.\n * @public\n */\nexport async function parseBody(\n  req: NextApiRequest,\n  secret?: string,\n  waitForContentLakeEventualConsistency?: boolean\n): Promise<ParseBody> {\n  let signature = req.headers[SIGNATURE_HEADER_NAME]!\n  if (Array.isArray(signature)) {\n    signature = signature[0]\n  }\n\n  // Read the body into a string\n  const body = await readBody(req)\n  // Then we're able to verify the checksum signature\n  const validSignature = secret ? isValidSignature(body, signature, secret.trim()) : null\n\n  if (validSignature !== false && waitForContentLakeEventualConsistency) {\n    // Wait a second to give Elastic Search time to reach eventual consistency\n    await new Promise((resolve) => setTimeout(resolve, 1000))\n  }\n\n  return {\n    body: JSON.parse(body),\n    isValidSignature: validSignature,\n  }\n}\n"],"names":["config","api","bodyParser","_readBody","readable","chunks","chunk","push","Buffer","from","concat","toString","isValidSignature","SIGNATURE_HEADER_NAME","sanityWebhook","parseBody","req","secret","waitForContentLakeEventualConsistency","signature","headers","Array","isArray","body","readBody","validSignature","trim","Promise","resolve","setTimeout","JSON","parse"],"mappings":";;;;;;;;;;;;AAIO,MAAMA,SAAS;EAACC,GAAA,EAAK;IAACC,UAAA,EAAY;EAAM;AAAA,CAAA;ACD/C,eAAsBC,UAAUC,QAA2C,EAAA;EACzE,MAAMC,SAAS,EAAC;EAChB,WAAA,MAAiBC,SAASF,QAAU,EAAA;IAC3BC,MAAA,CAAAE,IAAA,CAAK,OAAOD,KAAU,KAAA,QAAA,GAAWE,OAAOC,IAAK,CAAAH,KAAK,IAAIA,KAAK,CAAA;EACpE;EACA,OAAOE,MAAO,CAAAE,MAAA,CAAOL,MAAM,CAAA,CAAEM,SAAS,MAAM,CAAA;AAC9C;ACJA,MAAM;EAACC,gBAAkB;EAAAC;AAAyB,CAAA,GAAAC,iCAAA;AAiB5B,eAAAC,SAAA,CACpBC,GACA,EAAAC,MAAA,EACAC,qCACoB,EAAA;EAChB,IAAAC,SAAA,GAAYH,IAAII,OAAQ,CAAAP,qBAAA,CAAA;EACxB,IAAAQ,KAAA,CAAMC,OAAQ,CAAAH,SAAS,CAAG,EAAA;IAC5BA,SAAA,GAAYA,SAAU,CAAA,CAAA,CAAA;EACxB;EAGM,MAAAI,IAAA,GAAO,MAAMC,SAAA,CAASR,GAAG,CAAA;EAEzB,MAAAS,cAAA,GAAiBR,SAASL,gBAAiB,CAAAW,IAAA,EAAMJ,WAAWF,MAAO,CAAAS,IAAA,EAAM,CAAI,GAAA,IAAA;EAE/E,IAAAD,cAAA,KAAmB,SAASP,qCAAuC,EAAA;IAErE,MAAM,IAAIS,OAAQ,CAACC,WAAYC,UAAW,CAAAD,OAAA,EAAS,GAAI,CAAC,CAAA;EAC1D;EAEO,OAAA;IACLL,IAAA,EAAMO,IAAK,CAAAC,KAAA,CAAMR,IAAI,CAAA;IACrBX,gBAAkB,EAAAa;EAAA,CACpB;AACF;;"}

package/dist/webhook.d.ts

@@ -0,0 +1,34 @@
+import type {NextApiRequest} from 'next'
+import type {SanityDocument} from '@sanity/types'
+
+/**
+ * Next.js will by default parse the body, which can lead to invalid signatures
+ * @public
+ */
+export declare const config: {
+  api: {
+    bodyParser: boolean
+  }
+}
+
+/** @public */
+export declare type ParseBody = {
+  /**
+   * If a secret is given then it returns a boolean. If no secret is provided then no validation is done on the signature, and it'll return `null`
+   */
+  isValidSignature: boolean | null
+  body: SanityDocument
+}
+
+/**
+ * Handles parsing the body JSON, and validating its signature. Also waits for Content Lake eventual consistency so you can run your queries
+ * without worrying about getting stale data.
+ * @public
+ */
+export declare function parseBody(
+  req: NextApiRequest,
+  secret?: string,
+  waitForContentLakeEventualConsistency?: boolean
+): Promise<ParseBody>
+
+export {}

package/dist/webhook.js

@@ -0,0 +1,34 @@
+import sanityWebhook from '@sanity/webhook';
+const config = {
+  api: {
+    bodyParser: false
+  }
+};
+async function _readBody(readable) {
+  const chunks = [];
+  for await (const chunk of readable) {
+    chunks.push(typeof chunk === "string" ? Buffer.from(chunk) : chunk);
+  }
+  return Buffer.concat(chunks).toString("utf8");
+}
+const {
+  isValidSignature,
+  SIGNATURE_HEADER_NAME
+} = sanityWebhook;
+async function parseBody(req, secret, waitForContentLakeEventualConsistency) {
+  let signature = req.headers[SIGNATURE_HEADER_NAME];
+  if (Array.isArray(signature)) {
+    signature = signature[0];
+  }
+  const body = await _readBody(req);
+  const validSignature = secret ? isValidSignature(body, signature, secret.trim()) : null;
+  if (validSignature !== false && waitForContentLakeEventualConsistency) {
+    await new Promise(resolve => setTimeout(resolve, 1e3));
+  }
+  return {
+    body: JSON.parse(body),
+    isValidSignature: validSignature
+  };
+}
+export { config, parseBody };
+//# sourceMappingURL=webhook.js.map

package/dist/webhook.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webhook.js","sources":["../src/webhook/config.ts","../src/webhook/readBody.ts","../src/webhook/parseBody.ts"],"sourcesContent":["/**\n * Next.js will by default parse the body, which can lead to invalid signatures\n * @public\n */\nexport const config = {api: {bodyParser: false}}\n","import type {NextApiRequest} from 'next'\n\n/** @internal */\nexport async function _readBody(readable: NextApiRequest): Promise<string> {\n  const chunks = []\n  for await (const chunk of readable) {\n    chunks.push(typeof chunk === 'string' ? Buffer.from(chunk) : chunk)\n  }\n  return Buffer.concat(chunks).toString('utf8')\n}\n","import type {SanityDocument} from '@sanity/types'\nimport sanityWebhook from '@sanity/webhook'\nimport type {NextApiRequest} from 'next'\n\n// As `@sanity/webhook` isn't shipping ESM, extracting from the default export have the best ecosystem support\nconst {isValidSignature, SIGNATURE_HEADER_NAME} = sanityWebhook\n\nimport {_readBody as readBody} from './readBody'\n\n/** @public */\nexport type ParseBody = {\n  /**\n   * If a secret is given then it returns a boolean. If no secret is provided then no validation is done on the signature, and it'll return `null`\n   */\n  isValidSignature: boolean | null\n  body: SanityDocument\n}\n/**\n * Handles parsing the body JSON, and validating its signature. Also waits for Content Lake eventual consistency so you can run your queries\n * without worrying about getting stale data.\n * @public\n */\nexport async function parseBody(\n  req: NextApiRequest,\n  secret?: string,\n  waitForContentLakeEventualConsistency?: boolean\n): Promise<ParseBody> {\n  let signature = req.headers[SIGNATURE_HEADER_NAME]!\n  if (Array.isArray(signature)) {\n    signature = signature[0]\n  }\n\n  // Read the body into a string\n  const body = await readBody(req)\n  // Then we're able to verify the checksum signature\n  const validSignature = secret ? isValidSignature(body, signature, secret.trim()) : null\n\n  if (validSignature !== false && waitForContentLakeEventualConsistency) {\n    // Wait a second to give Elastic Search time to reach eventual consistency\n    await new Promise((resolve) => setTimeout(resolve, 1000))\n  }\n\n  return {\n    body: JSON.parse(body),\n    isValidSignature: validSignature,\n  }\n}\n"],"names":["config","api","bodyParser","_readBody","readable","chunks","chunk","push","Buffer","from","concat","toString","isValidSignature","SIGNATURE_HEADER_NAME","sanityWebhook","parseBody","req","secret","waitForContentLakeEventualConsistency","signature","headers","Array","isArray","body","readBody","validSignature","trim","Promise","resolve","setTimeout","JSON","parse"],"mappings":";AAIO,MAAMA,SAAS;EAACC,GAAA,EAAK;IAACC,UAAA,EAAY;EAAM;AAAA,CAAA;ACD/C,eAAsBC,UAAUC,QAA2C,EAAA;EACzE,MAAMC,SAAS,EAAC;EAChB,WAAA,MAAiBC,SAASF,QAAU,EAAA;IAC3BC,MAAA,CAAAE,IAAA,CAAK,OAAOD,KAAU,KAAA,QAAA,GAAWE,OAAOC,IAAK,CAAAH,KAAK,IAAIA,KAAK,CAAA;EACpE;EACA,OAAOE,MAAO,CAAAE,MAAA,CAAOL,MAAM,CAAA,CAAEM,SAAS,MAAM,CAAA;AAC9C;ACJA,MAAM;EAACC,gBAAkB;EAAAC;AAAyB,CAAA,GAAAC,aAAA;AAiB5B,eAAAC,SAAA,CACpBC,GACA,EAAAC,MAAA,EACAC,qCACoB,EAAA;EAChB,IAAAC,SAAA,GAAYH,IAAII,OAAQ,CAAAP,qBAAA,CAAA;EACxB,IAAAQ,KAAA,CAAMC,OAAQ,CAAAH,SAAS,CAAG,EAAA;IAC5BA,SAAA,GAAYA,SAAU,CAAA,CAAA,CAAA;EACxB;EAGM,MAAAI,IAAA,GAAO,MAAMC,SAAA,CAASR,GAAG,CAAA;EAEzB,MAAAS,cAAA,GAAiBR,SAASL,gBAAiB,CAAAW,IAAA,EAAMJ,WAAWF,MAAO,CAAAS,IAAA,EAAM,CAAI,GAAA,IAAA;EAE/E,IAAAD,cAAA,KAAmB,SAASP,qCAAuC,EAAA;IAErE,MAAM,IAAIS,OAAQ,CAACC,WAAYC,UAAW,CAAAD,OAAA,EAAS,GAAI,CAAC,CAAA;EAC1D;EAEO,OAAA;IACLL,IAAA,EAAMO,IAAK,CAAAC,KAAA,CAAMR,IAAI,CAAA;IACrBX,gBAAkB,EAAAa;EAAA,CACpB;AACF;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-sanity",
-  "version": "2.0.2",
+  "version": "2.1.0-webhook.1",
   "description": "Sanity.io toolkit for Next.js",
   "keywords": [
     "sanity",
@@ -50,6 +50,13 @@
       "require": "./dist/studio.cjs",
       "default": "./dist/studio.js"
     },
+    "./webhook": {
+      "types": "./dist/webhook.d.ts",
+      "source": "./src/webhook/index.ts",
+      "import": "./dist/webhook.js",
+      "require": "./dist/webhook.cjs",
+      "default": "./dist/webhook.js"
+    },
     "./package.json": "./package.json"
   },
   "main": "./dist/index.cjs",
@@ -63,6 +70,9 @@
       ],
       "studio": [
         "./dist/studio.d.ts"
+      ],
+      "webhook": [
+        "./dist/webhook.d.ts"
       ]
     }
   },
@@ -101,6 +111,7 @@
   "dependencies": {
     "@sanity/client": "^3.4.1",
     "@sanity/preview-kit": "^1.2.8",
+    "@sanity/webhook": "^2.0.0",
     "groq": "^2.33.2"
   },
   "devDependencies": {
@@ -119,7 +130,7 @@
     "@types/styled-components": "^5.1.26",
     "@typescript-eslint/eslint-plugin": "^5.43.0",
     "autoprefixer": "^10.4.13",
-    "eslint": "^8.27.0",
+    "eslint": "^8.28.0",
     "eslint-config-next": "13.0.4",
     "eslint-config-prettier": "^8.5.0",
     "eslint-config-sanity": "^6.0.0",
@@ -144,12 +155,16 @@
     "typescript": "^4.9.3"
   },
   "peerDependencies": {
+    "@sanity/types": "*",
     "next": "^12 || ^13",
     "react": "^16.3 || ^17 || ^18",
     "sanity": "dev-preview",
     "styled-components": "^5.2"
   },
   "peerDependenciesMeta": {
+    "@sanity/types": {
+      "optional": true
+    },
     "sanity": {
       "optional": true
     },

package/src/webhook/config.ts

@@ -0,0 +1,5 @@
+/**
+ * Next.js will by default parse the body, which can lead to invalid signatures
+ * @public
+ */
+export const config = {api: {bodyParser: false}}

package/src/webhook/index.ts

@@ -0,0 +1,2 @@
+export * from './config'
+export * from './parseBody'

package/src/webhook/parseBody.ts

@@ -0,0 +1,47 @@
+import type {SanityDocument} from '@sanity/types'
+import sanityWebhook from '@sanity/webhook'
+import type {NextApiRequest} from 'next'
+
+// As `@sanity/webhook` isn't shipping ESM, extracting from the default export have the best ecosystem support
+const {isValidSignature, SIGNATURE_HEADER_NAME} = sanityWebhook
+
+import {_readBody as readBody} from './readBody'
+
+/** @public */
+export type ParseBody = {
+  /**
+   * If a secret is given then it returns a boolean. If no secret is provided then no validation is done on the signature, and it'll return `null`
+   */
+  isValidSignature: boolean | null
+  body: SanityDocument
+}
+/**
+ * Handles parsing the body JSON, and validating its signature. Also waits for Content Lake eventual consistency so you can run your queries
+ * without worrying about getting stale data.
+ * @public
+ */
+export async function parseBody(
+  req: NextApiRequest,
+  secret?: string,
+  waitForContentLakeEventualConsistency?: boolean
+): Promise<ParseBody> {
+  let signature = req.headers[SIGNATURE_HEADER_NAME]!
+  if (Array.isArray(signature)) {
+    signature = signature[0]
+  }
+
+  // Read the body into a string
+  const body = await readBody(req)
+  // Then we're able to verify the checksum signature
+  const validSignature = secret ? isValidSignature(body, signature, secret.trim()) : null
+
+  if (validSignature !== false && waitForContentLakeEventualConsistency) {
+    // Wait a second to give Elastic Search time to reach eventual consistency
+    await new Promise((resolve) => setTimeout(resolve, 1000))
+  }
+
+  return {
+    body: JSON.parse(body),
+    isValidSignature: validSignature,
+  }
+}

package/src/webhook/readBody.ts

@@ -0,0 +1,10 @@
+import type {NextApiRequest} from 'next'
+
+/** @internal */
+export async function _readBody(readable: NextApiRequest): Promise<string> {
+  const chunks = []
+  for await (const chunk of readable) {
+    chunks.push(typeof chunk === 'string' ? Buffer.from(chunk) : chunk)
+  }
+  return Buffer.concat(chunks).toString('utf8')
+}