// src/app/blog/[slug]/page.tsx
import { getPostBySlug } from '@/lib/case-study';
import { notFound } from 'next/navigation';
import parse from 'html-react-parser';


interface StudyPageProps {
  params: Promise<{ slug: string }>;
}

export default async function BlogPostPage({ params }: StudyPageProps) {
  // In Next.js 15+, params is a Promise and must be awaited
  const { slug } = await params;
  const caseStudy = await getPostBySlug(slug);

  if (!caseStudy) {
    notFound(); // Triggers the closest 404 page if the file doesn't exist
  }

  return (
    <article className="max-w-2xl mx-auto py-10 px-4">
      <header className="mb-8">
        <h1 className="text-4xl font-bold mb-2">{caseStudy.title}</h1>
      </header>
      
      {/* Render the parsed HTML safely */}
      <div className="prose dark:prose-invert">
        {parse(caseStudy.contentHtml)}
      </div>
    </article>
  );
}