import { Dialog, DialogTrigger, DialogClose, DialogDescription, DialogContent, DialogTitle, DialogHeader, DialogFooter } from "@/components/ui/dialog"
import { Button } from "@/components/ui/button"
import { ContextMenuContent, ContextMenuItem } from "@/components/ui/context-menu"
import { deleteRecord } from "app/lib/del"
import { Trash2 } from "lucide-react"
import Link from "next/link"
import { ContextMenuSeparator } from "@radix-ui/react-context-menu"

export default function FormContextMenu({ pathname, row }) {

  return (
    <Dialog>
      <ContextMenuContent >
        <Link href={`${pathname}/${row.original.id}`}>
          <ContextMenuItem>Inspect</ContextMenuItem>
        </Link>
        <ContextMenuSeparator />
        <DialogTrigger asChild>
          <ContextMenuItem className="text-destructive">Delete</ContextMenuItem>
        </DialogTrigger>
      </ContextMenuContent>
      <DialogContent>
        <DialogHeader>
          <DialogTitle>Are you sure?</DialogTitle>
          <DialogDescription>
            Deleting a {pathname.slice(1)} cannot be undone!
          </DialogDescription>
        </DialogHeader>
        <DialogFooter>
          <DialogClose asChild>
            <Button variant="destructive"
              onClick={() => {
                deleteRecord(row.original.id, pathname)
              }}>Yes, delete it!
            </Button>
          </DialogClose>
        </DialogFooter>
      </DialogContent>
    </Dialog>

  )
}