"use client";

import Link from "next/link";
import { ListChecks, Settings } from "lucide-react";
import { Button } from "@/components/ui/button";
import { Badge } from "@/components/ui/badge";
import { SimpleCrud, type CrudColumn, type CrudField, type CrudRow } from "@/components/admin/simple-crud";

const FIELDS: CrudField[] = [
  { name: "nama", label: "Nama Analisis", required: true, full: true },
  { name: "subjek", label: "Subjek / Unit Analisis" },
  { name: "googleFormId", label: "ID Google Form" },
  {
    name: "sinkronisasi",
    label: "Sinkronisasi Google Form",
    type: "select",
    options: [
      { value: "Tidak Sinkron", label: "Tidak Sinkron" },
      { value: "Sinkron", label: "Sinkron" },
    ],
    defaultValue: "Tidak Sinkron",
  },
  {
    name: "klasifikasi",
    label: "Klasifikasi",
    type: "select",
    options: [
      { value: "Penduduk", label: "Penduduk" },
      { value: "Keluarga", label: "Keluarga" },
      { value: "Rumah Tangga", label: "Rumah Tangga" },
      { value: "Lainnya", label: "Lainnya" },
    ],
    defaultValue: "Penduduk",
  },
  { name: "deskripsi", label: "Deskripsi", type: "textarea" },
  { name: "aktif", label: "Aktif", type: "checkbox" },
];

const COLUMNS: CrudColumn[] = [
  { name: "nama", label: "Nama" },
  { name: "subjek", label: "Subjek/Unit Analisis" },
  { name: "googleFormId", label: "ID Google Form", hideOnMobile: true },
  {
    name: "sinkronisasi",
    label: "Sinkronisasi Google Form",
    render: (row) =>
      row.sinkronisasi === "Sinkron" ? <Badge variant="success">Sinkron</Badge> : <Badge variant="secondary">Tidak Sinkron</Badge>,
  },
  { name: "aktif", label: "Aktif", hideOnMobile: true },
];

export default function AnalisisPage() {
  return (
    <SimpleCrud
      title="Master Analisis"
      description="Daftar analisis kependudukan beserta pertanyaan dan pilihan jawabannya."
      entity="analisis"
      fields={FIELDS}
      columns={COLUMNS}
      searchPlaceholder="Cari analisis…"
      createLabel="Tambah Analisis Baru"
      showNo
      actionOnLeft
      headerExtra={
        <Link href="/admin/analisis/pengaturan">
          <Button variant="outline" size="sm">
            <Settings className="h-4 w-4" /> Pengaturan
          </Button>
        </Link>
      }
      rowActions={(row: CrudRow) => (
        <Link
          href={`/admin/analisis/${row.id}`}
          className="rounded-md p-1.5 text-muted-foreground hover:bg-muted hover:text-foreground"
          title="Kelola pertanyaan"
        >
          <ListChecks className="h-4 w-4" />
        </Link>
      )}
    />
  );
}