classify web

components/Common/ReusableAlertDialog.jsx

@@ -0,0 +1,46 @@
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@/components/ui/alert-dialog";
+import { t } from "@/utils";
+import { Loader2 } from "lucide-react";
+
+const ReusableAlertDialog = ({
+  open,
+  onCancel,
+  onConfirm,
+  title,
+  description,
+  cancelText = t("cancel"),
+  confirmText = t("confirm"),
+  confirmDisabled = false,
+}) => {
+  return (
+    <AlertDialog open={open}>
+      <AlertDialogContent onInteractOutside={(e) => e.preventDefault()}>
+        <AlertDialogHeader>
+          <AlertDialogTitle>{title}</AlertDialogTitle>
+          {description && (
+            <AlertDialogDescription asChild={typeof description !== "string"}>
+              {typeof description === "string" ? description : description}
+            </AlertDialogDescription>
+          )}
+        </AlertDialogHeader>
+        <AlertDialogFooter>
+          <AlertDialogCancel onClick={onCancel}>{cancelText}</AlertDialogCancel>
+          <AlertDialogAction disabled={confirmDisabled} onClick={onConfirm}>
+            {confirmDisabled ? <Loader2 className="w-4 h-4 animate-spin" /> : confirmText}
+          </AlertDialogAction>
+        </AlertDialogFooter>
+      </AlertDialogContent>
+    </AlertDialog>
+  );
+};
+
+export default ReusableAlertDialog;