tinloof · siffogh · Oct 22, 2024 · Oct 22, 2024
diff --git a/.changeset/shaggy-needles-repeat.md b/.changeset/shaggy-needles-repeat.md
@@ -0,0 +1,8 @@
+---
+"@tinloof/sanity-studio": minor
+"@tinloof/sanity-web": minor
+"vite-studio": minor
+"next-non-embedded-studio": minor
+---
+
+Support Next 15 and React 19
diff --git a/apps/next/app/(website)/layout.tsx b/apps/next/app/(website)/layout.tsx
@@ -1,23 +1,28 @@
 import { Metadata } from 'next'
-import { draftMode } from 'next/headers'
 import { VisualEditing } from 'next-sanity'
 import { revalidatePath, revalidateTag } from 'next/cache'
+import { draftMode } from 'next/headers'
 
 import config from '@/config'
 
 export const metadata: Metadata = {
   title: `${config.siteName} - Website`,
 }
 
-export default function Layout({ children }: { children: React.ReactNode }) {
+export default async function Layout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  const isDraftModeEnabled = (await draftMode()).isEnabled
   return (
     <>
       {children}
-      {draftMode().isEnabled && (
+      {isDraftModeEnabled && (
         <VisualEditing
           refresh={async (payload) => {
             'use server'
-            if (!draftMode().isEnabled) {
+            if (!isDraftModeEnabled) {
               console.debug(
                 'Skipped manual refresh because draft mode is not enabled',
               )

diff --git a/apps/next/app/api/disable-draft/route.ts b/apps/next/app/api/disable-draft/route.ts
@@ -1,8 +1,8 @@
 import { draftMode } from 'next/headers'
 import { NextRequest, NextResponse } from 'next/server'
 
-export function GET(request: NextRequest) {
-  draftMode().disable()
+export async function GET(request: NextRequest) {
+  ;(await draftMode()).disable()
   const url = new URL(request.nextUrl)
   return NextResponse.redirect(new URL('/', url.origin))
 }
diff --git a/apps/next/app/api/draft/route.ts b/apps/next/app/api/draft/route.ts
@@ -16,7 +16,7 @@ export async function GET(request: Request) {
     return new Response('Invalid secret', { status: 401 })
   }
 
-  draftMode().enable()
+  ;(await draftMode()).enable()
 
   redirect(redirectTo)
 }
diff --git a/apps/next/data/sanity/loadQuery.ts b/apps/next/data/sanity/loadQuery.ts
@@ -1,11 +1,11 @@
-import type { QueryParams } from 'next-sanity'
 import type { UnfilteredResponseQueryOptions } from '@sanity/client'
+import type { QueryParams } from 'next-sanity'
 
 import { draftMode } from 'next/headers'
 import 'server-only'
 
-import { client } from '@/data/sanity/client'
 import config from '@/config'
+import { client } from '@/data/sanity/client'
 
 const DEFAULT_PARAMS = {} as QueryParams
 
@@ -16,7 +16,7 @@ export async function loadQuery<QueryResponse>({
   query: string
   params?: QueryParams
 }): Promise<QueryResponse> {
-  const isDraftMode = draftMode().isEnabled
+  const isDraftMode = (await draftMode()).isEnabled
   const token = config.sanity.token
 
   if (isDraftMode && !token) {

diff --git a/apps/next/package.json b/apps/next/package.json
@@ -3,7 +3,7 @@
   "private": true,
   "scripts": {
     "build": "next build",
-    "dev": "next -p 9999",
+    "dev": "next -p 9999 --turbo",
     "format": "npx prettier --write . --ignore-path .gitignore",
     "lint": "next lint -- --ignore-path .gitignore",
     "lint:fix": "npm run format && npm run lint -- --fix",
@@ -26,14 +26,14 @@
     "lucide-react": "^0.453.0",
     "next": "15.0.0",
     "next-sanity": "^9.7.0",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "sanity": "^3.61.0",
+    "react": "19.0.0-rc-65a56d0e-20241020",
+    "react-dom": "19.0.0-rc-65a56d0e-20241020",
+    "sanity": "^3.62.0",
     "server-only": "0.0.1"
   },
   "devDependencies": {
-    "@types/react": "npm:types-react@19.0.0-rc.1",
-    "@types/react-dom": "npm:types-react-dom@19.0.0",
+    "@types/react": "^18.3.11",
+    "@types/react-dom": "^18.3.1",
     "autoprefixer": "10.4.20",
     "eslint": "^8.57.0",
     "eslint-config-next": "15.0.0",
@@ -47,5 +47,5 @@
     "tailwindcss": "3.4.14",
     "typescript": "^5.6.3"
   },
-  "version": null
+  "version": "1.0.0"
 }
diff --git a/apps/studio/package.json b/apps/studio/package.json
@@ -20,12 +20,13 @@
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-is": "^18.3.1",
-    "sanity": "^3.61.0",
+    "sanity": "^3.62.0",
     "styled-components": "^6.1.13"
   },
   "devDependencies": {
     "@sanity/eslint-config-studio": "^4.0.0",
     "@types/react": "^18.3.11",
+    "@types/react-dom": "^18.3.1",
     "eslint": "^8.57.0",
     "prettier": "^3.3.3",
     "typescript": "^5.6.3"

diff --git a/examples/hello-world/app/(website)/layout.tsx b/examples/hello-world/app/(website)/layout.tsx
@@ -1,23 +1,28 @@
 import { Metadata } from 'next'
-import { draftMode } from 'next/headers'
 import { VisualEditing } from 'next-sanity'
 import { revalidatePath, revalidateTag } from 'next/cache'
+import { draftMode } from 'next/headers'
 
 import config from '@/config'
 
 export const metadata: Metadata = {
   title: `${config.siteName} - Website`,
 }
 
-export default function Layout({ children }: { children: React.ReactNode }) {
+export default async function Layout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  const isDraftModeEnabled = (await draftMode()).isEnabled
   return (
     <>
       {children}
-      {draftMode().isEnabled && (
+      {isDraftModeEnabled && (
         <VisualEditing
           refresh={async (payload) => {
             'use server'
-            if (!draftMode().isEnabled) {
+            if (!isDraftModeEnabled) {
               console.debug(
                 'Skipped manual refresh because draft mode is not enabled',
               )

diff --git a/examples/hello-world/app/api/disable-draft/route.ts b/examples/hello-world/app/api/disable-draft/route.ts
@@ -1,8 +1,8 @@
 import { draftMode } from 'next/headers'
 import { NextRequest, NextResponse } from 'next/server'
 
-export function GET(request: NextRequest) {
-  draftMode().disable()
+export async function GET(request: NextRequest) {
+  ;(await draftMode()).disable()
   const url = new URL(request.nextUrl)
   return NextResponse.redirect(new URL('/', url.origin))
 }
diff --git a/examples/hello-world/app/api/draft/route.ts b/examples/hello-world/app/api/draft/route.ts
@@ -16,7 +16,7 @@ export async function GET(request: Request) {
     return new Response('Invalid secret', { status: 401 })
   }
 
-  draftMode().enable()
+  ;(await draftMode()).enable()
 
   redirect(redirectTo)
 }
diff --git a/examples/hello-world/data/sanity/loadQuery.ts b/examples/hello-world/data/sanity/loadQuery.ts
@@ -1,11 +1,11 @@
-import type { QueryParams } from 'next-sanity'
 import type { UnfilteredResponseQueryOptions } from '@sanity/client'
+import type { QueryParams } from 'next-sanity'
 
 import { draftMode } from 'next/headers'
 import 'server-only'
 
-import { client } from '@/data/sanity/client'
 import config from '@/config'
+import { client } from '@/data/sanity/client'
 
 const DEFAULT_PARAMS = {} as QueryParams
 
@@ -16,7 +16,7 @@ export async function loadQuery<QueryResponse>({
   query: string
   params?: QueryParams
 }): Promise<QueryResponse> {
-  const isDraftMode = draftMode().isEnabled
+  const isDraftMode = (await draftMode()).isEnabled
   const token = config.sanity.token
 
   if (isDraftMode && !token) {

diff --git a/examples/hello-world/package.json b/examples/hello-world/package.json
@@ -3,7 +3,7 @@
   "private": true,
   "scripts": {
     "build": "next build",
-    "dev": "next",
+    "dev": "next --turbo",
     "format": "npx prettier --write . --ignore-path .gitignore",
     "lint": "next lint -- --ignore-path .gitignore",
     "lint:fix": "npm run format && npm run lint -- --fix",
@@ -26,12 +26,12 @@
     "next-sanity": "^9.7.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "sanity": "^3.61.0",
+    "sanity": "^3.62.0",
     "server-only": "0.0.1"
   },
   "devDependencies": {
-    "@types/react": "npm:types-react@19.0.0-rc.1",
-    "@types/react-dom": "npm:types-react-dom@19.0.0",
+    "@types/react": "^18.3.11",
+    "@types/react-dom": "^18.3.1",
     "autoprefixer": "10.4.20",
     "eslint": "^8.57.0",
     "eslint-config-next": "15.0.0",

diff --git a/examples/hello-world/sanity.config.ts b/examples/hello-world/sanity.config.ts
@@ -2,6 +2,7 @@ import schemas from '@/sanity/schemas'
 import { visionTool } from '@sanity/vision'
 import { pages } from '@tinloof/sanity-studio'
 import { defineConfig } from 'sanity'
+
 import { structureTool } from 'sanity/structure'
 import StudioLogo from './components/StudioLogo'
 import config from './config'

diff --git a/examples/with-i18n/app/api/disable-draft/route.ts b/examples/with-i18n/app/api/disable-draft/route.ts
@@ -1,8 +1,8 @@
 import { draftMode } from 'next/headers'
 import { NextRequest, NextResponse } from 'next/server'
 
-export function GET(request: NextRequest) {
-  draftMode().disable()
+export async function GET(request: NextRequest) {
+  ;(await draftMode()).disable()
   const url = new URL(request.nextUrl)
   return NextResponse.redirect(new URL('/', url.origin))
 }
diff --git a/examples/with-i18n/app/api/draft/route.ts b/examples/with-i18n/app/api/draft/route.ts
@@ -16,7 +16,7 @@ export async function GET(request: Request) {
     return new Response('Invalid secret', { status: 401 })
   }
 
-  draftMode().enable()
+  ;(await draftMode()).enable()
 
   redirect(redirectTo)
 }
diff --git a/examples/with-i18n/data/sanity/loadQuery.ts b/examples/with-i18n/data/sanity/loadQuery.ts
@@ -1,11 +1,11 @@
-import type { QueryParams } from 'next-sanity'
 import type { UnfilteredResponseQueryOptions } from '@sanity/client'
+import type { QueryParams } from 'next-sanity'
 
 import { draftMode } from 'next/headers'
 import 'server-only'
 
-import { client } from '@/data/sanity/client'
 import config from '@/config'
+import { client } from '@/data/sanity/client'
 
 const DEFAULT_PARAMS = {} as QueryParams
 
@@ -16,7 +16,7 @@ export async function loadQuery<QueryResponse>({
   query: string
   params?: QueryParams
 }): Promise<QueryResponse> {
-  const isDraftMode = draftMode().isEnabled
+  const isDraftMode = (await draftMode()).isEnabled
   const token = config.sanity.token
 
   if (isDraftMode && !token) {

diff --git a/examples/with-i18n/package.json b/examples/with-i18n/package.json
@@ -3,7 +3,7 @@
   "private": true,
   "scripts": {
     "build": "next build",
-    "dev": "next",
+    "dev": "next --turbo",
     "format": "npx prettier --write . --ignore-path .gitignore",
     "lint": "next lint -- --ignore-path .gitignore",
     "lint:fix": "npm run format && npm run lint -- --fix",
@@ -26,12 +26,12 @@
     "next-sanity": "^9.7.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "sanity": "^3.61.0",
+    "sanity": "^3.62.0",
     "server-only": "0.0.1"
   },
   "devDependencies": {
-    "@types/react": "npm:types-react@19.0.0-rc.1",
-    "@types/react-dom": "npm:types-react-dom@19.0.0",
+    "@types/react": "^18.3.11",
+    "@types/react-dom": "^18.3.1",
     "autoprefixer": "10.4.20",
     "eslint": "^8.57.0",
     "eslint-config-next": "15.0.0",

diff --git a/examples/with-sections/app/(website)/layout.tsx b/examples/with-sections/app/(website)/layout.tsx
@@ -1,23 +1,28 @@
 import { Metadata } from 'next'
-import { draftMode } from 'next/headers'
 import { VisualEditing } from 'next-sanity'
 import { revalidatePath, revalidateTag } from 'next/cache'
+import { draftMode } from 'next/headers'
 
 import config from '@/config'
 
 export const metadata: Metadata = {
   title: `${config.siteName} - Website`,
 }
 
-export default function Layout({ children }: { children: React.ReactNode }) {
+export default async function Layout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  const isDraftModeEnabled = (await draftMode()).isEnabled
   return (
     <>
       {children}
-      {draftMode().isEnabled && (
+      {isDraftModeEnabled && (
         <VisualEditing
           refresh={async (payload) => {
             'use server'
-            if (!draftMode().isEnabled) {
+            if (!isDraftModeEnabled) {
               console.debug(
                 'Skipped manual refresh because draft mode is not enabled',
               )

diff --git a/examples/with-sections/app/api/disable-draft/route.ts b/examples/with-sections/app/api/disable-draft/route.ts
@@ -1,8 +1,8 @@
 import { draftMode } from 'next/headers'
 import { NextRequest, NextResponse } from 'next/server'
 
-export function GET(request: NextRequest) {
-  draftMode().disable()
+export async function GET(request: NextRequest) {
+  ;(await draftMode()).disable()
   const url = new URL(request.nextUrl)
   return NextResponse.redirect(new URL('/', url.origin))
 }
diff --git a/examples/with-sections/app/api/draft/route.ts b/examples/with-sections/app/api/draft/route.ts
@@ -16,7 +16,7 @@ export async function GET(request: Request) {
     return new Response('Invalid secret', { status: 401 })
   }
 
-  draftMode().enable()
+  ;(await draftMode()).enable()
 
   redirect(redirectTo)
 }
diff --git a/examples/with-sections/data/sanity/loadQuery.ts b/examples/with-sections/data/sanity/loadQuery.ts
@@ -1,11 +1,11 @@
-import type { QueryParams } from 'next-sanity'
 import type { UnfilteredResponseQueryOptions } from '@sanity/client'
+import type { QueryParams } from 'next-sanity'
 
 import { draftMode } from 'next/headers'
 import 'server-only'
 
-import { client } from '@/data/sanity/client'
 import config from '@/config'
+import { client } from '@/data/sanity/client'
 
 const DEFAULT_PARAMS = {} as QueryParams
 
@@ -16,7 +16,7 @@ export async function loadQuery<QueryResponse>({
   query: string
   params?: QueryParams
 }): Promise<QueryResponse> {
-  const isDraftMode = draftMode().isEnabled
+  const isDraftMode = (await draftMode()).isEnabled
   const token = config.sanity.token
 
   if (isDraftMode && !token) {