kopia lustrzana https://dev.funkwhale.audio/funkwhale/funkwhale
66 wiersze
2.0 KiB
TypeScript
66 wiersze
2.0 KiB
TypeScript
import Vue from 'vue'
|
|
import GetText from 'vue-gettext'
|
|
import locales from '@/locales.json'
|
|
import { usePreferredLanguages } from '@vueuse/core'
|
|
import { watch } from '@vue/composition-api'
|
|
import { AppModule } from '@/types'
|
|
|
|
export const install: AppModule = ({ store, app }) => {
|
|
const defaultLanguage = store.state.ui.currentLanguage ?? 'en_US'
|
|
const availableLanguages = locales.reduce((map: { [key: string]: string }, locale) => {
|
|
map[locale.code] = locale.label
|
|
return map
|
|
}, {})
|
|
|
|
app.use(GetText, {
|
|
availableLanguages,
|
|
defaultLanguage,
|
|
|
|
// cf https://github.com/Polyconseil/vue-gettext#configuration
|
|
// not recommended but this is fixing weird bugs with translation nodes
|
|
// not being updated when in v-if/v-else clauses
|
|
autoAddKeyAttributes: true,
|
|
languageVmMixin: {
|
|
computed: {
|
|
currentKebabCase (): string {
|
|
// @ts-ignore
|
|
return this.current.toLowerCase().replace('_', '-')
|
|
}
|
|
}
|
|
},
|
|
translations: {},
|
|
silent: true
|
|
})
|
|
|
|
// Set default language
|
|
if (!store.state.ui.selectedLanguage) {
|
|
// NOTE: We're selecting the language only once, hence we don't need to make it reactive
|
|
const languages = usePreferredLanguages().value.map((code) => {
|
|
return code.replace(/-/g, '_')
|
|
})
|
|
|
|
let language = Object.keys(availableLanguages).find(code => {
|
|
return languages.includes(code)
|
|
})
|
|
|
|
if (!language) {
|
|
language = Object.keys(availableLanguages).find(code => {
|
|
return languages.map(lang => lang.split('_')[0]).includes(code.split('_')[0])
|
|
})
|
|
}
|
|
|
|
store.commit('ui/currentLanguage', language ?? defaultLanguage)
|
|
}
|
|
|
|
// Handle language change
|
|
watch(() => store.state.ui.currentLanguage, (locale) => {
|
|
const htmlLocale = locale.toLowerCase().replace('_', '-')
|
|
document.documentElement.setAttribute('lang', htmlLocale)
|
|
|
|
if (locale === 'en_US') {
|
|
Vue.config.language = locale
|
|
store.commit('ui/momentLocale', 'en')
|
|
}
|
|
}, { immediate: true })
|
|
}
|