import { useCallback, useEffect, useRef, useState } from 'react';
import { useAuth } from '../Auth';

function useFetchInternal<T = any>(axios: any, url: string|false|null|undefined, params:any = null, body:any = null): [T,boolean,any,(signal?: AbortSignal | undefined) => void]{
  const tokenRef = useRef<AbortController>(null);
  const [ data, setData ] = useState<T | null>(null);
  const [ error, setError ] = useState<any>(null);
  const [ loading, setLoading ] = useState<boolean>(false);

  const update = useCallback(async function(signal: AbortSignal | undefined = undefined) {
    setLoading(true);
    setError(null);
    try {
      let response;
      if (!body) {
        response = await axios.get(url, {params: params, signal: signal});
      } else {
        response = await axios.post(url, body, { params, signal: signal });
      }
      setData(response.data);
      setLoading(false);
    } catch(e) {
      if (!signal?.aborted) {
        setLoading(false);
        setError(e);
      }
    }
  }, [axios, url, params, body, setData, setError, setLoading]);

  useEffect(function() {
    if (!url) {
      setData(null);
      setLoading(false);
      setError(null);
    } else {
      const ab = new AbortController();
      tokenRef.current = ab;

      update(ab.signal);

      return function() {
        if (tokenRef.current) {
          tokenRef.current.abort();
        }
      };
    }
  }, [tokenRef, update, setData, setLoading, setError]);

  //if (error)
  //  throw error;

  return [ data as T, loading, error, update ];
}

export default function useFetch<T = any>(url: string|false|null|undefined, params:any = null, body:any = null) {
  const [ api ] = useAuth();
  return useFetchInternal<T>(api.tokenized, url, params, body);
}

export function useFreeFetch<T = any>(url: string|false|null|undefined, params:any = null, body:any = null) {
  const [ api ] = useAuth();
  return useFetchInternal<T>(api.free, url, params, body);
}