Files
your-gold/plugins/i18n.ts
2025-06-25 15:55:50 +02:00

139 lines
3.4 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 = reactive({} 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
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() {
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 = data;
this.currentCountryIso.value = this.cookieData.country.iso_code
this.currentLanguageIso.value = this.cookieData.language.iso_code
this.currentCurrencyIso.value = this.cookieData.currency.iso_code
}
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")
}
}
}
let session = {} as Session;
export const useSession = () => session;
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 (oldLocale, newLocale) => {
if (import.meta.browser) {
session.setLanguage(newLocale)
await session.loadSession()
}
if (loaded.includes(newLocale)) return;
try {
const { data } = await useMyFetch<GenericResponse<object>>(
"/api/public/front/translation"
);
i18n.setLocaleMessage(newLocale, data);
loaded.push(newLocale);
} catch (err) {
console.error("❌ Failed to load translation for locale:", newLocale);
throw err;
}
};
session = new Session(i18n, router)
await session.loadSession();
nuxtApp.vueApp.provide("session", session);
});