From c0e2bdc01366f4a8878ffb373527d786e163a19b Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Sun, 31 Mar 2024 16:23:25 +0100
Subject: refactor: Extract the action confirming dialog into its own component

---
 .../web/components/ui/action-confirming-dialog.tsx | 48 ++++++++++++++++++++++
 1 file changed, 48 insertions(+)
 create mode 100644 apps/web/components/ui/action-confirming-dialog.tsx

(limited to 'apps/web/components/ui')

diff --git a/apps/web/components/ui/action-confirming-dialog.tsx b/apps/web/components/ui/action-confirming-dialog.tsx
new file mode 100644
index 00000000..980bdd60
--- /dev/null
+++ b/apps/web/components/ui/action-confirming-dialog.tsx
@@ -0,0 +1,48 @@
+"use client";
+
+import { useState } from "react";
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "@/components/ui/dialog";
+
+import { Button } from "./button";
+
+export default function ActionConfirmingDialog({
+  title,
+  description,
+  actionButton,
+  children,
+}: {
+  title: React.ReactNode;
+  description: React.ReactNode;
+  actionButton: (setDialogOpen: (open: boolean) => void) => React.ReactNode;
+  children: React.ReactNode;
+}) {
+  const [isDialogOpen, setDialogOpen] = useState(false);
+
+  return (
+    <Dialog open={isDialogOpen} onOpenChange={setDialogOpen}>
+      <DialogTrigger asChild>{children}</DialogTrigger>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>{title}</DialogTitle>
+        </DialogHeader>
+        {description}
+        <DialogFooter className="sm:justify-end">
+          <DialogClose asChild>
+            <Button type="button" variant="secondary">
+              Close
+            </Button>
+          </DialogClose>
+          {actionButton(setDialogOpen)}
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}
-- 
cgit v1.2.3-70-g09d2