diff --git a/frontend/src/main.js b/frontend/src/main.js index e78ab089..b9705843 100644 --- a/frontend/src/main.js +++ b/frontend/src/main.js @@ -15,9 +15,7 @@ const i18n = new VueI18n(); Vue.use(Buefy, {}); Vue.config.productionTip = false; -// Globals. -Vue.prototype.$utils = new Utils(i18n); -Vue.prototype.$api = api; + // Setup the router. router.beforeEach((to, from, next) => { @@ -30,12 +28,13 @@ router.beforeEach((to, from, next) => { router.afterEach((to) => { Vue.nextTick(() => { - const t = to.meta.title ? `${i18n.tc(to.meta.title, 0)} /` : ''; + const t = to.meta.title && i18n.te(to.meta.title) ? `${i18n.tc(to.meta.title, 0)} /` : ''; document.title = `${t} listmonk`; }); }); -new Vue({ + +const v = new Vue({ router, store, i18n, @@ -45,20 +44,28 @@ new Vue({ isLoaded: false, }, - methods: { - loadConfig() { - api.getServerConfig().then((data) => { - api.getLang(data.lang).then((lang) => { - i18n.locale = data.lang; - i18n.setLocaleMessage(i18n.locale, lang); - this.isLoaded = true; - }); - }); - }, + mounted() { + v.isLoaded = true; }, +}); - created() { - this.loadConfig(); - api.getSettings(); - }, -}).$mount('#app'); + +// Load server side config and language before mounting the app. +api.getServerConfig().then((data) => { + api.getLang(data.lang).then((lang) => { + i18n.locale = data.lang; + i18n.setLocaleMessage(i18n.locale, lang); + + Vue.prototype.$utils = new Utils(i18n); + Vue.prototype.$api = api; + + // Set the page title after i18n has loaded. + const to = router.history.current; + const t = to.meta.title ? `${i18n.tc(to.meta.title, 0)} /` : ''; + document.title = `${t} listmonk`; + + v.$mount('#app'); + }); +}); + +api.getSettings();