Custom hook to prevent memory leakage

useMountedState.js

import React, {
  Dispatch,
  SetStateAction,
  useState,
  useRef,
  useEffect,
} from 'react';

export default function useMountedState<S>(
  initialState: S | (() => S),
): [S, Dispatch<SetStateAction<S>>] {
  const [state, setState] = useState(initialState);
  const ref = useRef(false);

  const updateState = (value: SetStateAction<S>) => {
    ref.current && setState(value);
  };
  useEffect(() => {
    ref.current = true;
    return () => {
      ref.current = false;
    };
  }, []);
  return [state, updateState];
}