import { useEffect, useState } from 'react';
import { ApiMaps } from '../constants/apis';
import { request, RequestOptions } from '../utils';

export default function useRequest<T extends keyof ApiMaps, U extends ApiMaps[T]>(
  url: T,
  options?: RequestOptions,
) {
  const [loading, setLoading] = useState(false);
  const [data, setData] = useState<U['response'] | null>(null);
  const [error, setError] = useState<Error | null>(null);

  useEffect(() => {
    setLoading(true);
    request(url, options)
      .then((res) => {
        setLoading(false);
        setData(res);
      })
      .catch((error) => {
        setLoading(false);
        setError(error);
      });
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [url, JSON.stringify(options)]);

  return {
    data,
    error,
    loading,
  };
}