fix en fallback if detected user locale is missing (#247)

This commit is contained in:
Henry Dollman
2024-11-03 11:59:49 -05:00
parent 3668aa4e8e
commit 6bb147c349

View File

@@ -1,29 +1,41 @@
import { $direction } from "./stores" import { $direction } from "./stores"
import { i18n } from "@lingui/core" import { i18n } from "@lingui/core"
import type { Messages } from "@lingui/core"
import languages from "@/lib/languages.json"
import { detect, fromUrl, fromStorage, fromNavigator } from "@lingui/detect-locale" import { detect, fromUrl, fromStorage, fromNavigator } from "@lingui/detect-locale"
import { messages as enMessages } from "../locales/en/en.ts" import { messages as enMessages } from "../locales/en/en.ts"
// const locale = detect(fromUrl("lang"), fromStorage("lang"), fromNavigator(), "en") console.log(languages)
const locale = detect(fromStorage("lang"), fromNavigator(), "en")
// let locale = detect(fromUrl("lang"), fromStorage("lang"), fromNavigator(), "en")
let locale = detect(fromStorage("lang"), fromNavigator(), "en")
// log if dev // log if dev
if (import.meta.env.DEV) { if (import.meta.env.DEV) {
console.log("detected locale", locale) console.log("detected locale", locale)
} }
export async function dynamicActivate(locale: string) { // activates locale
try { function activateLocale(locale: string, messages: Messages = enMessages) {
const { messages } = await import(`../locales/${locale}/${locale}.ts`)
i18n.load(locale, messages) i18n.load(locale, messages)
i18n.activate(locale) i18n.activate(locale)
document.documentElement.lang = locale document.documentElement.lang = locale
$direction.set(locale.startsWith("ar") ? "rtl" : "ltr") $direction.set(locale.startsWith("ar") ? "rtl" : "ltr")
}
// dynamically loads translations for the given locale
export async function dynamicActivate(locale: string) {
try {
const { messages }: { messages: Messages } = await import(`../locales/${locale}/${locale}.ts`)
activateLocale(locale, messages)
localStorage.setItem("lang", locale) localStorage.setItem("lang", locale)
} catch (error) { } catch (error) {
console.error(`Error loading ${locale}`, error) console.error(`Error loading ${locale}`, error)
activateLocale("en")
} }
} }
// handle zh variants
if (locale?.startsWith("zh-")) { if (locale?.startsWith("zh-")) {
// map zh variants to zh-CN // map zh variants to zh-CN
const zhVariantMap: Record<string, string> = { const zhVariantMap: Record<string, string> = {
@@ -38,9 +50,17 @@ if (locale?.startsWith("zh-")) {
"zh-Hant": "zh-HK", "zh-Hant": "zh-HK",
} }
dynamicActivate(zhVariantMap[locale] || "zh-CN") dynamicActivate(zhVariantMap[locale] || "zh-CN")
} else if (locale && !locale.startsWith("en")) {
dynamicActivate(locale.split("-")[0])
} else { } else {
i18n.load("en", enMessages) locale = (locale || "en").split("-")[0]
i18n.activate("en") // use en if locale is not in languages
if (!languages.some((l) => l.lang === locale)) {
locale = "en"
}
// handle non-english locales
if (locale !== "en") {
dynamicActivate(locale)
} else {
// fallback to en
activateLocale("en")
}
} }