UIKit/lib/hooks/useUserAccountFetcher.ts

import { isAxiosError } from "axios";
import { useEffect, useLayoutEffect, useRef } from "react";
import { UserAccount } from "../model/account";
import { makeRequest } from "../api/makeRequest";
import { devlog } from "../utils/devlog";
import { createUserAccount } from "../api/account";


export function useUserAccountFetcher<T = UserAccount>({ onError, onNewUserAccount, versionOfCustomer="v1.0.0", url, userId }: {
    url: string;
    userId: string | null;
    versionOfCustomer?: string;
    onNewUserAccount: (response: T) => void;
    onError?: (error: any) => void;
}) {
    const onNewUserAccountRef = useRef(onNewUserAccount);
    const onErrorRef = useRef(onError);

    useLayoutEffect(() => {
        onNewUserAccountRef.current = onNewUserAccount;
        onErrorRef.current = onError;
    }, [onError, onNewUserAccount]);

    useEffect(() => {
        if (!userId) return;

        const controller = new AbortController();
        makeRequest<never, T>({
            url,
            contentType: true,
            method: "GET",
            useToken: true,
            withCredentials: false,
            signal: controller.signal,
        }).then(result => {
            devlog("User account", result);
            onNewUserAccountRef.current(result);
        }).catch(error => {
            devlog("Error fetching user account", error);
            if (isAxiosError(error) && error.response?.status === 404) {
                createUserAccount(controller.signal, url, versionOfCustomer).then(result => {
                    devlog("Created user account", result);
                    onNewUserAccountRef.current(result as T);
                }).catch(error => {
                    devlog("Error creating user account", error);
                    onErrorRef.current?.(error);
                });
            } else {
                onErrorRef.current?.(error);
            }
        });

        return () => controller.abort();
    }, [url, userId]);
}