diff --git a/js/src/components/Footer.vue b/js/src/components/Footer.vue index cf75d41d9..29415d963 100644 --- a/js/src/components/Footer.vue +++ b/js/src/components/Footer.vue @@ -88,6 +88,7 @@ export default class Footer extends Vue { // eslint-disable-next-line class-methods-use-this async updateLocale(locale: string): Promise { if (locale) { + console.debug("Setting locale from footer"); await loadLanguageAsync(locale); saveLocaleData(locale); } diff --git a/js/src/components/NavBar.vue b/js/src/components/NavBar.vue index 938e90250..44a892aef 100644 --- a/js/src/components/NavBar.vue +++ b/js/src/components/NavBar.vue @@ -258,13 +258,17 @@ export default class NavBar extends Vue { // If we don't have any identities, the user has validated their account, // is logging for the first time but didn't create an identity somehow if (this.identities.length === 0) { - await this.$router.push({ - name: RouteName.REGISTER_PROFILE, - params: { - email: this.currentUser.email, - userAlreadyActivated: "true", - }, - }); + try { + await this.$router.push({ + name: RouteName.REGISTER_PROFILE, + params: { + email: this.currentUser.email, + userAlreadyActivated: "true", + }, + }); + } catch (err) { + return undefined; + } } } } @@ -272,6 +276,7 @@ export default class NavBar extends Vue { @Watch("loggedUser") setSavedLanguage(): void { if (this.loggedUser?.locale) { + console.debug("Setting locale from navbar"); loadLanguageAsync(this.loggedUser.locale); } } diff --git a/js/src/utils/i18n.ts b/js/src/utils/i18n.ts index ba6066a04..01c003f09 100644 --- a/js/src/utils/i18n.ts +++ b/js/src/utils/i18n.ts @@ -8,8 +8,18 @@ import pluralizationRules from "../i18n/pluralRules"; const DEFAULT_LOCALE = "en_US"; +const localeInLocalStorage = getLocaleData(); + +console.debug("localeInLocalStorage", localeInLocalStorage); + let language = - getLocaleData() || (document.documentElement.getAttribute("lang") as string); + localeInLocalStorage || + (document.documentElement.getAttribute("lang") as string); + +console.debug( + "localeInLocalStorage or fallback to lang html attribute", + language +); language = language || @@ -18,11 +28,15 @@ language = "_" ); +console.debug("language or fallback to window.navigator language", language); + export const locale = language && Object.prototype.hasOwnProperty.call(langs, language) ? language : language.split("-")[0]; +console.debug("chosen locale", locale); + Vue.use(VueI18n); export const i18n = new VueI18n({ @@ -35,9 +49,12 @@ export const i18n = new VueI18n({ pluralizationRules, }); +console.debug("set VueI18n with default locale", DEFAULT_LOCALE); + const loadedLanguages = [DEFAULT_LOCALE]; function setI18nLanguage(lang: string): string { + console.debug("setting i18n locale to", lang); i18n.locale = lang; setLanguageInDOM(lang); return lang; @@ -80,14 +97,17 @@ Vue.use(DateFnsPlugin, { locale: dateFnsfileForLanguage(locale) }); export async function loadLanguageAsync(lang: string): Promise { // If the same language if (i18n.locale === lang) { + console.debug("already using language", lang); return Promise.resolve(setI18nLanguage(lang)); } // If the language was already loaded if (loadedLanguages.includes(lang)) { + console.debug("language already loaded", lang); return Promise.resolve(setI18nLanguage(lang)); } // If the language hasn't been loaded yet + console.debug("loading language", lang); const newMessages = await import( /* webpackChunkName: "lang-[request]" */ `@/i18n/${vueI18NfileForLanguage( lang @@ -98,7 +118,9 @@ export async function loadLanguageAsync(lang: string): Promise { return setI18nLanguage(lang); } +console.debug("loading async locale", locale); loadLanguageAsync(locale); +console.debug("loaded async locale", locale); export function formatList(list: string[]): string { if (window.Intl && Intl.ListFormat) { diff --git a/js/src/views/User/ProviderValidation.vue b/js/src/views/User/ProviderValidation.vue index 3be85397d..8e84167c4 100644 --- a/js/src/views/User/ProviderValidation.vue +++ b/js/src/views/User/ProviderValidation.vue @@ -1,3 +1,6 @@ +