import { ref } from 'vue'
import { defineStore } from 'pinia'
import { getSettings } from '@/api/configuration'

export interface AppSetting {
  id?: number
  key?: string | number
  title_fa?: string
  value?: string | number
  description?: string
  is_active?: boolean
  type?: string
}

export const useSettingsStore = defineStore('settings', () => {
  const settings = ref<AppSetting[]>([])
  const loaded = ref(false)
  let fetchPromise: Promise<AppSetting[]> | null = null

  function getSettingByKey(key: string) {
    const item = settings.value.find((setting) => setting?.key === key)
    return item?.value ?? null
  }

  async function fetchSettings(force = false) {
    if (!force && fetchPromise) {
      return fetchPromise
    }

    fetchPromise = (async () => {
      try {
        const data = await getSettings()
        if (Array.isArray(data)) {
          settings.value = data
        }
      } catch (error) {
        console.log(error)
      } finally {
        loaded.value = true
      }

      return settings.value
    })()

    return fetchPromise
  }

  return {
    settings,
    loaded,
    fetchSettings,
    getSettingByKey,
  }
})