import { notFound } from "next/navigation";
import type { Metadata } from "next";
import { getSolutionBySlug } from "@/services/solution.service";
import { getPreviewOrFallback } from "@/services/preview.service";
import { BlockRenderer } from "@/blocks/BlockRenderer";
import type { SolutionPageDetail } from "@/types/wagtail";

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

export async function generateMetadata({
  params,
}: SolutionDetailPageProps): Promise<Metadata> {
  const { slug } = await params;
  const solution = await getSolutionBySlug(slug).catch(() => null);
  return { title: solution?.title ?? "解决方案未找到" };
}

export default async function SolutionDetailPage({
  params,
}: SolutionDetailPageProps) {
  const { slug } = await params;
  const solution = await getPreviewOrFallback<SolutionPageDetail>(
    "solutions.solutionpage",
    "body,industry,summary",
    () => getSolutionBySlug(slug).catch(() => null),
  );

  if (!solution) {
    notFound();
  }

  return (
    <article className="mx-auto max-w-3xl px-6 py-24">
      <h1 className="mb-2 text-4xl font-bold text-slate-900">
        {solution.title}
      </h1>
      {solution.industry && (
        <p className="mb-12 text-sm text-slate-500">{solution.industry}</p>
      )}
      <BlockRenderer blocks={solution.body} />
    </article>
  );
}