useAsync.ts

import { useState, useEffect, useRef } from 'react';

type State<T> = {
  data?: T;
  error?: any;
};

export default function useAsync<T>(
  getData: () => Promise<T>,
  deps: readonly any[],
): State<T> {
  const [state, setState] = useState<State<T>>({});
  const promiseRef = useRef<Promise<T>>();

  useEffect(() => {
    const promise = getData();

    promiseRef.current = promise;

    promise
      .then((data) => {
        if (promise === promiseRef.current) {
          setState({ data });
        }
      })
      .catch((error) => {
        if (promise === promiseRef.current) {
          setState({ error });
        }
      });
  }, deps);

  return state;
}