useLoadingIndicator

useLoadingIndicator.tsx

import { useState } from "react";

type FunctionArgs<T> = T extends (...args: infer Args) => unknown
  ? Args
  : never;

type FunctionReturn<T> = T extends (...args: unknown[]) => infer Return
  ? Return
  : never;

export const useLoadingIndicator = <
  TCallback extends (...args: never[]) => never | void
>(
  originFetcher: TCallback
) => {
  const [loading, setLoading] = useState(false);

  const fetcher = async (
    ...args: FunctionArgs<TCallback>
  ): Promise<FunctionReturn<TCallback>> => {
    setLoading(true);
    try {
      const result = (await originFetcher(
        ...args
      )) as unknown as FunctionReturn<TCallback>;
      setLoading(false);
      return result;
    } catch (e) {
      setLoading(false);
      throw e;
    }
  };

  return {
    fetcher,
    loading,
  };
};