import type { Metadata } from "next";
import { ProjectProvider } from "@/app/context/ProjectContext";
import { getBlogDetails, BLOG_POSTS } from "@/data/content";

export async function generateMetadata({ params }: { params: Promise<{ slug: string }> }): Promise<Metadata> {
  const { slug } = await params;
  const post = BLOG_POSTS.find((p) => p.slug === slug);
  if (!post) return { title: "Post not found" };
  return { title: `${post.title} | Blog`, description: post.description };
}

/**
 * Layout for all paths caught under blog/[slug].
 * Mirrors app/project/[slug]/layout.tsx: the rendered markdown is resolved
 * here on the server and handed to the client page via the shared context.
 * (ProjectContext is a generic `any` context despite its name; its value
 * contract is `string | null` = rendered HTML.)
 */
export default async function BlogSlugLayout({ children, params }: {
  children: React.ReactNode;
  params: Promise<{ slug: string }>;
}) {

  const { slug } = await params;
  const postData = await getBlogDetails(slug);
  return (
    <ProjectProvider value={postData}>
      <main>
        {children}
      </main>
    </ProjectProvider>
  );
}