Files
cc-switch/src/components/ConfirmDialog.tsx
2025-10-16 11:40:02 +08:00

65 lines
1.6 KiB
TypeScript

import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from "@/components/ui/dialog";
import { Button } from "@/components/ui/button";
import { AlertTriangle } from "lucide-react";
import { useTranslation } from "react-i18next";
interface ConfirmDialogProps {
isOpen: boolean;
title: string;
message: string;
confirmText?: string;
cancelText?: string;
onConfirm: () => void;
onCancel: () => void;
}
export function ConfirmDialog({
isOpen,
title,
message,
confirmText,
cancelText,
onConfirm,
onCancel,
}: ConfirmDialogProps) {
const { t } = useTranslation();
return (
<Dialog
open={isOpen}
onOpenChange={(open) => {
if (!open) {
onCancel();
}
}}
>
<DialogContent className="max-w-sm">
<DialogHeader className="space-y-3">
<DialogTitle className="flex items-center gap-2 text-lg font-semibold">
<AlertTriangle className="h-5 w-5 text-destructive" />
{title}
</DialogTitle>
<DialogDescription className="whitespace-pre-line text-sm leading-relaxed">
{message}
</DialogDescription>
</DialogHeader>
<DialogFooter className="flex gap-2 sm:justify-end">
<Button variant="outline" onClick={onCancel}>
{cancelText || t("common.cancel")}
</Button>
<Button variant="destructive" onClick={onConfirm}>
{confirmText || t("common.confirm")}
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
);
}