vikunja
/
frontend
Archived
6
39
Fork 49
Code Issues 1 Pull Requests 4 Projects Releases 26 Activity

fix(i18n): load language files before doing anything else #3218

Merged
konrad merged 2 commits from fix/load-language-files into main 2023-03-10 13:46:25 +00:00
Conversation 8 Commits 2 Files Changed 1 +59 -57
1 changed files with 59 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

116
src/main.ts
View File

@ -39,74 +39,76 @@ if (window.API_URL.slice(window.API_URL.length - 1, window.API_URL.length) === '
window.API_URL = window.API_URL.slice(0, window.API_URL.length - 1)
}
const app = createApp(App)
dpschen commented 2023-03-09 20:35:55 +00:00
Review
Copy Link

Would it work if we save the returned promise of setLanguage and load it in parallel to all the stuff until mounting the app?

const languageLoaded = setLanguage()
const app = createApp(App)

// [...]

languageLoaded.then(() => {
	app.mount('#app')
})
Would it work if we save the returned promise of `setLanguage` and load it in parallel to all the stuff until mounting the app? ```ts const languageLoaded = setLanguage() const app = createApp(App) // [...] languageLoaded.then(() => { app.mount('#app') }) ```
konrad commented 2023-03-09 20:50:42 +00:00
Review
Copy Link

That's how it is done right now, but that does not seem to work.

That's how it is done right now, but that does not seem to work.
konrad commented 2023-03-09 21:10:17 +00:00
Review
Copy Link

It looks like the language needs to be loaded before the Vue Lifecycle starts.

It looks like the language needs to be loaded before the Vue Lifecycle starts.
konrad commented 2023-03-10 13:45:10 +00:00
Review
Copy Link

Actually tried it again but even got an error here TypeError: route is undefined.

Actually tried it again but even got an error here `TypeError: route is undefined`.
dpschen commented 2023-03-10 14:17:17 +00:00
Review
Copy Link

That's weird. I just tried this myself and couldn't trigger that error.

That's weird. I just tried this myself and couldn't trigger that error.
app.use(Notifications)
// directives
import focus from '@/directives/focus'
import { VTooltip } from 'floating-vue'
import {VTooltip} from 'floating-vue'
import 'floating-vue/dist/style.css'
import shortcut from '@/directives/shortcut'
import cypress from '@/directives/cypress'
app.directive('focus', focus)
app.directive('tooltip', VTooltip)
app.directive('shortcut', shortcut)
app.directive('cy', cypress)
// global components
import FontAwesomeIcon from '@/components/misc/Icon'
import Button from '@/components/input/button.vue'
import Modal from '@/components/misc/modal.vue'
import Card from '@/components/misc/card.vue'
app.component('icon', FontAwesomeIcon)
app.component('x-button', Button)
app.component('modal', Modal)
app.component('card', Card)
app.config.errorHandler = (err, vm, info) => {
if (import.meta.env.DEV) {
console.error(err, vm, info)
}
error(err)
}
if (import.meta.env.DEV) {
app.config.warnHandler = (msg) => {
error(msg)
throw(msg)
}
// https://stackoverflow.com/a/52076738/15522256
window.addEventListener('error', (err) => {
error(err)
throw err
})
window.addEventListener('unhandledrejection', (err) => {
// event.promise contains the promise object
// event.reason contains the reason for the rejection
error(err)
throw err
})
}
app.config.globalProperties.$message = {
error,
success,
}
if (window.SENTRY_ENABLED) {
import('./sentry').then(sentry => sentry.default(app, router))
}
app.use(pinia)
app.use(router)
app.use(i18n)
// We're loading the language before creating the app so that it won't fail to load when the user's
// language file is not yet loaded.
setLanguage().then(() => {
const app = createApp(App)
app.use(Notifications)
app.directive('focus', focus)
app.directive('tooltip', VTooltip)
app.directive('shortcut', shortcut)
app.directive('cy', cypress)
app.component('icon', FontAwesomeIcon)
app.component('x-button', Button)
app.component('modal', Modal)
app.component('card', Card)
app.config.errorHandler = (err, vm, info) => {
if (import.meta.env.DEV) {
console.error(err, vm, info)
}
error(err)
}
if (import.meta.env.DEV) {
app.config.warnHandler = (msg) => {
error(msg)
throw(msg)
}
// https://stackoverflow.com/a/52076738/15522256
window.addEventListener('error', (err) => {
error(err)
throw err
})
window.addEventListener('unhandledrejection', (err) => {
// event.promise contains the promise object
// event.reason contains the reason for the rejection
error(err)
throw err
})
}
app.config.globalProperties.$message = {
error,
success,
}
if (window.SENTRY_ENABLED) {
import('./sentry').then(sentry => sentry.default(app, router))
}
app.use(pinia)
app.use(router)
app.use(i18n)
app.mount('#app')
})
})