import type { Metadata } from 'next'
import Link from 'next/link'
import { notFound } from 'next/navigation'
import { getAllPosts, getPost } from '@/lib/blog'

// Pre-render every post at build time; unknown slugs 404.
export const dynamicParams = false

export function generateStaticParams() {
  return getAllPosts().map((p) => ({ slug: p.slug }))
}

export async function generateMetadata({
  params,
}: {
  params: Promise<{ slug: string }>
}): Promise<Metadata> {
  const post = getPost((await params).slug)
  if (!post) return {}
  return {
    title: post.title,
    description: post.excerpt,
    openGraph: { title: post.title, description: post.excerpt, type: 'article' },
  }
}

export default async function BlogPostPage({ params }: { params: Promise<{ slug: string }> }) {
  const post = getPost((await params).slug)
  if (!post) notFound()

  return (
    <article className="mx-auto max-w-3xl px-4 py-14">
      <Link href="/blog" className="text-sm text-neutral-500 hover:text-neutral-900">
        ← All posts
      </Link>
      <h1 className="mt-4 text-3xl leading-tight font-bold">{post.title}</h1>
      <p className="mt-2 text-sm text-neutral-400">
        {post.date}
        {post.author ? ` · ${post.author}` : ''}
      </p>
      <div
        className="prose-hha mt-8"
        // Post markdown is authored in this repository (content/blog), not user input.
        dangerouslySetInnerHTML={{ __html: post.html }}
      />
    </article>
  )
}