w-aura/src/locales/index.ts

import { Translation } from '@/api/resources/Translations.ts'
import { createApi, Translations } from '../api'
import dev from './dev.ts'
import locales from './locales.ts'
import { Currency } from '@/components/PaymentTable/Price.ts'
import { symbolByCurrency } from './currency.ts'

// export const getClientLocale = () => {
//   return navigator.language
// }
export const getClientLocale = async () => {
  const urlParams = new URLSearchParams(document.location.search);
  const languageFromUrl = urlParams.get('lg');
  const languageUrlFromStore = localStorage.getItem("languageFromUrl")

  if (languageFromUrl?.length) {
    localStorage.setItem("languageFromUrl", languageFromUrl)
    return languageFromUrl;
  }

  if (languageUrlFromStore?.length) {
    return languageUrlFromStore;
  }

  const api = createApi();
  try {
    const resp = await api.getLocale(undefined)
    if (resp?.error || !resp?.languages?.length) {
      return navigator.language
    }
    if (resp.country_code === "IN") {
      return "hi"
    }
    return resp.languages.split(',')[0]
  } catch (error) {
    return navigator.language
  }
}

export const getClientTimezone = () => Intl.DateTimeFormat().resolvedOptions().timeZone
export const fallbackLng = 'en'
export let language: string = fallbackLng;

export const setLanguage = async () => {
  language = await getClientLocale();
};

const omitKeys = ['href', 'title', 'url_slug', 'type']
// const isWeb = (group: Elements.ElementGroup) => group.name === 'web'
const cleanUp = (translation: Partial<Translation[]> = []) => {
  return translation
    .filter((trans) => !omitKeys.includes(trans?.key || ''))
    .reduce((acc, trans) => ({ ...acc, [trans?.key || '']: trans?.value || '' }), {})
}

export const getDefaultLocaleByLanguage = (locale: string) => {
  const language = locale.split('-')[0];
  if (locale in locales) {
    return locale;
  }
  if (language in locales) {
    return language;
  }
  return fallbackLng;
}

export enum ELocalesPlacement {
  V0 = "v0", // Main site version
  V1 = "v1",
  PalmistryV0 = "palmistry-v0",
  PalmistryV01 = "palmistry-v0_1",
  PalmistryV1 = "palmistry-v1",
}

interface ITranslationJSON {
  male: { [key: string]: string }
  female: { [key: string]: string }
  default: { [key: string]: string }
  fallback: { male: { [key: string]: string }; female: { [key: string]: string }, default: { [key: string]: string } }
}

export type TTranslationPlacements = Partial<
  Record<ELocalesPlacement, ITranslationJSON>
>

export const getTranslationJSON = async (placement: ELocalesPlacement | undefined, language: string): Promise<ITranslationJSON> => {
  const protocol = window.location.protocol;
  const host = window.location.host;
  let defaultLanguage = getDefaultLocaleByLanguage(language).toLowerCase();
  if (defaultLanguage === "pt") {
    defaultLanguage = "pt-pt"
  }
  const localePlacement = placement || ELocalesPlacement.V1
  let result;
  try {
    const [
      resultMale,
      resultFemale,
      resultMaleFallback,
      resultFemaleFallback,
    ] = await Promise.all([
      (await fetch(`${protocol}//${host}/locales/${localePlacement}/${defaultLanguage}/male_${defaultLanguage}.json`)).json(),
      (await fetch(`${protocol}//${host}/locales/${localePlacement}/${defaultLanguage}/female_${defaultLanguage}.json`)).json(),
      (await fetch(`${protocol}//${host}/locales/${localePlacement}/en/male_en.json`)).json(),
      (await fetch(`${protocol}//${host}/locales/${localePlacement}/en/female_en.json`)).json()
    ]);

    result = {
      male: resultMale, female: resultFemale, default: resultMale, fallback: {
        male: resultMaleFallback, female: resultFemaleFallback, default: resultMaleFallback
      }
    }
  } catch (error) {
    if (language !== fallbackLng) {
      result = await getTranslationJSON(localePlacement, fallbackLng)
    }
    result = {
      male: {}, female: {}, default: {}, fallback: {
        male: {}, female: {}, default: {}
      }
    }
  }
  return result;
}

export const buildResources = (resp: Translations.Response, translationJSON: TTranslationPlacements) => {
  const element = resp.translations
  const translation = cleanUp(element)
  return {
    [getDefaultLocaleByLanguage(language)]: {
      translation: {
        ...translation, ...dev.translation, translationJSON
      }
    },
  }
}

export const addCurrency = (price: number | string, currency: Currency) => {
  const symbol = symbolByCurrency[currency]
  if ([Currency.EUR].includes(currency)) {
    return `${price} ${symbol}`
  }
  return `${symbol}${price}`
}