bio_frontend/composables/useApi.ts

/**
 * API 호출을 위한 편의 함수
 *
 * @template T - 응답 데이터의 타입
 * @param path - API 엔드포인트 경로 (예: '/users', '/users/1')
 * @param options - 요청 및 에러 처리 옵션
 * @returns Promise<T> - API 응답 데이터
 *
 * @example
 * // GET 요청 (기본)
 * const users = await useApi<User[]>('/users')
 *
 * // POST 요청
 * const newUser = await useApi<User>('/users', {
 *   method: 'POST',
 *   body: { name: 'John', email: 'john@example.com' }
 * })
 *
 * // 에러 시 alert 표시
 * const data = await useApi<User[]>('/users', { showAlert: true })
 *
 * // 에러를 직접 처리
 * try {
 *   const data = await useApi<User[]>('/users', { handleError: false })
 * } catch (error) {
 *   // 직접 에러 처리
 * }
 *
 * // FormData 업로드
 * const formData = new FormData()
 * formData.append('file', file)
 * await useApi('/upload', { method: 'POST', body: formData })
 */
export const useApi = async <T>(
  path: string,
  options?: {
    // API 요청 옵션
    method?: string;
    body?: any;
    headers?: Record<string, string>;
    // 에러 처리 옵션
    handleError?: boolean; // true: 에러를 null로 반환, false: 에러를 다시 던짐
    showAlert?: boolean; // true: 에러 시 alert 표시
  }
): Promise<T> => {
  const { $api } = useNuxtApp();

  // 기본값 설정
  const {
    method = "GET",
    body,
    headers,
    handleError = true,
    showAlert = true,
  } = options || {};

  // API 요청 옵션 구성
  const apiOpts = {
    method,
    ...(body && { body }),
    ...(headers && { headers }),
  };

  return ($api as any)(path, apiOpts).catch((error: any) => {
    // 사용자에게 알림 표시
    if (showAlert) {
      const status = error.response?.status;
      let message =
        status === 404
          ? "요청한 리소스를 찾을 수 없습니다."
          : status === 500
            ? "서버 오류가 발생했습니다."
            : "요청 처리 중 오류가 발생했습니다.";

      // 서버에서 온 에러 메시지가 있으면 우선 사용
      if (error.response?._data?.description) {
        message = error.response._data.description;
      }

      alert(message);
    }

    // 에러 처리 방식에 따라 반환
    if (handleError) {
      return null as T; // 에러를 null로 반환
    } else {
      throw error; // 에러를 다시 던짐
    }
  });
};