From e5092d28f8c4574983578bb36525f1adbcbe81c3 Mon Sep 17 00:00:00 2001 From: k2maan Date: Mon, 9 Oct 2023 19:07:18 +0530 Subject: [PATCH 1/8] Implemented: locale update through user profile (#196) --- src/components/Login.ts | 2 +- src/index.ts | 3 +-- src/store/user.ts | 20 +++++--------------- 3 files changed, 7 insertions(+), 18 deletions(-) diff --git a/src/components/Login.ts b/src/components/Login.ts index 38516ae1..6cb2d48d 100644 --- a/src/components/Login.ts +++ b/src/components/Login.ts @@ -67,7 +67,7 @@ export default defineComponent({ const userStore = useUserStore() // to access baseUrl as we store only OMS in DXP const appState = appContext.config.globalProperties.$store - await userStore.getPreference(token, appState.getters['user/getBaseUrl']) + userStore.setLocale(appState.getters['user/getUserProfile'].userLocale) // check if firebase configurations are there if (notificationContext.appFirebaseConfig) { diff --git a/src/index.ts b/src/index.ts index a0f5cd41..1bbe3795 100644 --- a/src/index.ts +++ b/src/index.ts @@ -57,8 +57,7 @@ export let dxpComponents = { shopifyImgContext.defaultImgUrl = options.defaultImgUrl - userContext.getUserPreference = options.getUserPreference - userContext.setUserPreference = options.setUserPreference + userContext.setUserLocale = options.setUserLocale productIdentificationContext.getProductIdentificationPref = options.getProductIdentificationPref productIdentificationContext.setProductIdentificationPref = options.setProductIdentificationPref diff --git a/src/store/user.ts b/src/store/user.ts index b7f67b7b..2b125b68 100644 --- a/src/store/user.ts +++ b/src/store/user.ts @@ -7,13 +7,11 @@ export const useUserStore = defineStore('user', { state: () => { return { localeOptions: process.env.VUE_APP_LOCALES ? JSON.parse(process.env.VUE_APP_LOCALES) : { "en": "English" }, - preference: { - locale: 'en' - } as any + locale: 'en' } }, getters: { - getLocale: (state) => state.preference.locale, + getLocale: (state) => state.locale, getLocaleOptions: (state) => state.localeOptions }, actions: { @@ -23,18 +21,10 @@ export const useUserStore = defineStore('user', { this.setPreference({ locale: payload }) }, async setPreference(payload: any) { - this.preference = { ...this.preference, ...payload } - await userContext.setUserPreference({ - 'userPrefTypeId': 'LOCALE_PREFERENCE', - 'userPrefValue': JSON.stringify(this.preference) + this.locale = payload + await userContext.setUserLocale({ + "newLocale": payload }) - }, - async getPreference(token: any, baseURL: string) { - try { - this.preference = await userContext.getUserPreference(token, baseURL, 'LOCALE_PREFERENCE') - } catch (error) { - console.error(error) - } } }, persist: true From c4b28f6b008335b9fc186d1877e301ba3f4bb86d Mon Sep 17 00:00:00 2001 From: k2maan Date: Mon, 9 Oct 2023 19:29:44 +0530 Subject: [PATCH 2/8] Fixed: invalid payload passed to setLocale service causing infinite re renders (#196) --- src/components/LanguageSwitcher.vue | 7 +++++-- src/store/user.ts | 4 ++-- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/src/components/LanguageSwitcher.vue b/src/components/LanguageSwitcher.vue index 4399b70c..fff6d9d3 100644 --- a/src/components/LanguageSwitcher.vue +++ b/src/components/LanguageSwitcher.vue @@ -27,7 +27,10 @@ const userStore = useUserStore(); const locales = computed(() => userStore.getLocaleOptions); const currentLocale = computed(() => userStore.getLocale); -const setLocale = (locale: any) => { - userStore.setLocale(locale) +const setLocale = (locale: string) => { + if (locale !== currentLocale.value) { + userStore.setLocale(locale) + } + } \ No newline at end of file diff --git a/src/store/user.ts b/src/store/user.ts index 2b125b68..49000c39 100644 --- a/src/store/user.ts +++ b/src/store/user.ts @@ -18,9 +18,9 @@ export const useUserStore = defineStore('user', { setLocale(payload: string) { // update locale in state and globally i18n.global.locale.value = payload - this.setPreference({ locale: payload }) + this.setPreference(payload) }, - async setPreference(payload: any) { + async setPreference(payload: string) { this.locale = payload await userContext.setUserLocale({ "newLocale": payload From 916a43f4e0d58031a90abbc67bb62533d334577a Mon Sep 17 00:00:00 2001 From: k2maan Date: Tue, 10 Oct 2023 10:08:48 +0530 Subject: [PATCH 3/8] Improved: code by removing unnecessary action only calling API (#196) --- src/components/LanguageSwitcher.vue | 1 - src/store/user.ts | 13 ++++--------- 2 files changed, 4 insertions(+), 10 deletions(-) diff --git a/src/components/LanguageSwitcher.vue b/src/components/LanguageSwitcher.vue index fff6d9d3..8ae973a6 100644 --- a/src/components/LanguageSwitcher.vue +++ b/src/components/LanguageSwitcher.vue @@ -31,6 +31,5 @@ const setLocale = (locale: string) => { if (locale !== currentLocale.value) { userStore.setLocale(locale) } - } \ No newline at end of file diff --git a/src/store/user.ts b/src/store/user.ts index 49000c39..d21b4b97 100644 --- a/src/store/user.ts +++ b/src/store/user.ts @@ -15,16 +15,11 @@ export const useUserStore = defineStore('user', { getLocaleOptions: (state) => state.localeOptions }, actions: { - setLocale(payload: string) { + async setLocale(newLocale: string) { // update locale in state and globally - i18n.global.locale.value = payload - this.setPreference(payload) - }, - async setPreference(payload: string) { - this.locale = payload - await userContext.setUserLocale({ - "newLocale": payload - }) + i18n.global.locale.value = newLocale + this.locale = newLocale + await userContext.setUserLocale({ newLocale }) } }, persist: true From 2a97761d8efed3e3ac4f2585c359525daf92e459 Mon Sep 17 00:00:00 2001 From: k2maan Date: Tue, 10 Oct 2023 10:10:26 +0530 Subject: [PATCH 4/8] Improved: awaited setLocale call in login (#196) --- src/components/Login.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Login.ts b/src/components/Login.ts index 6cb2d48d..d7727a62 100644 --- a/src/components/Login.ts +++ b/src/components/Login.ts @@ -67,7 +67,7 @@ export default defineComponent({ const userStore = useUserStore() // to access baseUrl as we store only OMS in DXP const appState = appContext.config.globalProperties.$store - userStore.setLocale(appState.getters['user/getUserProfile'].userLocale) + await userStore.setLocale(appState.getters['user/getUserProfile'].userLocale) // check if firebase configurations are there if (notificationContext.appFirebaseConfig) { From 9e3d05b58924085ada0e484fe068ce9ac6d8700b Mon Sep 17 00:00:00 2001 From: k2maan Date: Tue, 10 Oct 2023 17:05:47 +0530 Subject: [PATCH 5/8] Improved: setLocale function by removing unnecessary check for checking current and previous value (#196) --- src/components/LanguageSwitcher.vue | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/components/LanguageSwitcher.vue b/src/components/LanguageSwitcher.vue index 8ae973a6..0d0b3a05 100644 --- a/src/components/LanguageSwitcher.vue +++ b/src/components/LanguageSwitcher.vue @@ -28,8 +28,6 @@ const locales = computed(() => userStore.getLocaleOptions); const currentLocale = computed(() => userStore.getLocale); const setLocale = (locale: string) => { - if (locale !== currentLocale.value) { - userStore.setLocale(locale) - } + userStore.setLocale(locale) } \ No newline at end of file From f51f82b89a24fd3fe92162a3a5cf6cc5bf6dd7db Mon Sep 17 00:00:00 2001 From: k2maan Date: Tue, 10 Oct 2023 17:35:11 +0530 Subject: [PATCH 6/8] Improved: error handling for setUserLocale API (#196) --- src/store/user.ts | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/src/store/user.ts b/src/store/user.ts index d21b4b97..b48a5b47 100644 --- a/src/store/user.ts +++ b/src/store/user.ts @@ -16,10 +16,14 @@ export const useUserStore = defineStore('user', { }, actions: { async setLocale(newLocale: string) { - // update locale in state and globally - i18n.global.locale.value = newLocale - this.locale = newLocale - await userContext.setUserLocale({ newLocale }) + try { + // update locale in state and globally + i18n.global.locale.value = newLocale + this.locale = newLocale + await userContext.setUserLocale({ newLocale }) + } catch (error) { + console.error(error) + } } }, persist: true From 9df6c5af86645696dcba397204dc8627ce867c8b Mon Sep 17 00:00:00 2001 From: k2maan Date: Thu, 12 Oct 2023 12:31:56 +0530 Subject: [PATCH 7/8] Improved: locale codes by adding secodary code/country code (#196) --- src/index.ts | 4 ++-- src/store/user.ts | 9 +++++++-- 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/src/index.ts b/src/index.ts index 1bbe3795..2dced4b6 100644 --- a/src/index.ts +++ b/src/index.ts @@ -33,8 +33,8 @@ export let dxpComponents = { // Creating an instance of the i18n and translate function for translating text i18n = createI18n({ legacy: false, - locale: process.env.VUE_APP_I18N_LOCALE || 'en', - fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || 'en', + locale: process.env.VUE_APP_I18N_LOCALE || 'en-US', + fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || 'en-US', messages: options.localeMessages }) diff --git a/src/store/user.ts b/src/store/user.ts index b48a5b47..6aafb264 100644 --- a/src/store/user.ts +++ b/src/store/user.ts @@ -6,8 +6,8 @@ declare let process: any; export const useUserStore = defineStore('user', { state: () => { return { - localeOptions: process.env.VUE_APP_LOCALES ? JSON.parse(process.env.VUE_APP_LOCALES) : { "en": "English" }, - locale: 'en' + localeOptions: process.env.VUE_APP_LOCALES ? JSON.parse(process.env.VUE_APP_LOCALES) : { "en-US": "English" }, + locale: 'en-US' } }, getters: { @@ -16,6 +16,11 @@ export const useUserStore = defineStore('user', { }, actions: { async setLocale(newLocale: string) { + let matchingLocale = Object.keys(this.localeOptions).find((locale: string) => locale === newLocale) + // If exact locale is not found, try to match the first two characters i.e primary code + matchingLocale = matchingLocale || Object.keys(this.localeOptions).find((locale: string) => locale.slice(0, 2) === newLocale.slice(0, 2)) + newLocale = matchingLocale || this.locale + try { // update locale in state and globally i18n.global.locale.value = newLocale From bb5a3591d7871c91b947a13e63bf88b56df06bbc Mon Sep 17 00:00:00 2001 From: k2maan Date: Thu, 12 Oct 2023 12:57:57 +0530 Subject: [PATCH 8/8] Improved: variable naming (#196) --- src/store/user.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/store/user.ts b/src/store/user.ts index 6aafb264..d8944344 100644 --- a/src/store/user.ts +++ b/src/store/user.ts @@ -15,11 +15,11 @@ export const useUserStore = defineStore('user', { getLocaleOptions: (state) => state.localeOptions }, actions: { - async setLocale(newLocale: string) { - let matchingLocale = Object.keys(this.localeOptions).find((locale: string) => locale === newLocale) + async setLocale(locale: string) { + let matchingLocale = Object.keys(this.localeOptions).find((option: string) => option === locale) // If exact locale is not found, try to match the first two characters i.e primary code - matchingLocale = matchingLocale || Object.keys(this.localeOptions).find((locale: string) => locale.slice(0, 2) === newLocale.slice(0, 2)) - newLocale = matchingLocale || this.locale + matchingLocale = matchingLocale || Object.keys(this.localeOptions).find((option: string) => option.slice(0, 2) === locale.slice(0, 2)) + const newLocale = matchingLocale || this.locale try { // update locale in state and globally