diff --git a/src/components/ProfilePicture.tsx b/src/components/ProfilePicture.tsx index 8313212..6981867 100644 --- a/src/components/ProfilePicture.tsx +++ b/src/components/ProfilePicture.tsx @@ -9,8 +9,8 @@ export default function ProfilePicture({ return (
- {userData?.profile_image_url ? ( - + {userData.data?.profile_image_url ? ( + ) : (
)} diff --git a/src/hooks/useGetProfile.ts b/src/hooks/useGetProfile.ts index 8dbd1e7..23b486d 100644 --- a/src/hooks/useGetProfile.ts +++ b/src/hooks/useGetProfile.ts @@ -1,35 +1,16 @@ -import { useContext, useEffect, useState } from "react"; +import { useContext } from "react"; import { AuthStateContext } from "../contexts/auth-state/AuthStateContext"; -import { getUser, type UserData } from "../utils/api/getUser"; - -const usersData = new Map(); +import { getUser } from "../utils/api/getUser"; +import { useQuery } from "@tanstack/react-query"; export function useGetProfile(login: string) { const authStateContext = useContext(AuthStateContext); const authState = authStateContext?.authState; - const [userProfile, setUserProfile] = useState(() => - usersData.get(login) - ); - - useEffect(() => { - if (usersData.has(login)) { - return; - } - - if (!authState) { - return; - } - - getUser(authState.token.value, authState.client.id, login) - .then((data) => { - usersData.set(login, data); - setUserProfile(() => data); - }) - .catch((error: unknown) => { - console.error("UserProfile:", error); - }); - }, [authState, login]); - - return userProfile; + return useQuery({ + enabled: !!authState, + queryKey: ["userProfilePicture", login], + // eslint-disable-next-line @typescript-eslint/no-non-null-assertion + queryFn: () => getUser(authState!.token.value, authState!.client.id, login), + }); }