import { useCookie } from "@/composable/useCookie"
import { useFetchJson } from "@/composable/useFetchJson"
import type { Country, Language } from "@/types"
import { reactive, ref } from "vue"

export const langs = reactive([] as Language[])
export const currentLang = ref<Language>()

export const countries = reactive([] as Country[])
export const currentCountry = ref<Country>()

const defLang = ref<Language>()
const defCountry = ref<Country>()
const cookie = useCookie()
// Get available language codes for route matching
// export const availableLocales = computed(() => langs.map((l) => l.lang_code))

// Initialize languages from API
export async function initLangs() {
  try {
    const { items } = await useFetchJson<Language[]>('/api/v1/langs')
    langs.push(...items)

    let idfromcookie = null
    const cc = cookie.getCookie('lang_id')
    if (cc) {
      idfromcookie = langs.find((x) => x.id == parseInt(cc))
    }
    defLang.value = items.find((x) => x.is_default == true)
    currentLang.value = idfromcookie ?? defLang.value
  } catch (error) {
    console.error('Failed to fetch languages:', error)
  }
}

// Initialize country/currency from API

export async function initCountryCurrency() {
  try {
    const { items } = await useFetchJson<Country[]>('/api/v1/restricted/langs-and-countries/get-countries')
    countries.push(...items)

    let idfromcookie = null
    const cc = cookie.getCookie('country_id')
    if (cc) {
      idfromcookie = langs.find((x) => x.id == parseInt(cc))
    }
    defCountry.value = items.find((x) => x.id === defLang.value?.id)
    currentCountry.value = idfromcookie ?? defCountry.value
  } catch (error) {
    console.error('Failed to fetch languages:', error)
  }
}

export async function switchLocalization() {
  try {
    await useFetchJson('/api/v1/public/auth/update-choice', {
      method: 'POST'
    })

  } catch (error) {
    console.log(error)
  }
}