"use client";

import { ColumnDef } from "@tanstack/react-table";
import { TaxClassDTOSchema } from "@/lib/db/schemas/api";
import { z } from "zod";
import { Button } from "@/components/ui/button";
import { Trash, Edit, MoreHorizontal } from "lucide-react";
import { deleteTaxClass } from "@/actions/catalog";
import { toast } from "sonner";
import { formatDate } from "@/lib/format";
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuLabel,
  DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";

export type TaxClassesOverview = z.infer<typeof TaxClassDTOSchema>;

export const getColumns = (
  handleRowClick: (taxClass: TaxClassesOverview) => void,
  router: any
): ColumnDef<TaxClassesOverview>[] => [
  {
    accessorKey: "id",
    header: "ID",
    cell: ({ row }) => (
      <span className="text-xs text-muted-foreground font-mono">
        #{row.getValue("id") || "Neu"}
      </span>
    ),
  },
  {
    accessorKey: "name",
    header: "Name",
  },
  {
    accessorKey: "percentage",
    header: "Prozentsatz",
    cell: ({ row }) => {
        const percentage = row.getValue("percentage") as number;
        return percentage !== undefined ? `${percentage}%` : "-";
    }
  },
    {
    accessorKey: "createdAt",
    header: "Erstellt am",
    cell: ({ row }) => {
      const date = row.getValue("createdAt");
      return date ? formatDate(date as string) : "-";
    },
  },
  {
    id: "actions",
    cell: ({ row }) => {
      const taxClass = row.original;

      const onDelete = async (e: React.MouseEvent) => {
        e.stopPropagation(); // Prevent row click
        if (confirm(`Möchten Sie die Steuerklasse "${taxClass!.name}" wirklich löschen?`)) {
          try {
            await deleteTaxClass({ id: taxClass!.id });
            toast.success("Steuerklasse erfolgreich gelöscht.");
            router.refresh();
          } catch (error) {
            toast.error("Fehler beim Laden der Steuerklasse.");
          }
        }
      };

      const onEdit = (e: React.MouseEvent) => {
          e.stopPropagation();
          handleRowClick(taxClass);
      }

      return (
        <DropdownMenu>
          <DropdownMenuTrigger asChild>
            <Button variant="ghost" className="h-8 w-8 p-0">
              <span className="sr-only">Menü öffnen</span>
              <MoreHorizontal className="h-4 w-4" />
            </Button>
          </DropdownMenuTrigger>
          <DropdownMenuContent align="end">
            <DropdownMenuLabel>Aktionen</DropdownMenuLabel>
            <DropdownMenuItem onClick={onEdit}>
              <Edit className="mr-2 h-4 w-4" />
              Bearbeiten
            </DropdownMenuItem>
            <DropdownMenuItem onClick={onDelete} className="text-destructive">
              <Trash className="mr-2 h-4 w-4" />
              Löschen
            </DropdownMenuItem>
          </DropdownMenuContent>
        </DropdownMenu>
      );
    },
  },
];