delete confirmation

This commit is contained in:
Josh Hawkins 2024-10-15 07:58:08 -05:00
parent d7d2b75ff2
commit 90c60000d0

View File

@ -12,6 +12,16 @@ import {
DropdownMenuItem, DropdownMenuItem,
DropdownMenuTrigger, DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"; } from "@/components/ui/dropdown-menu";
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
} from "../ui/alert-dialog";
import { import {
LuCamera, LuCamera,
LuDownload, LuDownload,
@ -45,20 +55,21 @@ export default function SearchThumbnailFooter({
// interactions // interactions
const [showFrigatePlus, setShowFrigatePlus] = useState(false); const [showFrigatePlus, setShowFrigatePlus] = useState(false);
const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
const handleDelete = useCallback(() => { const handleDelete = useCallback(() => {
axios axios
.delete(`events/${searchResult.id}`) .delete(`events/${searchResult.id}`)
.then((resp) => { .then((resp) => {
if (resp.status == 200) { if (resp.status == 200) {
toast.success("Deleted object successfully.", { toast.success("Tracked object deleted successfully.", {
position: "top-center", position: "top-center",
}); });
refreshResults(); refreshResults();
} }
}) })
.catch(() => { .catch(() => {
toast.error("Failed to delete object.", { toast.error("Failed to delete tracked object.", {
position: "top-center", position: "top-center",
}); });
}); });
@ -74,6 +85,28 @@ export default function SearchThumbnailFooter({
return ( return (
<> <>
<AlertDialog
open={deleteDialogOpen}
onOpenChange={() => setDeleteDialogOpen(!deleteDialogOpen)}
>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Confirm Delete</AlertDialogTitle>
</AlertDialogHeader>
<AlertDialogDescription>
Are you sure you want to delete this tracked object?
</AlertDialogDescription>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogAction
className="bg-destructive"
onClick={handleDelete}
>
Delete
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
<FrigatePlusDialog <FrigatePlusDialog
upload={ upload={
showFrigatePlus ? (searchResult as unknown as Event) : undefined showFrigatePlus ? (searchResult as unknown as Event) : undefined
@ -123,7 +156,7 @@ export default function SearchThumbnailFooter({
<DropdownMenuTrigger> <DropdownMenuTrigger>
<LuMoreVertical className="size-5 cursor-pointer text-primary" /> <LuMoreVertical className="size-5 cursor-pointer text-primary" />
</DropdownMenuTrigger> </DropdownMenuTrigger>
<DropdownMenuContent> <DropdownMenuContent align={"end"}>
{searchResult.has_clip && ( {searchResult.has_clip && (
<DropdownMenuItem> <DropdownMenuItem>
<a <a
@ -152,7 +185,7 @@ export default function SearchThumbnailFooter({
<FaArrowsRotate className="mr-2 size-4" /> <FaArrowsRotate className="mr-2 size-4" />
<span>View object lifecycle</span> <span>View object lifecycle</span>
</DropdownMenuItem> </DropdownMenuItem>
<DropdownMenuItem onClick={handleDelete}> <DropdownMenuItem onClick={() => setDeleteDialogOpen(true)}>
<LuTrash2 className="mr-2 size-4" /> <LuTrash2 className="mr-2 size-4" />
<span>Delete</span> <span>Delete</span>
</DropdownMenuItem> </DropdownMenuItem>