import Link from "next/link";
import { getAdminTrash } from "@/lib/api/admin";
import { TrashTable } from "@/components/retention/trash-table";

const TRASH_TABS = [
  { value: "events", label: "Event" },
  { value: "ticket-types", label: "Ticket" },
  { value: "promos", label: "Promo" },
  { value: "vouchers", label: "Voucher" },
  { value: "event-categories", label: "Category" },
  { value: "cms-pages", label: "CMS Pages" },
  { value: "users", label: "User" },
] as const;

type TrashType = (typeof TRASH_TABS)[number]["value"];

export default async function AdminTrashPage({
  searchParams,
}: {
  searchParams: Promise<{ type?: string }>;
}) {
  const params = await searchParams;
  const type: TrashType = TRASH_TABS.some((tab) => tab.value === params.type)
    ? (params.type as TrashType)
    : "events";

  const { data: items } = await getAdminTrash(type);

  return (
    <div>
      <h2 className="text-lg font-semibold">Trash (Deleted Data, Across All Organizers)</h2>
      <p className="mt-1 text-sm text-kolabora-neutral-dark/70">
        Restore soft-deleted data platform-wide (FR-RST-003), or permanently delete it once the minimum
        90-day retention period has passed (FR-RST-004, BR-033) — permanent deletion cannot be
        undone.
      </p>

      <nav className="mt-4 flex flex-wrap gap-2 border-b border-kolabora-neutral-dark/10 pb-2">
        {TRASH_TABS.map((tab) => (
          <Link
            key={tab.value}
            href={`/admin/trash?type=${tab.value}`}
            className={`rounded-full px-4 py-1.5 text-sm font-medium ${
              tab.value === type
                ? "bg-kolabora-primary/10 text-kolabora-primary"
                : "text-kolabora-neutral-dark/70 hover:bg-kolabora-neutral-dark/5"
            }`}
          >
            {tab.label}
          </Link>
        ))}
      </nav>

      <div className="mt-4">
        <TrashTable
          items={items}
          restoreEndpoint="/api/admin/trash/restore"
          permanentDeleteEndpoint="/api/admin/trash/permanent-delete"
        />
      </div>
    </div>
  );
}