fix(gantt): useDayjsLanguageSync and move to separate file
This commit is contained in:
parent
b4f88bd4a6
commit
d8d3e4c8a6
@ -22,10 +22,6 @@ export const DEFAULT_LANGUAGE: SupportedLocale= 'en'
|
||||
|
||||
export type ISOLanguage = string
|
||||
|
||||
export const DAYJS_LOCALE_MAPPING = {
|
||||
'de-swiss': 'de-AT',
|
||||
} as Record<SupportedLocale, ISOLanguage>
|
||||
|
||||
export const i18n = createI18n({
|
||||
locale: DEFAULT_LANGUAGE, // set locale
|
||||
fallbackLocale: DEFAULT_LANGUAGE,
|
||||
@ -86,34 +82,3 @@ export function saveLanguage(lang: SupportedLocale) {
|
||||
export function setLanguage() {
|
||||
return loadLanguageAsync(getCurrentLanguage())
|
||||
}
|
||||
|
||||
// FIXME: This function is not used at the moment because it does not seem to work.
|
||||
// It should be reworked and cleaned up. An even better way would be to get rid of
|
||||
// this completely by using date-fns for everything.
|
||||
// export function useDayjsLanguageSync(dayjsGlobal: typeof dayjs) {
|
||||
// const dayjsLanguageLoaded = ref(false)
|
||||
// watch(
|
||||
// () => i18n.global.locale,
|
||||
// async (currentLanguage: string) => {
|
||||
// if (!dayjsGlobal) {
|
||||
// return
|
||||
// }
|
||||
// const dayjsLanguageCode = DAYJS_LOCALE_MAPPING[currentLanguage.toLowerCase()] || currentLanguage.toLowerCase()
|
||||
// dayjsLanguageLoaded.value = dayjsGlobal.locale() === dayjsLanguageCode
|
||||
// if (dayjsLanguageLoaded.value) {
|
||||
// return
|
||||
// }
|
||||
// console.log('foo')
|
||||
// await import(`../../node_modules/dayjs/locale/${dayjsLanguageCode}.js`)
|
||||
// console.log('bar')
|
||||
// dayjsGlobal.locale(dayjsLanguageCode)
|
||||
// dayjsLanguageLoaded.value = true
|
||||
// },
|
||||
// {immediate: true},
|
||||
// )
|
||||
//
|
||||
// // we export the loading state since that's easier to work with
|
||||
// const isLoading = computed(() => !dayjsLanguageLoaded.value)
|
||||
//
|
||||
// return isLoading
|
||||
// }
|
||||
|
60
src/i18n/useDayjsLanguageSync.ts
Normal file
60
src/i18n/useDayjsLanguageSync.ts
Normal file
@ -0,0 +1,60 @@
|
||||
import {computed, ref, watch} from 'vue'
|
||||
import type dayjs from 'dayjs'
|
||||
import type ILocale from 'dayjs/locale/*'
|
||||
|
||||
import {i18n, type SupportedLocale, type ISOLanguage} from '@/i18n'
|
||||
|
||||
export const DAYJS_LOCALE_MAPPING = {
|
||||
'de-de': 'de',
|
||||
'de-swiss': 'de-at',
|
||||
'ru-ru': 'ru',
|
||||
'fr-fr': 'fr',
|
||||
'vi-vn': 'vi',
|
||||
'it-it': 'it',
|
||||
'cs-cz': 'cs',
|
||||
'pl-pl': 'pl',
|
||||
'nl-nl': 'nl',
|
||||
'pt-pt': 'pt',
|
||||
'zh-cn': 'zh-cn',
|
||||
} as Record<SupportedLocale, ISOLanguage>
|
||||
|
||||
export const DAYJS_LANGUAGE_IMPORTS = {
|
||||
'de-de': () => import('dayjs/locale/de'),
|
||||
'de-swiss': () => import('dayjs/locale/de-at'),
|
||||
'ru-ru': () => import('dayjs/locale/ru'),
|
||||
'fr-fr': () => import('dayjs/locale/fr'),
|
||||
'vi-vn': () => import('dayjs/locale/vi'),
|
||||
'it-it': () => import('dayjs/locale/it'),
|
||||
'cs-cz': () => import('dayjs/locale/cs'),
|
||||
'pl-pl': () => import('dayjs/locale/pl'),
|
||||
'nl-nl': () => import('dayjs/locale/nl'),
|
||||
'pt-pt': () => import('dayjs/locale/pt'),
|
||||
'zh-cn': () => import('dayjs/locale/zh-cn'),
|
||||
} as Record<SupportedLocale, () => Promise<ILocale>>
|
||||
|
||||
export function useDayjsLanguageSync(dayjsGlobal: typeof dayjs) {
|
||||
|
||||
const dayjsLanguageLoaded = ref(false)
|
||||
watch(
|
||||
() => i18n.global.locale,
|
||||
async (currentLanguage: string) => {
|
||||
if (!dayjsGlobal) {
|
||||
return
|
||||
}
|
||||
const dayjsLanguageCode = DAYJS_LOCALE_MAPPING[currentLanguage.toLowerCase()] || currentLanguage.toLowerCase()
|
||||
dayjsLanguageLoaded.value = dayjsGlobal.locale() === dayjsLanguageCode
|
||||
if (dayjsLanguageLoaded.value) {
|
||||
return
|
||||
}
|
||||
await DAYJS_LANGUAGE_IMPORTS[currentLanguage.toLowerCase()]()
|
||||
dayjsGlobal.locale(dayjsLanguageCode)
|
||||
dayjsLanguageLoaded.value = true
|
||||
},
|
||||
{immediate: true},
|
||||
)
|
||||
|
||||
// we export the loading state since that's easier to work with
|
||||
const isLoading = computed(() => !dayjsLanguageLoaded.value)
|
||||
|
||||
return isLoading
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user