From 615944e6632a618853937f07f5dad5461ad6ec49 Mon Sep 17 00:00:00 2001 From: Ritika-Patel08 Date: Tue, 12 Mar 2024 19:05:01 +0530 Subject: [PATCH 1/4] Improved: code by adding loader when logging out(#60) --- src/App.vue | 27 +++++++++++++++++++++++---- src/store/auth.ts | 3 +++ src/views/Home.vue | 1 + 3 files changed, 27 insertions(+), 4 deletions(-) diff --git a/src/App.vue b/src/App.vue index 06a7c86..3b38490 100644 --- a/src/App.vue +++ b/src/App.vue @@ -9,7 +9,7 @@ import { createAnimation, IonApp, IonRouterOutlet, loadingController } from '@io import { useAuthStore } from "@/store/auth"; import { useRouter } from "vue-router"; import { defineComponent } from 'vue'; -import { initialise } from '@/adapter'; +import { initialise, resetConfig } from '@/adapter'; import emitter from "@/event-bus" export default defineComponent({ @@ -25,13 +25,16 @@ export default defineComponent({ } }, methods: { - async presentLoader() { + async presentLoader(options = { message: '', backdropDismiss: true } as any) { + // 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: this.$t("Click the backdrop to dismiss."), + message: options.message ? this.$t(options.message) : this.$t("Click the backdrop to dismiss."), translucent: true, - backdropDismiss: true + backdropDismiss: options.backdropDismiss }); } this.loader.present(); @@ -87,6 +90,22 @@ export default defineComponent({ } }) }, + async mounted() { + this.loader = await loadingController + .create({ + message: this.$t("Click the backdrop to dismiss."), + translucent: true, + backdropDismiss: true + }); + emitter.on('presentLoader', this.presentLoader); + emitter.on('dismissLoader', this.dismissLoader); + + }, + unmounted() { + emitter.off('presentLoader', this.presentLoader); + emitter.off('dismissLoader', this.dismissLoader); + resetConfig() + }, setup () { const router = useRouter(); const authStore = useAuthStore(); diff --git a/src/store/auth.ts b/src/store/auth.ts index a55a03d..3eac127 100644 --- a/src/store/auth.ts +++ b/src/store/auth.ts @@ -4,6 +4,7 @@ import { UserService } from '@/services/UserService'; import { hasError, logout, updateInstanceUrl, updateToken } from '@/adapter'; import { showToast } from '@/util'; import { translate } from '@/i18n' +import emitter from "@/event-bus"; export const useAuthStore = defineStore('authStore', { state: () => ({ @@ -87,6 +88,7 @@ export const useAuthStore = defineStore('authStore', { } }, async logout(payload?: any) { + emitter.emit("presentLoader",{ message: "Logging out...", backdropDismiss: false }); // 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 if(!payload?.isUserUnauthorised) { @@ -102,6 +104,7 @@ export const useAuthStore = defineStore('authStore', { } this.redirectUrl = '' updateToken(''); + emitter.emit('dismissLoader') }, async setToken(token: any, expirationTime: any) { this.token = { diff --git a/src/views/Home.vue b/src/views/Home.vue index 8154e25..f3081fe 100644 --- a/src/views/Home.vue +++ b/src/views/Home.vue @@ -86,6 +86,7 @@ import { import { useAuthStore } from '@/store/auth'; import { useRouter } from "vue-router"; import { goToOms } from '@hotwax/dxp-components' +import emitter from "@/event-bus"; export default defineComponent({ name: 'Home', From c3391100c9cf397cd07e7d94ef613c29d1188852 Mon Sep 17 00:00:00 2001 From: Ritika-Patel08 Date: Wed, 13 Mar 2024 14:39:46 +0530 Subject: [PATCH 2/4] Improved: code by adding the translation and removed unwanted space --- src/App.vue | 1 - src/locales/en.json | 1 + 2 files changed, 1 insertion(+), 1 deletion(-) diff --git a/src/App.vue b/src/App.vue index 3b38490..3155556 100644 --- a/src/App.vue +++ b/src/App.vue @@ -99,7 +99,6 @@ export default defineComponent({ }); emitter.on('presentLoader', this.presentLoader); emitter.on('dismissLoader', this.dismissLoader); - }, unmounted() { emitter.off('presentLoader', this.presentLoader); diff --git a/src/locales/en.json b/src/locales/en.json index 930ec23..64ebb92 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -4,6 +4,7 @@ "Launch Pad": "Launch Pad", "Login": "Login", "Logout": "Logout", + "Logging out...": "Logging out...", "Next": "Next", "OMS": "OMS", "Password": "Password", From 872643d98685bb9da4376cac6a749b09dc5f47ab Mon Sep 17 00:00:00 2001 From: Ritika-Patel08 Date: Wed, 13 Mar 2024 14:44:16 +0530 Subject: [PATCH 3/4] Improved: code by removing unwanted import --- src/views/Home.vue | 1 - 1 file changed, 1 deletion(-) diff --git a/src/views/Home.vue b/src/views/Home.vue index f3081fe..8154e25 100644 --- a/src/views/Home.vue +++ b/src/views/Home.vue @@ -86,7 +86,6 @@ import { import { useAuthStore } from '@/store/auth'; import { useRouter } from "vue-router"; import { goToOms } from '@hotwax/dxp-components' -import emitter from "@/event-bus"; export default defineComponent({ name: 'Home', From 839a4ae885d646962b7a57f51bda2198b3bc1675 Mon Sep 17 00:00:00 2001 From: Ritika-Patel08 Date: Fri, 15 Mar 2024 18:42:29 +0530 Subject: [PATCH 4/4] Improved: code by moving the loader into in if condition of unauthorised check --- src/store/auth.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/store/auth.ts b/src/store/auth.ts index 3eac127..f0e092a 100644 --- a/src/store/auth.ts +++ b/src/store/auth.ts @@ -88,10 +88,10 @@ export const useAuthStore = defineStore('authStore', { } }, async logout(payload?: any) { - emitter.emit("presentLoader",{ message: "Logging out...", backdropDismiss: false }); // 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 if(!payload?.isUserUnauthorised) { + emitter.emit("presentLoader",{ message: "Logging out...", backdropDismiss: false }); await logout(); }