Olympus/frontend/athena/components/common/ConfirmDialog.tsx

67 lines
1.5 KiB
TypeScript

"use client";
import type { ReactNode } from "react";
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from "@/components/ui/dialog";
import { Button } from "@/components/ui/button";
type Props = {
open: boolean;
title: string;
description: string;
confirmLabel?: string;
pending?: boolean;
children?: ReactNode;
onOpenChange: (open: boolean) => void;
onConfirm: () => void;
};
export default function ConfirmDialog({
open,
title,
description,
confirmLabel = "Löschen",
pending = false,
children,
onOpenChange,
onConfirm,
}: Props) {
return (
<Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent>
<DialogHeader>
<DialogTitle>{title}</DialogTitle>
<DialogDescription>{description}</DialogDescription>
</DialogHeader>
{children && <div className="rounded-lg border bg-slate-50 p-3">{children}</div>}
<DialogFooter>
<Button
type="button"
variant="outline"
onClick={() => onOpenChange(false)}
disabled={pending}
>
Abbrechen
</Button>
<Button
type="button"
variant="destructive"
onClick={onConfirm}
disabled={pending}
>
{pending ? "Wird gelöscht..." : confirmLabel}
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
);
}