import Link from "next/link";
import type { Metadata } from "next";
import { getCaseStudyList } from "@/services/case.service";

export const metadata: Metadata = {
  title: "客户案例",
};

export default async function CaseStudyListPage() {
  const caseStudies = await getCaseStudyList().catch(() => []);

  return (
    <div className="mx-auto max-w-4xl px-6 py-24">
      <h1 className="mb-12 text-4xl font-bold text-slate-900">客户案例</h1>
      <ul className="space-y-6">
        {caseStudies.map((item) => (
          <li key={item.id} className="border-b border-slate-100 pb-6">
            <Link
              href={`/cases/${item.meta.slug}`}
              className="text-2xl font-semibold text-slate-900 hover:text-primary"
            >
              {item.title}
            </Link>
            <p className="mt-1 text-sm text-slate-500">
              {item.client_name}
              {item.industry ? ` · ${item.industry}` : ""}
            </p>
            {item.summary && (
              <p className="mt-2 text-slate-600">{item.summary}</p>
            )}
          </li>
        ))}
        {caseStudies.length === 0 && (
          <p className="text-slate-500">暂无案例，或后端服务未连接。</p>
        )}
      </ul>
    </div>
  );
}