import { listSeries } from "@autoscholar/core";
import type { Metadata } from "next";
import Link from "next/link";
import { EmptyState } from "@/components/EmptyState";
import { db } from "@/lib/server/db";

export const dynamic = "force-dynamic";
export const metadata: Metadata = { title: "Working-paper series", alternates: { canonical: "/series" } };

export default async function SeriesPage() {
  const rows = await listSeries(db());
  return (
    <div className="container-x section-tight space-y-8">
      <header className="max-w-2xl">
        <p className="eyebrow">Collections</p>
        <h1 className="title-1 mt-2">Working-paper series</h1>
        <p className="muted mt-2 max-w-2xl text-sm">
          Papers are numbered in a stable series (AS-WP-YEAR-NNNN). Numbers are allocated inside the
          publication transaction and never reused, even after a retraction.
        </p>
      </header>
      {rows.length === 0 ? (
        <EmptyState title="No series configured." />
      ) : (
        <ul className="grid gap-3 md:grid-cols-2">
          {rows.map((s) => (
            <li key={s.id} className="surface card-link relative p-6">
              <Link
                href={`/research?series=${s.slug}`}
                className="title-2 no-underline after:absolute after:inset-0 hover:underline"
              >
                {s.name}
              </Link>
              <p className="mono-id mt-2">
                {s.paperCount} {s.paperCount === 1 ? "paper" : "papers"}
              </p>
              {s.description && <p className="muted mt-2 text-sm">{s.description}</p>}
            </li>
          ))}
        </ul>
      )}
    </div>
  );
}