From 7943ffbd550da5a0f3f5cf8e59f4f8dec06a90b7 Mon Sep 17 00:00:00 2001 From: tobias Date: Mon, 24 Jun 2024 13:39:37 +0200 Subject: [PATCH] Create post preview component --- payload.config.ts | 3 +-- src/components/PreviewPostPage.tsx | 36 ++++++++++++++++++++++++++++++ 2 files changed, 37 insertions(+), 2 deletions(-) create mode 100644 src/components/PreviewPostPage.tsx diff --git a/payload.config.ts b/payload.config.ts index 18867ef..dc708e0 100644 --- a/payload.config.ts +++ b/payload.config.ts @@ -43,9 +43,8 @@ export default buildConfig({ }, livePreview: { url: ({ data, locale }) => - //TODO: Rewrite to collection_slug/preview/ `${process.env.BASE_URL}/preview${data.path}${locale ? `?locale=${locale.code}` : ''}`, - collections: [COLLECTION_SLUG_PAGE], + collections: [COLLECTION_SLUG_PAGE, COLLECTION_SLUG_POST], }, }, editor: lexicalEditor(), diff --git a/src/components/PreviewPostPage.tsx b/src/components/PreviewPostPage.tsx new file mode 100644 index 0000000..5639c16 --- /dev/null +++ b/src/components/PreviewPostPage.tsx @@ -0,0 +1,36 @@ +'use client' + +import type { Post } from 'types/payload-types' +import { useLivePreview } from '@payloadcms/live-preview-react' +import PostPage from './PostPage' + +const defaultPost: Post = { + id: 'default-id', + title: 'Title', + thumbnail: '', + updatedAt: '', + createdAt: '', +} + +export default function PreviewBlocks({ + initialData, + locale, + url, +}: { + initialData?: Post | null + locale: string + url: string +}) { + const { data } = useLivePreview({ + serverURL: url, + depth: 3, + initialData: initialData, + }) + + const post = { + ...defaultPost, + ...data, + } + + return +}