64 lines
1.9 KiB
TypeScript
64 lines
1.9 KiB
TypeScript
 
|
"use client";
|
||
|
|
|
||
|
|
import { useState } from "react";
|
||
|
|
import { useRouter } from "next/navigation";
|
||
|
|
import { Button } from "@/components/ui/button";
|
||
|
|
import {
|
||
|
|
Dialog,
|
||
|
|
DialogContent,
|
||
|
|
DialogDescription,
|
||
|
|
DialogFooter,
|
||
|
|
DialogHeader,
|
||
|
|
DialogTitle,
|
||
|
|
} from "@/components/ui/dialog";
|
||
|
|
import { Trash2 } from "lucide-react";
|
||
|
|
import { toast } from "sonner";
|
||
|
|
|
||
|
|
export function SessionDeleteButton({ sessionId, sessionName }: { sessionId: number; sessionName: string | null }) {
|
||
|
|
const router = useRouter();
|
||
|
|
const [open, setOpen] = useState(false);
|
||
|
|
const [deleting, setDeleting] = useState(false);
|
||
|
|
|
||
|
|
async function handleDelete() {
|
||
|
|
setDeleting(true);
|
||
|
|
const res = await fetch(`/api/sessions/${sessionId}`, { method: "DELETE" });
|
||
|
|
setDeleting(false);
|
||
|
|
if (res.ok) {
|
||
|
|
toast.success("Session deleted");
|
||
|
|
router.push("/sessions");
|
||
|
|
router.refresh();
|
||
|
|
} else {
|
||
|
|
toast.error("Could not delete session");
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<Button variant="ghost" size="icon-sm" onClick={() => setOpen(true)} aria-label="Delete session">
|
||
|
|
<Trash2 className="size-4" />
|
||
|
|
</Button>
|
||
|
|
|
||
|
|
<Dialog open={open} onOpenChange={setOpen}>
|
||
|
|
<DialogContent>
|
||
|
|
<DialogHeader>
|
||
|
|
<DialogTitle>Delete session?</DialogTitle>
|
||
|
|
<DialogDescription>
|
||
|
|
This permanently deletes{" "}
|
||
|
|
<span className="font-medium text-foreground">{sessionName ?? `Session #${sessionId}`}</span> and all
|
||
|
|
of its recorded events. This can't be undone.
|
||
|
|
</DialogDescription>
|
||
|
|
</DialogHeader>
|
||
|
|
<DialogFooter>
|
||
|
|
<Button variant="ghost" onClick={() => setOpen(false)}>
|
||
|
|
Cancel
|
||
|
|
</Button>
|
||
|
|
<Button variant="destructive" onClick={() => void handleDelete()} disabled={deleting}>
|
||
|
|
{deleting ? "Deleting..." : "Delete"}
|
||
|
|
</Button>
|
||
|
|
</DialogFooter>
|
||
|
|
</DialogContent>
|
||
|
|
</Dialog>
|
||
|
|
</>
|
||
|
|
);
|
||
|
|
}
|