"use client"

import { useAuthApi } from "@/shared/useApi"
import { useRouter } from "next/navigation"
import { useState } from "react"
import { Button } from "@/shared/components/ui/button"
import {
    DropdownMenu,
    DropdownMenuContent,
    DropdownMenuItem,
    DropdownMenuTrigger,
} from "@/shared/components/ui/dropdown-menu"
import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@/shared/components/ui/dialog"
import { Ellipsis, Pencil, Trash2 } from "lucide-react"
import { InvoiceEditForm } from "./invoice-edit-form"
import { useInvoice } from "./invoice-context"

type InvoiceActionsProps = {
    invoiceId: string
}

export function InvoiceActions({ invoiceId }: InvoiceActionsProps) {
    const api = useAuthApi()
    const router = useRouter()
    const [isEditOpen, setIsEditOpen] = useState(false)
    const invoice = useInvoice()
    const handleEditSuccess = () => {
        setIsEditOpen(false)
        router.refresh()
    }

    const handleDelete = async () => {
        await api.invoices.destroy(invoiceId)
        router.push("/sales/invoice")
    }

    return (
        <>
            <DropdownMenu>
                <DropdownMenuTrigger asChild>
                    <Button variant="ghost" size="icon">
                        <Ellipsis className="size-4" />
                    </Button>
                </DropdownMenuTrigger>
                <DropdownMenuContent align="end">
                    {/* <DropdownMenuItem onClick={() => setIsEditOpen(true)}>
                        <Pencil className="size-4" />
                        Edit
                    </DropdownMenuItem> */}
                    <DropdownMenuItem variant="destructive" onClick={handleDelete}>
                        <Trash2 className="size-4" />
                        Delete
                    </DropdownMenuItem>
                </DropdownMenuContent>
            </DropdownMenu>

            {/* <Dialog open={isEditOpen} onOpenChange={setIsEditOpen}>
                <DialogContent className="max-w-2xl">
                    <DialogHeader>
                        <DialogTitle>Edit Invoice</DialogTitle>
                    </DialogHeader>
                    <InvoiceEditForm
                        initialData={{
                            
                        }}
                        resourceId={invoiceId}
                        onSuccess={handleEditSuccess}
                    />
                </DialogContent>
            </Dialog> */}
        </>
    )
}