import { notFound } from 'next/navigation';
import Link from 'next/link';
import { getPreview } from '@/lib/preview';
import config from '@payload-config';
import { getPayload } from 'payload';
import { RichText } from '@payloadcms/richtext-lexical/react';

type Props = Readonly<{
	params: Promise<{
		slug: string;
	}>;
}>;

export default async function Page({ params }: Props) {
	const { isPreview, where } = await getPreview();
	const { slug } = await params;
	const payload = await getPayload({ config });

	const result = await payload.find({
		collection: 'posts',
		where: {
			...where,
			slug: {
				equals: slug
			}
		},
		draft: isPreview,
		limit: 1
	});

	const post = result.docs[0];

	if (!post)
		return notFound();

	return (
		<div className="m-4">
			<Link
				className="border border-1 border-primary"
				href="/"
			>
				Zurück
			</Link>
			<h1 className="font-bold">{post.title}</h1>
			<RichText data={post.content} />
		</div>
	);
}