fix: stop inlining rxjs and @sanity/comlink (#2012)

sanity-io · Oct 21, 2024 · 8df6708 · 8df6708
1 parent fcade5a
commit 8df6708
Show file tree

Hide file tree

Showing 25 changed files with 126 additions and 266 deletions.
diff --git a/apps/next-with-i18n/app/(website)/[locale]/[...path]/page.tsx b/apps/next-with-i18n/app/(website)/[locale]/[...path]/page.tsx
@@ -2,10 +2,11 @@ import { Page } from '@/components/Page'
 import { loadPage } from '@/data/sanity'
 
 export default async function DynamicRoute({
-  params: { path, locale },
+  params,
 }: {
-  params: { path: string[]; locale: string }
+  params: Promise<{ path: string[]; locale: string }>
 }) {
+  const { path, locale } = await params
   const pathname = `/${path.join('/')}`
   const data = await loadPage(pathname, locale)
 

diff --git a/apps/next-with-i18n/app/(website)/[locale]/layout.tsx b/apps/next-with-i18n/app/(website)/[locale]/layout.tsx
@@ -18,21 +18,22 @@ const sans = Inter({
 })
 
 export default async function RootLayout({
-  params: { locale },
+  params,
   children,
 }: {
-  params: { locale: string }
+  params: Promise<{ locale: string }>
   children: React.ReactNode
 }) {
+  const { locale } = await params
   return (
     <html lang={locale} className={sans.variable}>
       <body>
         {children}
-        {draftMode().isEnabled && (
+        {(await draftMode()).isEnabled && (
           <VisualEditing
             refresh={async (payload) => {
               'use server'
-              if (!draftMode().isEnabled) {
+              if (!(await draftMode()).isEnabled) {
                 console.debug(
                   'Skipped manual refresh because draft mode is not enabled',
                 )

diff --git a/apps/next-with-i18n/app/(website)/[locale]/page.tsx b/apps/next-with-i18n/app/(website)/[locale]/page.tsx
@@ -2,10 +2,11 @@ import { Page } from '@/components/Page'
 import { loadPage } from '@/data/sanity'
 
 export default async function IndexRoute({
-  params: { locale },
+  params,
 }: {
-  params: { locale: string }
+  params: Promise<{ locale: string }>
 }) {
+  const { locale } = await params
   const data = await loadPage('/', locale)
 
   return <Page data={data} />

diff --git a/apps/next-with-i18n/app/api/disable-draft/route.ts b/apps/next-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/apps/next-with-i18n/app/api/draft/route.ts b/apps/next-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/apps/next-with-i18n/data/sanity/loadQuery.ts b/apps/next-with-i18n/data/sanity/loadQuery.ts
@@ -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/src/app/api/draft-mode/disable/route.ts b/apps/next/src/app/api/draft-mode/disable/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('/pages-router/shoes', url.origin))
 }
diff --git a/apps/next/src/app/compat/layout.tsx b/apps/next/src/app/compat/layout.tsx
@@ -14,10 +14,10 @@ export default async function RootLayout({children}: {children: React.ReactNode}
     <html lang="en">
       <body>
         {children}
-        {draftMode().isEnabled && <VisualEditing />}
+        {(await draftMode()).isEnabled && <VisualEditing />}
         <a className="fixed bottom-1 left-1 block rounded bg-slate-900 px-2 py-1 text-xs text-slate-100">
           app-router:{' '}
-          {draftMode().isEnabled
+          {(await draftMode()).isEnabled
             ? 'draftMode'
             : process.env.NEXT_PUBLIC_VERCEL_ENV || 'development'}
           {', '}

diff --git a/apps/next/src/app/compat/page.tsx b/apps/next/src/app/compat/page.tsx
@@ -16,8 +16,8 @@ export default async function ShoesPage() {
     {},
     {
       filterResponse: false,
-      perspective: draftMode().isEnabled ? 'previewDrafts' : 'published',
-      useCdn: draftMode().isEnabled ? false : true,
+      perspective: (await draftMode()).isEnabled ? 'previewDrafts' : 'published',
+      useCdn: (await draftMode()).isEnabled ? false : true,
       cache: 'no-store',
     },
   )

diff --git a/apps/next/src/app/only-visual-editing/layout.tsx b/apps/next/src/app/only-visual-editing/layout.tsx
@@ -16,11 +16,11 @@ export default async function RootLayout({children}: {children: React.ReactNode}
       <body>
         {children}
         <VercelToolbar />
-        {draftMode().isEnabled && (
+        {(await draftMode()).isEnabled && (
           <VisualEditing
             refresh={async (payload) => {
               'use server'
-              if (!draftMode().isEnabled) {
+              if (!(await draftMode()).isEnabled) {
                 console.error('Draft Mode is not enabled, ignoring refresh')
                 return
               }
@@ -42,7 +42,7 @@ export default async function RootLayout({children}: {children: React.ReactNode}
         )}
         <a className="fixed bottom-1 left-1 block rounded bg-slate-900 px-2 py-1 text-xs text-slate-100">
           app-router:{' '}
-          {draftMode().isEnabled
+          {(await draftMode()).isEnabled
             ? 'draftMode'
             : process.env.NEXT_PUBLIC_VERCEL_ENV || 'development'}
           {', '}

diff --git a/apps/next/src/app/only-visual-editing/page.tsx b/apps/next/src/app/only-visual-editing/page.tsx
@@ -16,8 +16,8 @@ export default async function ShoesPage() {
     {},
     {
       filterResponse: false,
-      perspective: draftMode().isEnabled ? 'previewDrafts' : 'published',
-      useCdn: draftMode().isEnabled ? false : true,
+      perspective: (await draftMode()).isEnabled ? 'previewDrafts' : 'published',
+      useCdn: (await draftMode()).isEnabled ? false : true,
       next: {revalidate: false, tags: ['shoe']},
     },
   )

diff --git a/apps/next/src/app/shoes/[slug]/page.tsx b/apps/next/src/app/shoes/[slug]/page.tsx
@@ -5,15 +5,15 @@ import {loadQuery} from '../sanity.ssr'
 import ShoePageClient from './page.client'
 
 type Props = {
-  params: {slug: string}
+  params: Promise<{slug: string}>
 }
 
 export default async function ShoePage(props: Props) {
-  const {params} = props
+  const params = await props.params
   const initial = loadQuery<ShoeResult>(shoe, params, {
-    perspective: draftMode().isEnabled ? 'previewDrafts' : 'published',
+    perspective: (await draftMode()).isEnabled ? 'previewDrafts' : 'published',
     next: {
-      revalidate: draftMode().isEnabled ? 0 : false,
+      revalidate: (await draftMode()).isEnabled ? 0 : false,
       tags: [`shoe:${params.slug}`],
     },
   })

diff --git a/apps/next/src/app/shoes/layout.tsx b/apps/next/src/app/shoes/layout.tsx
@@ -11,10 +11,10 @@ export default async function RootLayout({children}: {children: React.ReactNode}
     <html lang="en">
       <body>
         {children}
-        {draftMode().isEnabled && <LiveVisualEditing />}
+        {(await draftMode()).isEnabled && <LiveVisualEditing />}
         <a className="fixed bottom-1 left-1 block rounded bg-slate-900 px-2 py-1 text-xs text-slate-100">
           app-router:{' '}
-          {draftMode().isEnabled
+          {(await draftMode()).isEnabled
             ? 'draftMode'
             : process.env.NEXT_PUBLIC_VERCEL_ENV || 'development'}
           {', '}

diff --git a/apps/next/src/app/shoes/page.tsx b/apps/next/src/app/shoes/page.tsx
@@ -9,8 +9,8 @@ export default async function ShoesPage() {
     shoesList,
     {},
     {
-      perspective: draftMode().isEnabled ? 'previewDrafts' : 'published',
-      next: {revalidate: draftMode().isEnabled ? 0 : false, tags: ['shoe']},
+      perspective: (await draftMode()).isEnabled ? 'previewDrafts' : 'published',
+      next: {revalidate: (await draftMode()).isEnabled ? 0 : false, tags: ['shoe']},
     },
   )
   return <ShoesPageClient initial={initial} />

diff --git a/apps/next/src/app/shoes/sanity.ssr.ts b/apps/next/src/app/shoes/sanity.ssr.ts
@@ -15,9 +15,10 @@ setServerClient(
 )
 
 // Automatically handle draft mode
-export const loadQuery = ((query, params = {}, options = {}) => {
-  const isDraftMode = draftMode().isEnabled
-  const perspective = options.perspective || draftMode().isEnabled ? 'previewDrafts' : 'published'
+export const loadQuery = (async (query, params = {}, options = {}) => {
+  const isDraftMode = (await draftMode()).isEnabled
+  const perspective =
+    options.perspective || (await draftMode()).isEnabled ? 'previewDrafts' : 'published'
   return _loadQuery(query, params, {
     ...options,
     perspective,

diff --git a/apps/page-builder-demo/src/app/layout.tsx b/apps/page-builder-demo/src/app/layout.tsx
@@ -50,9 +50,9 @@ export default async function RootLayout({children}: {children: React.ReactNode}
   return (
     <html lang="en" className={`${mono.variable} ${sans.variable} ${serif.variable}`}>
       <body className="bg-white text-black dark:bg-black dark:text-white">
-        {draftMode().isEnabled && <AlertBanner />}
+        {(await draftMode()).isEnabled && <AlertBanner />}
         <AppLayout data={data}>{children}</AppLayout>
-        {draftMode().isEnabled && <VisualEditing />}
+        {(await draftMode()).isEnabled && <VisualEditing />}
         <SanityLive />
       </body>
     </html>

diff --git a/apps/page-builder-demo/src/app/pages/[slug]/page.tsx b/apps/page-builder-demo/src/app/pages/[slug]/page.tsx
@@ -47,8 +47,8 @@ export async function generateStaticParams() {
   return data
 }
 
-export default async function PagesPage({params}: {params: {slug: string}}) {
-  const {data} = await sanityFetch({query: pageQuery, params})
+export default async function PagesPage({params}: {params: Promise<{slug: string}>}) {
+  const {data} = await sanityFetch({query: pageQuery, params: await params})
   if (!data) {
     notFound()
   }

diff --git a/apps/page-builder-demo/src/app/product/[slug]/page.tsx b/apps/page-builder-demo/src/app/product/[slug]/page.tsx
@@ -34,9 +34,12 @@ export async function generateStaticParams() {
 
 const productPageQuery = defineQuery(`*[_type == "product" && slug.current == $slug][0]`)
 
-export default async function ProductPage({params}: {params: {slug: string}}) {
+export default async function ProductPage({params}: {params: Promise<{slug: string}>}) {
   // @TODO fix typegen vs manual types issues
-  const {data} = (await sanityFetch({query: productPageQuery, params})) as unknown as {
+  const {data} = (await sanityFetch({
+    query: productPageQuery,
+    params: await params,
+  })) as unknown as {
     data: ProductData | null
   }
 

diff --git a/apps/page-builder-demo/src/app/project/[slug]/page.tsx b/apps/page-builder-demo/src/app/project/[slug]/page.tsx
@@ -25,9 +25,12 @@ export async function generateStaticParams() {
 
 const projectPageQuery = defineQuery(`*[_type == "project" && slug.current == $slug][0]`)
 
-export default async function ProjectPage({params}: {params: {slug: string}}) {
+export default async function ProjectPage({params}: {params: Promise<{slug: string}>}) {
   // @TODO fix typegen vs manual types issues
-  const {data} = (await sanityFetch({query: projectPageQuery, params})) as unknown as {
+  const {data} = (await sanityFetch({
+    query: projectPageQuery,
+    params: await params,
+  })) as unknown as {
     data: ProjectData | null
   }
 

diff --git a/packages/core-loader/package.json b/packages/core-loader/package.json
@@ -67,13 +67,15 @@
     ],
     "root": true
   },
+  "dependencies": {
+    "@sanity/comlink": "workspace:*"
+  },
   "devDependencies": {
     "@repo/eslint-config": "workspace:*",
     "@repo/package.config": "workspace:*",
     "@repo/prettier-config": "workspace:*",
     "@repo/visual-editing-helpers": "workspace:*",
     "@sanity/client": "^6.22.2",
-    "@sanity/comlink": "workspace:*",
     "@sanity/pkg-utils": "6.11.4",
     "@typescript-eslint/eslint-plugin": "^7.18.0",
     "@typescript-eslint/parser": "^7.18.0",

diff --git a/packages/preview-kit-compat/package.json b/packages/preview-kit-compat/package.json
@@ -46,13 +46,15 @@
     ],
     "root": true
   },
+  "dependencies": {
+    "@sanity/comlink": "workspace:*"
+  },
   "devDependencies": {
     "@repo/eslint-config": "workspace:*",
     "@repo/package.config": "workspace:*",
     "@repo/prettier-config": "workspace:*",
     "@repo/visual-editing-helpers": "workspace:*",
     "@sanity/client": "^6.22.2",
-    "@sanity/comlink": "workspace:*",
     "@sanity/pkg-utils": "6.11.4",
     "@types/react": "^18.3.11",
     "eslint": "^8.57.1",

diff --git a/packages/visual-editing-helpers/package.json b/packages/visual-editing-helpers/package.json
@@ -77,6 +77,7 @@
   },
   "peerDependencies": {
     "@sanity/client": "^6.22.2",
+    "@sanity/comlink": "workspace:*",
     "react": "^18.2.0",
     "valibot": "0.31.1"
   },

diff --git a/packages/visual-editing/package.config.ts b/packages/visual-editing/package.config.ts
@@ -9,6 +9,7 @@ export default defineConfig({
     'process.env.NODE_ENV': 'production',
   },
   rollup: {
+    ...baseConfig.rollup,
     treeshake: {
       preset: 'smallest',
       manualPureFunctions: ['createElement', 'forwardRef', 'memo', 'styled'],

diff --git a/packages/visual-editing/package.json b/packages/visual-editing/package.json
@@ -109,9 +109,11 @@
     "root": true
   },
   "dependencies": {
+    "@sanity/comlink": "workspace:*",
     "@sanity/mutate": "0.10.1-canary.4",
     "@sanity/preview-url-secret": "workspace:*",
     "@vercel/stega": "0.1.2",
+    "rxjs": "^7.8.1",
     "scroll-into-view-if-needed": "^3.1.0",
     "use-effect-event": "^1.0.2",
     "valibot": "0.31.1",
@@ -124,7 +126,6 @@
     "@repo/visual-editing-helpers": "workspace:*",
     "@sanity/client": "^6.22.2",
     "@sanity/color": "^3.0.6",
-    "@sanity/comlink": "workspace:*",
     "@sanity/demo": "^2.0.0",
     "@sanity/pkg-utils": "6.11.4",
     "@sanity/ui": "2.8.9",