From 03653067c2d5954e7254992e06336baa4f2575a5 Mon Sep 17 00:00:00 2001
From: "opensearch-trigger-bot[bot]"
 <98922864+opensearch-trigger-bot[bot]@users.noreply.github.com>
Date: Thu, 7 Nov 2024 15:20:18 -0800
Subject: [PATCH] Warn users on browser refresh if unsaved changes (#470)
 (#471)

(cherry picked from commit 8c20543ba0f53cb0fc153fc6f8945ccaf7061e52)

Signed-off-by: Tyler Ohlsen <ohltyler@amazon.com>
Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .../pages/workflow_detail/components/header.tsx | 17 +++++++++++++++++
 .../new_workflow/quick_configure_modal.tsx      |  1 -
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/public/pages/workflow_detail/components/header.tsx b/public/pages/workflow_detail/components/header.tsx
index a9853faf..77541620 100644
--- a/public/pages/workflow_detail/components/header.tsx
+++ b/public/pages/workflow_detail/components/header.tsx
@@ -195,6 +195,23 @@ export function WorkflowDetailHeader(props: WorkflowDetailHeaderProps) {
       ? ingestSaveButtonDisabled
       : searchSaveButtonDisabled;
 
+  // Add warning when exiting with unsaved changes
+  function alertFn(e: BeforeUnloadEvent) {
+    e.preventDefault();
+  }
+
+  // Hook for warning of unsaved changes if a browser refresh is detected
+  useEffect(() => {
+    if (!saveDisabled) {
+      window.addEventListener('beforeunload', alertFn);
+    } else {
+      window.removeEventListener('beforeunload', alertFn);
+    }
+    return () => {
+      window.removeEventListener('beforeunload', alertFn);
+    };
+  }, [saveDisabled]);
+
   // Utility fn to update the workflow UI config only, based on the current form values.
   // A get workflow API call is subsequently run to fetch the updated state.
   async function updateWorkflowUiConfig() {
diff --git a/public/pages/workflows/new_workflow/quick_configure_modal.tsx b/public/pages/workflows/new_workflow/quick_configure_modal.tsx
index 56db5852..d2bac5fc 100644
--- a/public/pages/workflows/new_workflow/quick_configure_modal.tsx
+++ b/public/pages/workflows/new_workflow/quick_configure_modal.tsx
@@ -160,7 +160,6 @@ export function QuickConfigureModal(props: QuickConfigureModalProps) {
                 history.replace(
                   constructUrlWithParams(
                     APP_PATH.WORKFLOWS,
-
                     workflow.id,
                     dataSourceId
                   )