shopify-app-template/web/client/src/i18n.js
2025-07-25 21:05:50 +02:00

96 lines
2.7 KiB
JavaScript

import { nextTick } from 'vue'
import { createI18n } from 'vue-i18n'
import en from '@/locales/en.json'
import fr from '@/locales/fr.json'
import es from '@/locales/es.json'
import de from '@/locales/de.json'
import it from '@/locales/it.json'
export const APP_LOCALES = [
{ code: 'en', name: 'English' },
{ code: 'fr', name: 'Français' },
{ code: 'es', name: 'Español' },
{ code: 'de', name: 'Deutsch' },
{ code: 'it', name: 'Italiano' }
]
export function setupI18n(options = { locale: 'en' }) {
const i18n = createI18n(options)
setI18nLanguage(i18n, options.locale)
return i18n
}
export function getI18nLanguage(i18n) {
return i18n.mode === 'legacy' ? i18n.global.locale : i18n.global.locale.value
}
export function setI18nLanguage(i18n, locale) {
if (i18n.mode === 'legacy') {
i18n.global.locale = locale
} else {
i18n.global.locale.value = locale
}
/**
* NOTE:
* If you need to specify the language setting for headers, such as the `useAuthenticatedfetch`, set it here.
*/
document.querySelector('html').setAttribute('lang', locale)
localStorage.setItem('skape-carousel-locale', locale)
}
export async function loadLocaleMessages(i18n, locale) {
// load locale messages with dynamic import
const messages = await import(`./locales/${locale}.json`)
// set locale and locale message
i18n.global.setLocaleMessage(locale, messages.default)
return await nextTick()
}
/**
* Normalize a locale string to its base language code (e.g., 'en-US' -> 'en').
* Handles invalid or unexpected input gracefully.
*
* @param {string} locale - The locale string to normalize.
* @returns {string} - The normalized base language code (e.g., 'en'), or a default ('en') if input is invalid.
*/
export function normalizeLocale(locale) {
if (typeof locale !== 'string' || locale.trim() === '') {
console.warn('Invalid locale provided, defaulting to "en".')
return 'en' // Default fallback
}
const parts = locale.split('-')
const baseLocale = parts[0]?.trim().toLowerCase()
if (!baseLocale || baseLocale.length < 2 || baseLocale.length > 3) {
console.warn(`Unexpected locale format: "${locale}", defaulting to "en".`)
return 'en' // Default fallback
}
return baseLocale
}
export const i18n = setupI18n({
// locale: new URLSearchParams(window.location.search).get('locale') || 'en',
locale: localStorage.getItem('skape-carousel-locale') || 'en',
messages: {
en,
fr,
es,
de,
it
},
fallbackLocale: 'en',
legacy: false
})
// Export raw translations for AppProvider
export const messageFr = fr
export const messageEn = en
export const messageEs = es
export const messageDe = de
export const messageIt = it