nuxt4-demo/app/composables/useGlobalConfig.ts

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

export type GlobalConfig = {
  siteName: string
  allowRegister: boolean
  commentEmailNotifyEnabled: boolean
  commentMailFromEmail: string
  commentSmtpHost: string
  commentSmtpPort: number
  commentSmtpSecure: boolean
  commentSmtpUser: string
  commentSmtpPass: string
}

type GlobalConfigResult = {
  config: Partial<GlobalConfig>
}

const DEFAULT_GLOBAL_CONFIG: GlobalConfig = {
  siteName: 'Person Panel',
  allowRegister: true,
  commentEmailNotifyEnabled: false,
  commentMailFromEmail: '',
  commentSmtpHost: '',
  commentSmtpPort: 465,
  commentSmtpSecure: true,
  commentSmtpUser: '',
  commentSmtpPass: '',
}

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
    }),
    allowRegister: computed(() => config.value.allowRegister),
    pending,
    error,
    refresh,
  }
}