From c775c6d9097d0be0e934ee69e6ad6d62ccb22f15 Mon Sep 17 00:00:00 2001
From: narendraio <ndsnaren@gmail.com>
Date: Fri, 19 Jun 2026 23:25:38 +0530
Subject: [PATCH] fix(segments): warn before discarding an unsaved
 feature-specific segment

When creating a feature-specific segment from the feature panel, the segment
is built in an inline drawer that is closed via the `onCancel` prop. That path
bypasses the modal's intercept-close handler, so closing the drawer silently
discarded any unsaved work.

Route the drawer's cancel action through the existing `onClosing` guard so the
user is asked to confirm before their unsaved changes are discarded.

Closes #5368
---
 .../web/components/modals/CreateSegment.tsx   | 21 +++++++++++++++----
 1 file changed, 17 insertions(+), 4 deletions(-)

diff --git a/frontend/web/components/modals/CreateSegment.tsx b/frontend/web/components/modals/CreateSegment.tsx
index e0d4ad64beb4..16df5c478873 100644
--- a/frontend/web/components/modals/CreateSegment.tsx
+++ b/frontend/web/components/modals/CreateSegment.tsx
@@ -291,7 +291,7 @@ const CreateSegment: FC<CreateSegmentType> = ({
   const [valueChanged, setValueChanged] = useState(false)
   const [metadataValueChanged, setMetadataValueChanged] = useState(false)
   const onClosing = useCallback(() => {
-    return new Promise((resolve) => {
+    return new Promise<boolean>((resolve) => {
       if (valueChanged) {
         openConfirm({
           body: 'Closing this will discard your unsaved changes.',
@@ -306,6 +306,19 @@ const CreateSegment: FC<CreateSegmentType> = ({
       }
     })
   }, [valueChanged])
+  // The condensed/inline drawer (e.g. creating a feature-specific segment) is
+  // closed via the `onCancel` prop, which bypasses the modal's intercept-close
+  // handler above. Guard it so unsaved changes prompt the same confirmation (#5368).
+  const handleCancel = useCallback(() => {
+    if (!onCancel) {
+      return
+    }
+    onClosing().then((shouldClose) => {
+      if (shouldClose) {
+        onCancel()
+      }
+    })
+  }, [onCancel, onClosing])
   const onCreateChangeRequest = async (changeRequestData: {
     approvals: []
     description: string
@@ -569,7 +582,7 @@ const CreateSegment: FC<CreateSegmentType> = ({
                 isSaving={isSaving}
                 isValid={isValid}
                 isLimitReached={isLimitReached}
-                onCancel={onCancel}
+                onCancel={handleCancel}
                 topLevelRuleType={topLevelRuleType}
                 setTopLevelRuleType={setTopLevelRuleType}
               />
@@ -646,7 +659,7 @@ const CreateSegment: FC<CreateSegmentType> = ({
                 isSaving={isSaving}
                 isValid={isValid}
                 isLimitReached={isLimitReached}
-                onCancel={onCancel}
+                onCancel={handleCancel}
                 topLevelRuleType={topLevelRuleType}
                 setTopLevelRuleType={setTopLevelRuleType}
               />
@@ -685,7 +698,7 @@ const CreateSegment: FC<CreateSegmentType> = ({
               isSaving={isSaving}
               isValid={isValid}
               isLimitReached={isLimitReached}
-              onCancel={onCancel}
+              onCancel={handleCancel}
               topLevelRuleType={topLevelRuleType}
               setTopLevelRuleType={setTopLevelRuleType}
             />