subman-nextjs/src/app/ui/tables/contextMenu.tsx

58 lines
2.2 KiB
TypeScript

import { Dialog, DialogTrigger, DialogClose, DialogDescription, DialogContent, DialogTitle, DialogHeader, DialogFooter } from "@/components/ui/dialog"
import { Button } from "@/components/ui/button"
import { ContextMenuContent, ContextMenuItem, ContextMenuSubTrigger, ContextMenuSeparator, ContextMenuSub, ContextMenuSubContent } from "@/components/ui/context-menu"
import { deleteRecord } from "app/lib/del"
import { Trash2 } from "lucide-react"
import Link from "next/link"
import { ComponentProps } from "react"
import { Row, Table, TableState } from "@tanstack/react-table"
import { letterCase } from "app/lib/functions"
import { tableNameToItemName } from "app/lib/nameMaps"
export default function FormContextMenu({ table, row }: ComponentProps<"div"> & { table: Table<any>, row: Row<any> }) {
const pathname = table.options.meta.pathname
const selectedRows = table.getSelectedRowModel().flatRows
return (
<Dialog modal={true}>
<ContextMenuContent >
{pathname !== "/submission" && selectedRows.length <= 1 ?
<>
<Link href={`${pathname}/${row.original.id}`}>
<ContextMenuItem>Inspect</ContextMenuItem>
</Link>
</>
: ""
}
{
selectedRows.length > 0 ?
<ContextMenuItem onClick={() => { table.resetRowSelection() }}>Deselect</ContextMenuItem>
: ""
}
<ContextMenuSeparator />
<DialogTrigger asChild>
<ContextMenuItem className="text-destructive">Delete</ContextMenuItem>
</DialogTrigger>
</ContextMenuContent>
<DialogContent>
<DialogHeader>
<DialogTitle>Are you sure?</DialogTitle>
<DialogDescription>
Deleting a {tableNameToItemName(table.options.meta.tableName)} 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>
)
}