From 2a8239751df50908c5a87fd9e90a1261ac8370d6 Mon Sep 17 00:00:00 2001
From: Yash Maheshwari <yashmaheshwari551@gmail.com>
Date: Mon, 8 Apr 2024 11:36:24 +0530
Subject: [PATCH] Improved: the leave alert UI when leaving the page without
 saving changes(#162)

Updated the alert interface when leaving the page
Added option to save the changes the before leaving or discard the changes and change the page in all cases
Removed unused entries from the locale file and added the static text entries
---
 src/locales/en.json          |  6 ++----
 src/views/BrokeringQuery.vue | 25 +++++++++++--------------
 src/views/BrokeringRoute.vue | 18 +++++++-----------
 3 files changed, 20 insertions(+), 29 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index f636a37..66e415e 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -7,7 +7,6 @@
   "Allocated Items": "Allocated Items",
   "Allow partial allocation": "Allow partial allocation",
   "Already passed": "Already passed",
-  "Any edits made on this page will be lost.": "Any edits made on this page will be lost.",
   "App": "App",
   "Archive": "Archive",
   "Archived": "Archived",
@@ -30,7 +29,9 @@
   "Connection configuration is missing for oms.": "Connection configuration is missing for oms.",
   "Created at": "Created at",
   "Description": "Description",
+  "Discard": "Discard",
   "Draft": "Draft",
+  "Do you want to save your changes before leaving this page?": "Do you want to save your changes before leaving this page?",
   "duration": "duration",
   "Edit": "Edit",
   "Error getting user profile": "Error getting user profile",
@@ -58,9 +59,7 @@
   "Inventory Sort": "Inventory Sort",
   "Job updated": "Job updated",
   "kms": "kms",
-  "LEAVE": "LEAVE",
   "Last run": "Last run",
-  "Leave page": "Leave page",
   "Logging in...": "Logging in...",
   "Login": "Login",
   "Logout": "Logout",
@@ -113,7 +112,6 @@
   "route name": "route name",
   "rules": " rules",
   "run name": "run name",
-  "STAY": "STAY",
   "Sales Channel": "Sales Channel",
   "Save": "Save",
   "Save changes": "Save changes",
diff --git a/src/views/BrokeringQuery.vue b/src/views/BrokeringQuery.vue
index fa30e4e..cf409df 100644
--- a/src/views/BrokeringQuery.vue
+++ b/src/views/BrokeringQuery.vue
@@ -325,7 +325,6 @@ onIonViewWillEnter(async () => {
 
 onBeforeRouteLeave(async (to) => {
   if(to.path === "/login") return;
-  let canLeave = false;
 
   if(!hasUnsavedChanges.value) {
     // clearning the selected ruleId whenever user tries to leave the page, we need to clear this id, as if user opens some other routing then the id will not be found which will result in an empty state scenario
@@ -335,30 +334,28 @@ onBeforeRouteLeave(async (to) => {
   }
 
   const alert = await alertController.create({
-    header: translate("Leave page"),
-    message: translate("Any edits made on this page will be lost."),
+    header: translate("Save changes"),
+    message: translate("Do you want to save your changes before leaving this page?"),
     buttons: [
       {
-        text: translate("STAY"),
-        handler: () => {
-          canLeave = false;
-        },
+        text: translate("Discard")
       },
       {
-        text: translate("LEAVE"),
-        handler: () => {
-          // clearning the selected ruleId whenever user leaves the page, we need to clear this id, as if user opens some other routing then the id will not be found which will result in an empty state scenario
-          store.dispatch("orderRouting/updateRoutingRuleId", "")
-          store.dispatch("orderRouting/clearRules")
-          canLeave = true;
+        text: translate("Save"),
+        handler: async () => {
+          await save();
         },
       },
     ],
   });
 
+  // clearning the selected ruleId whenever user leaves the page, we need to clear this id, as if user opens some other routing then the id will not be found which will result in an empty state scenario
+  store.dispatch("orderRouting/updateRoutingRuleId", "")
+  store.dispatch("orderRouting/clearRules")
+
   alert.present();
   await alert.onDidDismiss();
-  return canLeave;
+  return;
 })
 
 function getRouteIndex() {
diff --git a/src/views/BrokeringRoute.vue b/src/views/BrokeringRoute.vue
index d9f3ce4..e61d290 100644
--- a/src/views/BrokeringRoute.vue
+++ b/src/views/BrokeringRoute.vue
@@ -205,7 +205,6 @@ onIonViewWillEnter(async () => {
 
 onBeforeRouteLeave(async (to) => {
   if(to.path === "/login") return;
-  let canLeave = false;
 
   // If there are no unsaved changes do not create and present the alert
   if(!hasUnsavedChanges.value) {
@@ -213,19 +212,16 @@ onBeforeRouteLeave(async (to) => {
   }
 
   const alert = await alertController.create({
-    header: translate("Leave page"),
-    message: translate("Any edits made on this page will be lost."),
+    header: translate("Save changes"),
+    message: translate("Do you want to save your changes before leaving this page?"),
     buttons: [
       {
-        text: translate("STAY"),
-        handler: () => {
-          canLeave = false;
-        },
+        text: translate("Discard")
       },
       {
-        text: translate("LEAVE"),
-        handler: () => {
-          canLeave = true;
+        text: translate("Save"),
+        handler: async () => {
+          await saveRoutingGroup();
         },
       },
     ],
@@ -233,7 +229,7 @@ onBeforeRouteLeave(async (to) => {
 
   alert.present();
   await alert.onDidDismiss();
-  return canLeave;
+  return;
 })
 
 function updateCronExpression(event: CustomEvent) {