import { MoreHorizontal } from "lucide-react";
import { Button } from "@/components/ui/button";
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuSeparator,
  DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { toast } from "sonner";
import { trpc } from "@/lib/trpc";

interface ActionMenuProps {
  initiativeId: string;
  onDelete?: () => void;
}

export function ActionMenu({ initiativeId, onDelete }: ActionMenuProps) {
  const archiveMutation = trpc.updateInitiative.useMutation({
    onSuccess: () => {
      onDelete?.();
      toast.success("Initiative archived");
    },
    onError: () => {
      toast.error("Failed to archive initiative");
    },
  });

  function handleArchive() {
    const confirmed = window.confirm(
      "Are you sure you want to archive this initiative? It can be restored later."
    );
    if (!confirmed) return;

    archiveMutation.mutate({
      id: initiativeId,
      status: "archived",
    });
  }

  return (
    <DropdownMenu>
      <DropdownMenuTrigger asChild>
        <Button variant="ghost" size="icon" className="h-8 w-8">
          <MoreHorizontal className="h-4 w-4" />
          <span className="sr-only">More actions</span>
        </Button>
      </DropdownMenuTrigger>
      <DropdownMenuContent align="end">
        <DropdownMenuItem disabled>Edit</DropdownMenuItem>
        <DropdownMenuItem disabled>Duplicate</DropdownMenuItem>
        <DropdownMenuSeparator />
        <DropdownMenuItem
          onClick={handleArchive}
          disabled={archiveMutation.isPending}
        >
          {archiveMutation.isPending ? "Archiving..." : "Archive"}
        </DropdownMenuItem>
        <DropdownMenuItem disabled>Delete</DropdownMenuItem>
      </DropdownMenuContent>
    </DropdownMenu>
  );
}
