gami-web/app/composables/useApi.ts

import { http } from '~/utils/request'

/**
 * API composable for making HTTP requests
 * Provides reactive state management for API calls
 */
export const useApi = () => {
  const loading = ref(false)
  const error = ref<string | null>(null)

  /**
   * Wrapper for making API requests with loading state
   */
  const request = async <T = unknown>(
    requestFn: () => Promise<T>,
  ): Promise<T | null> => {
    loading.value = true
    error.value = null

    try {
      const result = await requestFn()
      return result
    }
    catch (err: unknown) {
      const message = err instanceof Error ? err.message : 'Request failed'
      error.value = message
      console.error('API request error:', err)
      return null
    }
    finally {
      loading.value = false
    }
  }

  /**
   * GET request with loading state
   */
  const get = async <T = unknown>(
    url: string,
    params?: unknown,
  ): Promise<T | null> => {
    return request(() => http.get<T>(url, params))
  }

  /**
   * POST request with loading state
   */
  const post = async <T = unknown>(
    url: string,
    data?: unknown,
  ): Promise<T | null> => {
    return request(() => http.post<T>(url, data))
  }

  /**
   * PUT request with loading state
   */
  const put = async <T = unknown>(
    url: string,
    data?: unknown,
  ): Promise<T | null> => {
    return request(() => http.put<T>(url, data))
  }

  /**
   * DELETE request with loading state
   */
  const del = async <T = unknown>(
    url: string,
    params?: unknown,
  ): Promise<T | null> => {
    return request(() => http.delete<T>(url, params))
  }

  /**
   * PATCH request with loading state
   */
  const patch = async <T = unknown>(
    url: string,
    data?: unknown,
  ): Promise<T | null> => {
    return request(() => http.patch<T>(url, data))
  }

  return {
    loading: readonly(loading),
    error: readonly(error),
    request,
    get,
    post,
    put,
    delete: del,
    patch,
  }
}