"use client";

import { useRouter } from "next/navigation";
import { ChevronRight } from "lucide-react";
import {
  Table,
  TableBody,
  TableCell,
  TableHead,
  TableHeader,
  TableRow,
} from "@/components/ui/table";
import type { Association } from "@/lib/models";
import { AssociationStatusBadge } from "./association-status-badge";

export function AssociationTable({ associations }: { associations: Association[] }) {
  const router = useRouter();

  if (associations.length === 0) {
    return (
      <div className="rounded-lg border border-dashed py-16 text-center text-sm text-muted-foreground">
        Nessuna associazione trovata
      </div>
    );
  }

  return (
    <div className="rounded-lg border bg-background">
      <Table>
        <TableHeader>
          <TableRow>
            <TableHead>Nome</TableHead>
            <TableHead className="hidden md:table-cell">Indirizzo</TableHead>
            <TableHead className="hidden lg:table-cell">P.IVA</TableHead>
            <TableHead className="hidden lg:table-cell">RUNTS</TableHead>
            <TableHead>Stato</TableHead>
            <TableHead className="w-8" />
          </TableRow>
        </TableHeader>
        <TableBody>
          {associations.map((association) => (
            <TableRow
              key={association.id}
              className="cursor-pointer"
              onClick={() => router.push(`/dashboard/${association.id}`)}
            >
              <TableCell className="font-medium">{association.name}</TableCell>
              <TableCell className="hidden max-w-64 truncate text-muted-foreground md:table-cell">
                {association.address}
              </TableCell>
              <TableCell className="hidden text-muted-foreground lg:table-cell">
                {association.vatNumber || "—"}
              </TableCell>
              <TableCell className="hidden text-muted-foreground lg:table-cell">
                {association.runtsId || "—"}
              </TableCell>
              <TableCell>
                <AssociationStatusBadge isShown={association.isShown} />
              </TableCell>
              <TableCell>
                <ChevronRight className="size-4 text-muted-foreground" />
              </TableCell>
            </TableRow>
          ))}
        </TableBody>
      </Table>
    </div>
  );
}