"use client";

// React Query는 브라우저 캐시를 다루므로 클라이언트 컴포넌트에서 사용합니다.

import { useQuery } from "@tanstack/react-query"; // 서버 상태를 캐싱/동기화하는 훅입니다.
import { getUsers } from "@/features/react-query-demo/api/userApi"; // 실제 API 호출 함수입니다.
import { User } from "@/features/react-query-demo/types"; // 타입 안정성을 위한 User 타입입니다.
import { userKeys } from "@/features/react-query-demo/api/queryKeys"; // 캐시 키 설계 규칙을 모은 객체입니다.

/**
 * useUsers
 * @description 사용자 목록을 가져오는 React Query 훅입니다.
 * @returns 사용자 목록과 상태(isLoading/isError 등)를 반환합니다.
 */
export function useUsers() {
  return useQuery<User[]>({
    // queryKey는 캐싱의 기준이므로 목록용 키를 명확히 분리합니다.
    queryKey: userKeys.lists(),
    // queryFn은 실제 데이터를 가져오는 함수입니다.
    queryFn: getUsers,
    // 목록 데이터는 1분 동안 신선하다고 보고 재요청을 줄입니다.
    staleTime: 1000 * 60 * 1,
    // 창 포커스 복귀 시 자동 재요청을 끕니다(학습용으로 흐름을 단순화).
    refetchOnWindowFocus: false,
    // 네트워크 오류 시 한 번만 재시도합니다.
    retry: 1,
  });
}