import {
    Dialog,
    DialogContent,
    DialogDescription,
    DialogFooter,
    DialogHeader,
    DialogTitle,
} from "@/components/ui/dialog";
import { Button } from "@/components/ui/button";
import { Trash2 } from "lucide-react";

interface ConfirmDeleteModalProps {
    isOpen: boolean;
    onClose: () => void;
    onConfirm: () => void;
    itemName?: string;
    isProcessing?: boolean;
}

export function ConfirmDeleteModal({
    isOpen,
    onClose,
    onConfirm,
    itemName,
    isProcessing,
}: ConfirmDeleteModalProps) {
    return (
        <Dialog open={isOpen} onOpenChange={(open) => !open && onClose()}>
            <DialogContent className="sm:max-w-106.25 rounded-xl">
                <DialogHeader>
                    <DialogTitle className="text-xl font-bold text-foreground flex items-center gap-2">
                        <Trash2 className="h-5 w-5 text-rose-600" />
                        Hapus Data
                    </DialogTitle>
                    <DialogDescription className="text-muted-foreground">
                        Apakah Anda yakin ingin menghapus{" "}
                        {itemName ? (
                            <span className="font-semibold text-foreground">
                                "{itemName}"
                            </span>
                        ) : (
                            "data ini"
                        )}
                        ? Tindakan ini tidak dapat dibatalkan.
                    </DialogDescription>
                </DialogHeader>
                <DialogFooter className="pt-4 gap-2">
                    <Button type="button" variant="outline" onClick={onClose}>
                        Batal
                    </Button>
                    <Button
                        type="button"
                        variant="destructive"
                        disabled={isProcessing}
                        onClick={onConfirm}
                        className="bg-rose-600 hover:bg-rose-700"
                    >
                        {isProcessing ? "Menghapus..." : "Hapus Sekarang"}
                    </Button>
                </DialogFooter>
            </DialogContent>
        </Dialog>
    );
}