From cf83b0a236fad0d4394a9695ea986275377a418a Mon Sep 17 00:00:00 2001
From: "devin-ai-integration[bot]"
 <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Tue, 22 Apr 2025 15:24:06 +0000
Subject: [PATCH] feat: update DeleteSegmentDialog to use
 ConfirmationDialogContent CAL-5399 (#20820)

Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Co-authored-by: eunjae@cal.com <eunjae@cal.com>
---
 .../segment/DeleteSegmentDialog.tsx           | 24 ++++++++-----------
 1 file changed, 10 insertions(+), 14 deletions(-)

diff --git a/packages/features/data-table/components/segment/DeleteSegmentDialog.tsx b/packages/features/data-table/components/segment/DeleteSegmentDialog.tsx
index ef709e26e0..c3e8f100f6 100644
--- a/packages/features/data-table/components/segment/DeleteSegmentDialog.tsx
+++ b/packages/features/data-table/components/segment/DeleteSegmentDialog.tsx
@@ -1,7 +1,6 @@
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { trpc } from "@calcom/trpc";
-import { Button } from "@calcom/ui/components/button";
-import { Dialog, DialogContent, DialogFooter, DialogHeader } from "@calcom/ui/components/dialog";
+import { Dialog, ConfirmationDialogContent } from "@calcom/ui/components/dialog";
 import { showToast } from "@calcom/ui/components/toast";
 
 import { useDataTable } from "../../hooks";
@@ -45,18 +44,15 @@ export function DeleteSegmentDialog({
           onClose();
         }
       }}>
-      <DialogContent>
-        <DialogHeader title={t("delete_segment")} />
-        <div className="mb-6">{t("delete_segment_confirmation")}</div>
-        <DialogFooter>
-          <Button color="secondary" onClick={onClose}>
-            {t("cancel")}
-          </Button>
-          <Button color="destructive" onClick={handleDelete} loading={isPending}>
-            {t("delete")}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
+      <ConfirmationDialogContent
+        variety="danger"
+        title={t("delete_segment")}
+        confirmBtnText={t("delete")}
+        cancelBtnText={t("cancel")}
+        isPending={isPending}
+        onConfirm={handleDelete}>
+        <p className="mt-5">{t("delete_segment_confirmation")}</p>
+      </ConfirmationDialogContent>
     </Dialog>
   );
 }