Files
your-gold/plugins/01_i18n.ts
2025-07-03 11:13:42 +02:00

139 lines
3.5 KiB
TypeScript

import type { VueI18n } from 'vue-i18n'
import type { RouteLocation, Router } from 'vue-router'
import type { CookieData, GenericResponse } from '~/types'
// Extend the NuxtApp type
declare module '#app' {
interface NuxtApp {
$session: Session
}
}
declare module 'vue' {
interface ComponentCustomProperties {
$session: Session
}
}
export class Session {
cookieData = ref({} as CookieData)
urlParams = new URLSearchParams()
currentLanguageIso = ref('' as string)
currentCountryIso = ref('' as string)
currentCurrencyIso = ref('' as string)
route = {} as RouteLocation
router = {} as Router
i18n = {} as VueI18n
sessionOngoing: boolean = false
constructor(i18n: VueI18n, router: Router) {
this.route = router.currentRoute.value
this.router = router
this.i18n = i18n
this.setLanguage(
this.route.query?.lang_iso
? (this.route.query?.lang_iso as string)
: unref(i18n.locale),
)
this.setCountry(
this.route.query?.country_iso
? (this.route.query?.country_iso as string)
: '',
)
this.setCurrency(
this.route.query?.currency_iso
? (this.route.query?.currency_iso as string)
: '',
)
}
async loadSession() {
if (this.sessionOngoing) return
this.sessionOngoing = true
this.setQueryParams()
const { data } = await useMyFetch<GenericResponse<CookieData>>(
`/api/public/cookie?${this.urlParams.toString()}`,
{
headers: {
'Content-Type': 'application/json',
},
onErrorOccured: (_, status) => {
throw new Error(`HTTP error: ${status}`)
},
},
)
this.cookieData.value = data
this.currentCountryIso.value = this.cookieData.value.country.iso_code
this.currentLanguageIso.value = this.cookieData.value.language.iso_code
this.currentCurrencyIso.value = this.cookieData.value.currency.iso_code
setTimeout(() => (this.sessionOngoing = false), 2000)
}
setLanguage(iso: string) {
this.currentLanguageIso.value = iso
}
setCurrency(iso: string) {
this.currentCurrencyIso.value = iso
}
setCountry(iso: string) {
this.currentCountryIso.value = iso
}
setQueryParams() {
if (this.currentLanguageIso.value.length > 0) {
this.urlParams.set('lang_iso', this.currentLanguageIso.value)
}
else {
this.urlParams.delete('lang_iso')
}
if (this.currentCountryIso.value.length > 0) {
this.urlParams.set('country_iso', this.currentCountryIso.value)
}
else {
this.urlParams.delete('country_iso')
}
if (this.currentCurrencyIso.value.length > 0) {
this.urlParams.set('currency_iso', this.currentCurrencyIso.value)
}
else {
this.urlParams.delete('currency_iso')
}
}
}
export default defineNuxtPlugin(async (nuxtApp) => {
const loaded = [] as Array<string>
const { $i18n: i18n } = nuxtApp as unknown as { $i18n: VueI18n }
const { $router: router } = nuxtApp as unknown as { $router: Router }
i18n.onBeforeLanguageSwitch = async (_, newLocale) => {
if (loaded.includes(newLocale)) return
try {
loaded.push(newLocale)
const { data } = await useMyFetch<GenericResponse<object>>(
'/api/public/front/translation',
)
i18n.setLocaleMessage(newLocale, data)
}
catch (err) {
console.error('❌ Failed to load translation for locale:', newLocale)
throw err
}
}
const session = new Session(i18n, router)
await session.loadSession()
nuxtApp.provide('session', session)
})