import { request, unwrapApiBody, type ApiResponse } from '../utils/http/factory'

export type GlobalConfig = {
  siteName: string
  allowRegister: boolean
  siteIcon: string
}

type GlobalConfigResult = {
  config: Partial<GlobalConfig>
}

const DEFAULT_GLOBAL_CONFIG: GlobalConfig = {
  siteName: 'My Small Site',
  allowRegister: true,
  siteIcon: '',
}

export function useGlobalConfig() {
  const { data, pending, error, refresh } = useAsyncData(
    'global:config',
    async () => {
      const payload = await request<ApiResponse<GlobalConfigResult>>('/api/config/global')
      const config = unwrapApiBody(payload).config ?? {}
      return {
        ...DEFAULT_GLOBAL_CONFIG,
        ...config,
      }
    },
    {
      default: () => ({ ...DEFAULT_GLOBAL_CONFIG }),
    },
  )

  const config = computed<GlobalConfig>(() => data.value ?? DEFAULT_GLOBAL_CONFIG)

  return {
    config,
    siteName: computed(() => {
      const n = config.value.siteName?.trim()
      return n && n.length > 0 ? n : DEFAULT_GLOBAL_CONFIG.siteName
    }),
    siteIcon: computed(() => {
      const v = config.value.siteIcon?.trim()
      return v || ''
    }),
    pending,
    error,
    refresh,
  }
}