From 61ad646ab96e8496d30c5c2a1abfe331d542d5a2 Mon Sep 17 00:00:00 2001
From: Aashutosh Soni <aashutosh.soni@hotwaxsystems.com>
Date: Mon, 24 Mar 2025 19:24:44 +0530
Subject: [PATCH] Fixed: updated loader behavior to prevent backdrop dismissal
 and adjusted loading message. (hotwax/dxp-components#321)

---
 src/App.vue                       | 10 +++++-----
 src/locales/en.json               |  1 +
 src/store/modules/user/actions.ts |  2 +-
 3 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index cb6afc8c..53f06c88 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -36,16 +36,16 @@ export default defineComponent({
     }
   },
   methods: {
-    async presentLoader(options = { message: '', backdropDismiss: true }) {
+    async presentLoader(options = { message: '', backdropDismiss: false }) {
       // When having a custom message remove already existing loader
       if(options.message && this.loader) this.dismissLoader();
 
       if (!this.loader) {
         this.loader = await loadingController
           .create({
-            message: options.message ? translate(options.message) : translate("Click the backdrop to dismiss."),
+            message: options.message ? translate(options.message) : (options.backdropDismiss ? translate("Click the backdrop to dismiss.") : translate("Loading...")),
             translucent: true,
-            backdropDismiss: options.backdropDismiss
+            backdropDismiss: options.backdropDismiss || false
           });
       }
       this.loader.present();
@@ -95,9 +95,9 @@ export default defineComponent({
   async mounted() {
     this.loader = await loadingController
       .create({
-        message: translate("Click the backdrop to dismiss."),
+        message: translate("Loading..."),
         translucent: true,
-        backdropDismiss: true
+        backdropDismiss: false
       });
     emitter.on('presentLoader', this.presentLoader);
     emitter.on('dismissLoader', this.dismissLoader);
diff --git a/src/locales/en.json b/src/locales/en.json
index 12ba7dc1..da800c83 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -114,6 +114,7 @@
   "Leave page": "Leave page",
   "line items": "line items",
   "Loading": "Loading",
+  "Loading...": "Loading...",
   "Log file": "Log file",
   "Login": "Login",
   "Logging in": "Logging in",
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 0c5945eb..d410de16 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -95,7 +95,7 @@ const actions: ActionTree<UserState, RootState> = {
     // store the url on which we need to redirect the user after logout api completes in case of SSO enabled
     let redirectionUrl = ''
 
-    emitter.emit('presentLoader', { message: 'Logging out', backdropDismiss: false })
+    emitter.emit('presentLoader', { message: 'Logging out' })
 
     // Calling the logout api to flag the user as logged out, only when user is authorised
     // if the user is already unauthorised then not calling the logout api as it returns 401 again that results in a loop, thus there is no need to call logout api if the user is unauthorised