Real time preview and cache update fix (#41)

someengineering · Aug 15, 2024 · cb148f7 · cb148f7
1 parent e9c4c65
commit cb148f7
Show file tree

Hide file tree

Showing 5 changed files with 7 additions and 29 deletions.
diff --git a/src/app/[...slug]/page.tsx b/src/app/[...slug]/page.tsx
@@ -9,8 +9,10 @@ async function fetchData(
   slug: string,
   version: 'published' | 'draft' | undefined,
 ) {
+  const cacheVersion = Math.floor(Date.now() / 1000);
   const sbParams: ISbStoriesParams = {
     version: version,
+    cv: cacheVersion, // Force bypass cache
   };
   const storyblokApi = getStoryblokApi();
 

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -1,4 +1,5 @@
 import { apiPlugin, storyblokInit } from '@storyblok/react';
+import { StoryblokBridgeLoader } from '@storyblok/react/rsc';
 import { Viewport } from 'next';
 import { headers } from 'next/headers';
 import Script from 'next/script';
@@ -86,6 +87,7 @@ export default function RootLayout({
             <PosthogPageView />
           </Suspense>
         </PosthogProvider>
+        <StoryblokBridgeLoader options={{}} />
       </body>
     </html>
   );

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -9,8 +9,10 @@ async function fetchData(
   slug: string,
   version: 'published' | 'draft' | undefined,
 ) {
+  const cacheVersion = Math.floor(Date.now() / 1000);
   const sbParams: ISbStoriesParams = {
     version: version,
+    cv: cacheVersion, // Force bypass cache
   };
   const storyblokApi = getStoryblokApi();
 

diff --git a/src/components/PageComponent.js b/src/components/PageComponent.js
diff --git a/src/lib/storyblok.ts b/src/lib/storyblok.ts
@@ -1,21 +1,9 @@
-import { getStoryblokApi, ISbResult } from '@storyblok/react';
+import { ISbResult } from '@storyblok/react';
 
 import { siteConfig } from '@/constants/config';
 import { isProd } from '@/constants/env';
 import { openGraph } from '@/utils/og';
 
-export const fetchStory = async (slug: string) => {
-  const storyblokApi = getStoryblokApi();
-  try {
-    const { data } = await storyblokApi.get(`cdn/stories/${slug}`, {
-      version: isProd ? 'published' : 'draft',
-    });
-    return data?.story || null;
-  } catch (error) {
-    return null;
-  }
-};
-
 export function generateMetadataFromStory(
   story: ISbResult,
   isHomePage: boolean,