chore: squash everything

chore(deps): update nextjs monorepo to v15.0.0-canary.191 (canary) (#1717)

Delete index.test.ts

fix(deps): update dependency @sanity/preview-kit to v5.1.4 (canary) (#1735)

chore: switch to canaries

chore: handle typo

chore(lockfile): 🤖 ✨ (#1722)

chore: bump deps

chore: add back preview-kit

chore(release): publish canary [skip ci]

chore: bump canaries

chore(release): publish canary [skip ci]

chore: bump canaries

chore(release): publish canary [skip ci]

chore: bump deps

chore(deps): update app dependencies (canary) (#1713)

chore(release): publish canary [skip ci]

chore: bump canaries

chore: fix build error

chore(deps): update nextjs monorepo to v15.0.0-canary.171 (canary) (#1711)

chore(release): publish canary [skip ci]

chore: bump canaries

chore(deps): update app dependencies (canary) (#1708)

chore: fix ts error

chore(deps): update linters (canary) (#1710)

chore: use new tokens

chore(release): publish canary [skip ci]

chore: bump canaries

fix: support next v15 async APIs

chore(deps): update nextjs monorepo to v15.0.0-canary.167 (canary) (#1705)

chore(release): publish canary [skip ci]

chore: prevent `removeChild` exception

chore(deps): update app dependencies (canary) (#1706)

chore(deps): update sanity monorepo to v3.58.0 (canary) (#1707)

chore(deps): update linters (canary) (#1704)

chore(deps): update dependency prettier-plugin-tailwindcss to v0.6.8 (canary) (#1703)

chore(deps): update dependency @types/react to ^18.3.9 (canary) (#1702)

chore(release): publish canary [skip ci]

chore: bump canaries

chore(release): publish canary [skip ci]

fix(visual-editing): render overlays in a portal

chore(release): publish canary [skip ci]

chore: bump canaries

chore(release): publish canary [skip ci]

chore: bump canaries

chore(deps): update dependency eslint-config-next to v15.0.0-canary.165 (canary) (#1700)

chore(deps): update nextjs monorepo to v15.0.0-canary.165 (canary) (#1701)

chore(deps): update app dependencies (canary) (#1699)

chore(release): publish canary [skip ci]

chore: bump canaries

chore(release): publish canary [skip ci]

chore(lockfile): 🤖 ✨ (#1698)

chore: bump canaries

chore(release): publish canary [skip ci]

chore: render overlays directly

chore(release): publish canary [skip ci]

chore: bump deps

chore(deps): update nextjs monorepo to v15.0.0-canary.162 (canary) (#1696)

chore(deps): update dependency @types/react to ^18.3.8 (canary) (#1694)

chore(deps): update dependency eslint-config-next to v15.0.0-canary.162 (canary) (#1695)

chore(deps): update app dependencies (canary) (#1693)

chore(deps): update pnpm to v9.11.0 (canary) (#1697)

chore(release): publish canary [skip ci]

chore: bump deps

chore(release): publish canary [skip ci]

chore: make it a tiny bit easier to use

chore(release): publish canary [skip ci]

chore: bump canary

chore(release): publish canary [skip ci]

chore: add hooks export

chore(release): publish canary [skip ci]

chore: bump deps

chore(release): publish canary [skip ci]

chore: bump deps

chore(release): publish canary [skip ci]

chore: bump deps and enable debug

chore(release): publish canary [skip ci]

chore: bye bye preview-kit

chore: use route groups to support live mode

chore: test live api

chore(release): publish canary [skip ci]

chore(deps): bump canaries

chore(deps): update dependency eslint-plugin-react-compiler to v0.0.0-experimental-92aaa43-20240919 (canary) (#1690)

chore(lockfile): update dependency next to v15.0.0-rc.0 (canary) (#1691)

chore(deps): update dependency next to v15.0.0-rc.0 (canary) (#1679)

chore(release): publish canary [skip ci]

fix(deps): update dependency @sanity/visual-editing to v2.1.11-canary.13

chore(deps): update app dependencies (canary) (#1684)

chore(release): publish canary [skip ci]

chore(deps): bump canaries

chore(deps): update linters (canary) (#1682)

chore: bump canaries

chore(deps): update dependency styled-components to ^6.1.13 (canary) (#1681)

chore(deps): update dependency @sanity/prettier-config to v1.0.3 (canary) (#1686)

chore(deps): update dependency @types/react to ^18.3.7 (canary) (#1687)

chore(deps): update dependency prettier-plugin-packagejson to v2.5.2 (canary) (#1680)

fix(deps): Update dependency @sanity/assist to v3.0.6 (canary) (#1683)

chore: fix linter

chore(deps): update vitest monorepo to ^2.1.1 (canary) (#1685)

chore(release): publish canary [skip ci]

feat: add `defineLive` API

chore(lockfile): 🤖 ✨ (#1678)

chore: test lockfile fix automation

.github/renovate.json

@@ -48,6 +48,17 @@
     {
       "matchDepNames": ["babel-plugin-react-compiler", "eslint-plugin-react-compiler"],
       "followTag": "experimental"
+    },
+    {
+      "matchDepNames": [
+        "@sanity/client",
+        "@sanity/presentation",
+        "@sanity/preview-kit",
+        "@sanity/next-loader",
+        "@sanity/visual-editing"
+      ],
+      "matchFileNames": ["package.json", "packages/next-sanity/package.json"],
+      "followTag": "canary"
     }
   ],
   "ignorePresets": [":ignoreModulesAndTests", "github>sanity-io/renovate-config:group-non-major"]

apps/mvp/app/(website)/actions.ts

@@ -0,0 +1,38 @@
+'use server'
+
+import {draftMode} from 'next/headers'
+
+import {verifyPreviewSecret} from './live'
+
+export async function handleDraftModeAction(secret: string): Promise<void | string> {
+  console.log('Server Action wants to enable Draft Mode', {secret})
+
+  if ((await draftMode()).isEnabled) {
+    // eslint-disable-next-line no-console
+    console.log('Draft Mode is already enabled')
+    return
+  }
+
+  try {
+    const {isValid} = await verifyPreviewSecret(secret)
+
+    if (!isValid) {
+      return 'Invalid secret provided'
+    }
+
+    console.log('Enabling Draft Mode')
+    ;(await draftMode()).enable()
+  } catch (err) {
+    console.error('Failed to verify preview secret', {secret}, err)
+    return 'Unexpected error'
+  }
+}
+
+export async function disableDraftMode() {
+  'use server'
+  await Promise.allSettled([
+    (await draftMode()).disable(),
+    // Simulate a delay to show the loading state
+    new Promise((resolve) => setTimeout(resolve, 1000)),
+  ])
+}

apps/mvp/app/(website)/layout.tsx

@@ -3,13 +3,17 @@ import '../globals.css'
 import {draftMode} from 'next/headers'
 import {VisualEditing} from 'next-sanity'
 
+import {handleDraftModeAction} from './actions'
+import {SanityLive} from './live'
+
 export default async function RootLayout({children}: {children: React.ReactNode}) {
   return (
     <html lang="en">
       <head />
       <body>
         {children}
         {(await draftMode()).isEnabled && <VisualEditing />}
+        <SanityLive handleDraftModeAction={handleDraftModeAction} ignoreBrowserTokenWarning />
       </body>
     </html>
   )

apps/mvp/app/(website)/live.ts

@@ -0,0 +1,13 @@
+import 'server-only'
+
+import {defineLive} from 'next-sanity'
+
+import {client} from './sanity.client'
+
+const token = process.env.SANITY_API_READ_TOKEN!
+
+export const {sanityFetch, SanityLive, verifyPreviewSecret} = defineLive({
+  client,
+  serverToken: token,
+  browserToken: token,
+})

apps/mvp/app/(website)/page.tsx

@@ -1,12 +1,15 @@
 /* eslint-disable @next/next/no-html-link-for-pages */
+import {draftMode} from 'next/headers'
 import Link from 'next/link'
 import {unstable__adapter, unstable__environment} from 'next-sanity'
-import {Suspense} from 'react'
 
-import ConditionalPreviewProvider from './ConditionalPreviewProvider'
-import Posts from './Posts'
+import PostsLayout, {query} from '@/app/(website)/PostsLayout'
+
+import {sanityFetch} from './live'
+
+export default async function IndexPage() {
+  const {data} = await sanityFetch({query})
 
-export default function IndexPage() {
   return (
     <>
       <div
@@ -20,14 +23,10 @@ export default function IndexPage() {
         <div className="relative mx-auto max-w-7xl">
           <div className="text-center">
             <h2 className="text-3xl font-extrabold tracking-tight text-gray-900 sm:text-4xl">
-              Preview Kit
+              Posts {(await draftMode()).isEnabled && '(Draft Mode)'}
             </h2>
           </div>
-          <ConditionalPreviewProvider>
-            <Suspense>
-              <Posts />
-            </Suspense>
-          </ConditionalPreviewProvider>
+          <PostsLayout data={data} draftMode={(await draftMode()).isEnabled} />
         </div>
       </div>
       <div className="flex text-center">
@@ -37,12 +36,6 @@ export default function IndexPage() {
         >
           Open Studio
         </Link>
-        <Link
-          href="/visual-editing-only"
-          className="mx-2 my-4 inline-block rounded-full border border-gray-200 px-4 py-1 text-sm font-semibold text-gray-600 hover:border-transparent hover:bg-gray-600 hover:text-white focus:outline-none focus:ring-2 focus:ring-gray-600 focus:ring-offset-2"
-        >
-          Visual Editing Only
-        </Link>
       </div>
     </>
   )

apps/mvp/app/(website)/sanity.client.ts

@@ -3,7 +3,7 @@ import {createClient} from 'next-sanity'
 export const client = createClient({
   projectId: process.env.NEXT_PUBLIC_SANITY_PROJECT_ID!,
   dataset: process.env.NEXT_PUBLIC_SANITY_DATASET!,
-  apiVersion: '2022-11-11',
+  apiVersion: 'X',
   useCdn: false,
   perspective: 'published',
   resultSourceMap: 'withKeyArraySelector',

apps/mvp/sanity.config.ts

@@ -5,24 +5,14 @@
 import sharedConfig from '@repo/sanity-config'
 import {debugSecrets} from '@sanity/preview-url-secret/sanity-plugin-debug-secrets'
 import {defineConfig} from 'sanity'
-import {presentationTool, type PreviewUrlResolverOptions} from 'sanity/presentation'
+import {presentationTool} from 'sanity/presentation'
 
 const projectId = process.env.NEXT_PUBLIC_SANITY_PROJECT_ID!
 const dataset = process.env.NEXT_PUBLIC_SANITY_DATASET!
 
-const previewMode = {
-  enable: `${process.env.NEXT_PUBLIC_TEST_BASE_PATH || ''}/api/draft`,
-} satisfies PreviewUrlResolverOptions['previewMode']
-
 export default defineConfig({
   projectId,
   dataset,
 
-  plugins: [
-    presentationTool({
-      previewUrl: {preview: `${process.env.NEXT_PUBLIC_TEST_BASE_PATH}/` || '/', previewMode},
-    }),
-    sharedConfig(),
-    debugSecrets(),
-  ],
+  plugins: [presentationTool({}), sharedConfig(), debugSecrets()],
 })

package.json

@@ -6,6 +6,7 @@
     "build": "turbo build --filter=./packages/*",
     "dev": "turbo dev",
     "format": "prettier --cache --write .",
+    "bump:canaries": "pnpm -r up @sanity/next-loader@canary @sanity/presentation@canary @sanity/visual-editing@canary && pnpm dedupe",
     "lint": "turbo lint",
     "prestart": "turbo build",
     "start": "turbo watch build start",
@@ -15,6 +16,7 @@
   "devDependencies": {
     "@next/bundle-analyzer": "15.0.0-canary.191",
     "@next/env": "15.0.0-canary.191",
+    "@sanity/presentation": "1.16.6-canary.37",
     "@sanity/prettier-config": "1.0.3",
     "eslint-config-next": "15.0.0-canary.191",
     "next": "15.0.0-canary.191",
@@ -35,6 +37,7 @@
     "overrides": {
       "@next/bundle-analyzer": "$@next/bundle-analyzer",
       "@next/env": "$@next/env",
+      "@sanity/presentation": "$@sanity/presentation",
       "eslint-config-next": "$eslint-config-next",
       "next": "$next"
     }

packages/next-sanity/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-sanity",
-  "version": "9.5.2",
+  "version": "9.7.0-canary.0",
   "description": "Sanity.io toolkit for Next.js",
   "keywords": [
     "sanity",
@@ -31,6 +31,12 @@
       "require": "./dist/index.cjs",
       "default": "./dist/index.js"
     },
+    "./hooks": {
+      "source": "./src/hooks/index.ts",
+      "import": "./dist/hooks.js",
+      "require": "./dist/hooks.cjs",
+      "default": "./dist/hooks.js"
+    },
     "./image": {
       "source": "./src/image/index.ts",
       "import": "./dist/image.js",
@@ -86,6 +92,9 @@
   "types": "./dist/index.d.ts",
   "typesVersions": {
     "*": {
+      "hooks": [
+        "./dist/hooks.d.ts"
+      ],
       "image": [
         "./dist/image.d.ts"
       ],
@@ -129,8 +138,9 @@
   "dependencies": {
     "@portabletext/react": "^3.1.0",
     "@sanity/client": "^6.22.1",
-    "@sanity/preview-kit": "5.1.3",
-    "@sanity/visual-editing": "2.1.10",
+    "@sanity/next-loader": "0.0.1-canary.34",
+    "@sanity/preview-kit": "5.1.4",
+    "@sanity/visual-editing": "2.1.11-canary.37",
     "groq": "^3.57.4",
     "history": "^5.3.0"
   },

packages/next-sanity/src/hooks/index.ts

@@ -0,0 +1,2 @@
+export * from '@sanity/next-loader/hooks'
+export {useOptimistic} from '@sanity/visual-editing'