Added preview functionality for pages

app/(site)/[locale]/[...slug]/page.tsx

@@ -1,13 +1,14 @@
 import CategoryPage from '@/components/pages/category-page';
 import ProductPage from '@/components/pages/product-page';
 import SinglePage from '@/components/pages/single-page';
+import SinglePagePreview from '@/components/pages/single-page-preview';
+import PreviewProvider from '@/components/preview-provider';
 import getQueryFromSlug from '@/helpers/get-query-from-slug';
 import { getCachedClient } from 'lib/sanity/sanity.client';
 import type { Metadata } from 'next';
+import { draftMode } from 'next/headers';
 import { notFound } from 'next/navigation';
 
-export const revalidate = 43200; // 12 hours in seconds
-
 export async function generateMetadata({
   params
 }: {
@@ -40,6 +41,8 @@ interface PageParams {
 }
 
 export default async function Page({ params }: PageParams) {
+  const preview = draftMode().isEnabled ? { token: process.env.SANITY_API_READ_TOKEN } : undefined;
+
   const { slug, locale } = params;
 
   const { query = '', queryParams, docType } = getQueryFromSlug(slug, locale);
@@ -58,6 +61,14 @@ export default async function Page({ params }: PageParams) {
 
   if (!pageData) return notFound();
 
+  if (preview && preview.token) {
+    return (
+      <PreviewProvider token={preview.token}>
+        {docType === 'page' && <SinglePagePreview initialData={pageData} params={queryParams} />}
+      </PreviewProvider>
+    );
+  }
+
   return (
     <>
       {docType === 'page' && <SinglePage data={pageData} />}

app/api/preview/route.ts

@@ -3,7 +3,7 @@ import { draftMode } from 'next/headers'
 export async function GET(request: Request) {
   const { searchParams } = new URL(request.url)
   const secret = searchParams.get('secret')
-  // const slug = searchParams.get('slug')
+  const slug = searchParams.get('slug')
   const type = searchParams.get('type')
   const locale = searchParams.get('locale')
 
@@ -15,7 +15,6 @@ export async function GET(request: Request) {
 
   draftMode().enable()
 
-
   if (type === 'home') {
     return new Response(null, {
         status: 307,
@@ -24,4 +23,13 @@ export async function GET(request: Request) {
         },
     })
   }
+
+  if (type === 'page') {
+    return new Response(null, {
+        status: 307,
+        headers: {
+            Location: `/${locale}${slug}`,
+        },
+    })
+  }
 }