import type { Metadata } from "next";
import Link from "next/link";
import { PageList } from "@/components/features";
import { Card, CardHeader, PageHeader, StatCard } from "@/components/ui";
import { requireDashboard } from "@/lib/authz/guard";
import { getEditorDashboard } from "@/lib/data/editor";

export const metadata: Metadata = { title: "Editor dashboard" };
export const dynamic = "force-dynamic";

export default async function EditorDashboard() {
  const ctx = await requireDashboard("editor");
  const d = await getEditorDashboard(ctx);

  return (
    <>
      <PageHeader title="Editor dashboard" description="Your content work in progress." />

      <div className="grid grid-cols-2 gap-3 lg:grid-cols-4">
        <StatCard label="Assigned to me" value={d.assigned.length} />
        <StatCard label="My drafts" value={d.drafts} />
        <StatCard label="Pending approval" value={d.pending.length} tone={d.pending.length > 0 ? "warning" : "default"} />
        <StatCard label="Scheduled" value={d.scheduled.length} />
      </div>

      <div className="mt-6 grid gap-4 lg:grid-cols-2">
        <Card className="lg:col-span-2">
          <CardHeader title="My assigned pages" action={<Link className="text-xs text-primary hover:underline" href="/dashboard/pages">All pages</Link>} />
          <PageList pages={d.assigned} emptyTitle="No pages assigned to you" />
        </Card>
        <Card>
          <CardHeader title="Pending approvals" />
          <PageList pages={d.pending} emptyTitle="Nothing waiting for approval" />
        </Card>
        <Card>
          <CardHeader title="Scheduled publications" />
          <PageList pages={d.scheduled} emptyTitle="No scheduled publications" />
        </Card>
        <Card>
          <CardHeader title="Recently updated" />
          <PageList pages={d.recent} emptyTitle="No content yet" />
        </Card>
        <Card>
          <CardHeader title="Needs attention" description="Drafts untouched for 14+ days" />
          <PageList pages={d.stale} emptyTitle="All caught up" />
        </Card>
      </div>
    </>
  );
}