// Dependencies
import React from 'react';

type FetchAsync<E> = () => Promise<E>;

export interface Fetch<E> {
  loading: boolean;
  error?: unknown;
  response?: E;
  fetch: () => void;
}

export function useFetch<T extends FetchAsync<E>, E>(callback: T, initValue?: E): Fetch<E> {
  const [response, setResponse] = React.useState<E | undefined>(initValue);
  const [loading, setLoading] = React.useState(false);
  const [error, setError] = React.useState(undefined);

  const fetcher = React.useCallback(() => {
    setLoading(true);
    callback()
      .then(setResponse)
      .catch(setError)
      .finally(() => setLoading(false));
  }, [callback]);
  React.useEffect(fetcher, [fetcher]);

  return { loading, error, response, fetch: fetcher };
}

type CallbackAsync = (...args: never[]) => Promise<unknown>;

export function useAsyncCallback<T extends CallbackAsync>(callback: T): [T, boolean, unknown] {
  const [loading, setLoading] = React.useState<boolean>(false);
  const [error, setError] = React.useState(undefined);
  const asyncCallback = React.useCallback((...args: never[]) => {
    setLoading(true);
    return callback(...args)
      .catch(setError)
      .finally(() => setLoading(false));
  }, [callback]);

  return [asyncCallback as T, loading, error];
}


export default useFetch;