feat: React Query 사용자 정보 조회 훅 추가
- use-user-query.ts 생성 - Supabase 인증 사용자 정보 자동 캐싱 및 재검증
This commit is contained in:
42
hooks/queries/use-user-query.ts
Normal file
42
hooks/queries/use-user-query.ts
Normal file
@@ -0,0 +1,42 @@
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import { createClient } from "@/utils/supabase/client";
|
||||
|
||||
/**
|
||||
* [사용자 정보 조회 쿼리]
|
||||
*
|
||||
* 현재 로그인한 사용자의 정보를 조회합니다.
|
||||
* - 자동 캐싱 및 재검증
|
||||
* - 로딩/에러 상태 자동 관리
|
||||
*
|
||||
* @example
|
||||
* ```tsx
|
||||
* import { useUserQuery } from '@/hooks/queries/use-user-query';
|
||||
*
|
||||
* function Profile() {
|
||||
* const { data: user, isLoading, error } = useUserQuery();
|
||||
*
|
||||
* if (isLoading) return <div>Loading...</div>;
|
||||
* if (error) return <div>Error: {error.message}</div>;
|
||||
* if (!user) return <div>Not logged in</div>;
|
||||
*
|
||||
* return <div>Welcome, {user.email}</div>;
|
||||
* }
|
||||
* ```
|
||||
*/
|
||||
export function useUserQuery() {
|
||||
return useQuery({
|
||||
queryKey: ["user"],
|
||||
queryFn: async () => {
|
||||
const supabase = createClient();
|
||||
const {
|
||||
data: { user },
|
||||
error,
|
||||
} = await supabase.auth.getUser();
|
||||
|
||||
if (error) throw error;
|
||||
return user;
|
||||
},
|
||||
staleTime: 5 * 60 * 1000, // 5분 - 사용자 정보는 자주 변경되지 않음
|
||||
retry: 1,
|
||||
});
|
||||
}
|
||||
Reference in New Issue
Block a user