44 lines
1.2 KiB
TypeScript
44 lines
1.2 KiB
TypeScript
|
import { useEffect, useLayoutEffect, useRef } from "react";
|
||
|
|
import { User } from "../model/user";
|
||
|
|
import { devlog } from "../utils/devlog";
|
||
|
|
import { makeRequest } from "../api/makeRequest";
|
||
|
|
|
||
|
|
|
||
|
|
export function useUserFetcher({ onError, onNewUser, url, userId }: {
|
||
|
|
url: string;
|
||
|
|
userId: string | null;
|
||
|
|
onNewUser: (response: User) => void;
|
||
|
|
onError?: (error: any) => void;
|
||
|
|
}) {
|
||
|
|
const onNewUserRef = useRef(onNewUser);
|
||
|
|
const onErrorRef = useRef(onError);
|
||
|
|
|
||
|
|
useLayoutEffect(() => {
|
||
|
|
onNewUserRef.current = onNewUser;
|
||
|
|
onErrorRef.current = onError;
|
||
|
|
}, [onError, onNewUser]);
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
if (!userId) return;
|
||
|
|
|
||
|
|
const controller = new AbortController();
|
||
|
|
|
||
|
|
makeRequest<never, User>({
|
||
|
|
url,
|
||
|
|
contentType: true,
|
||
|
|
method: "GET",
|
||
|
|
useToken: true,
|
||
|
|
withCredentials: false,
|
||
|
|
signal: controller.signal,
|
||
|
|
}).then(result => {
|
||
|
|
devlog("User", result);
|
||
|
|
onNewUserRef.current(result);
|
||
|
|
}).catch(error => {
|
||
|
|
devlog("Error fetching user", error);
|
||
|
|
onErrorRef.current?.(error);
|
||
|
|
});
|
||
|
|
|
||
|
|
return () => controller.abort();
|
||
|
|
}, [url, userId]);
|
||
|
|
}
|