import { Pencil, Trash2 } from "lucide-react";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { ConfirmDialog } from "@/components/ui/confirm-dialog";
import {
  Table,
  TableBody,
  TableCell,
  TableHead,
  TableHeader,
  TableRow,
} from "@/components/ui/table";
import type { Associate } from "@/lib/models";

const ROLE_LABELS: Record<Associate["role"], string> = {
  PRESIDENT: "Presidente",
  VICE_PRESIDENT: "Vicepresidente",
  SECRETARY: "Segretario",
  ASSOCIATE: "Socio",
};

export function AssociateTable({
  associates,
  onEdit,
  onDelete,
}: {
  associates: Associate[];
  onEdit?: (index: number) => void;
  onDelete?: (index: number) => Promise<void> | void;
}) {
  const editable = Boolean(onEdit || onDelete);

  if (associates.length === 0) {
    return (
      <p className="py-8 text-center text-sm text-muted-foreground">
        Nessun socio registrato
      </p>
    );
  }

  return (
    <Table>
      <TableHeader>
        <TableRow>
          <TableHead>Nome</TableHead>
          <TableHead>Ruolo</TableHead>
          <TableHead className="hidden md:table-cell">Codice fiscale</TableHead>
          <TableHead className="hidden lg:table-cell">Indirizzo</TableHead>
          <TableHead>Cittadinanza</TableHead>
          {editable && <TableHead className="w-20" />}
        </TableRow>
      </TableHeader>
      <TableBody>
        {associates.map((associate, index) => (
          <TableRow key={index}>
            <TableCell className="font-medium">
              {associate.name} {associate.surname}
            </TableCell>
            <TableCell className="text-muted-foreground">
              {ROLE_LABELS[associate.role] ?? associate.role}
            </TableCell>
            <TableCell className="hidden text-muted-foreground md:table-cell">
              {associate.fiscalCode || "—"}
            </TableCell>
            <TableCell className="hidden text-muted-foreground lg:table-cell">
              {associate.address || "—"}
            </TableCell>
            <TableCell>
              <Badge variant={associate.italianCitizen ? "secondary" : "outline"}>
                {associate.italianCitizen ? "Italiana" : "Straniera"}
              </Badge>
            </TableCell>
            {editable && (
              <TableCell>
                <div className="flex items-center gap-1">
                  {onEdit && (
                    <Button variant="ghost" size="icon-sm" onClick={() => onEdit(index)}>
                      <Pencil className="size-4" />
                    </Button>
                  )}
                  {onDelete && (
                    <ConfirmDialog
                      trigger={
                        <Button variant="ghost" size="icon-sm">
                          <Trash2 className="size-4 text-destructive" />
                        </Button>
                      }
                      title="Rimuovere il socio?"
                      description={`${associate.name} ${associate.surname} verrà rimosso dall'associazione.`}
                      confirmLabel="Rimuovi"
                      onConfirm={() => onDelete(index)}
                    />
                  )}
                </div>
              </TableCell>
            )}
          </TableRow>
        ))}
      </TableBody>
    </Table>
  );
}