import { fetchPage } from "@/lib/fetchers";
import { RenderBlock } from "@/components/registry";
import { notFound } from "next/navigation";

export const revalidate = 60; // ISR: 60秒后重新验证

export default async function Page({ params }: { params: Promise<{ slug: string }> }) {
    const { slug } = await params;
    const page = await fetchPage(slug);

    if (!page) {
        return notFound();
    }

    return (
        <main className="min-h-screen bg-gray-50 dark:bg-gray-900">
            <div className="max-w-6xl mx-auto px-4 py-8">
                {/* 页面标题 */}
                <header className="mb-8">
                    <h1 className="text-3xl md:text-4xl font-bold text-gray-900 dark:text-white">
                        {page.title}
                    </h1>
                    {page.description && (
                        <p className="mt-2 text-lg text-gray-600 dark:text-gray-400">
                            {page.description}
                        </p>
                    )}
                </header>

                {/* 渲染所有块 */}
                <div className="space-y-8">
                    {page.blocks.map((block) => (
                        <RenderBlock key={(block as any).id} block={block} />
                    ))}
                </div>
            </div>
        </main>
    );
}