Recursively calls the provided action while caller component is mounted

usePolling.js

import React, { useCallback, useEffect, useRef } from "react";

function usePolling(action, delay) {
  const timeoutId = useRef(null);
  const isComponentMounted = useRef(false);

  const handlePolling = useCallback(() => {
    action().then(() => {
      if (isComponentMounted.current) {
        timeoutId.current = setTimeout(handlePolling, delay);
      }
    });
  }, [action, delay]);

  useEffect(() => {
    isComponentMounted.current = true;

    // Initiate polling action
    handlePolling();

    return () => {
      clearTimeout(timeoutId.current);
      isComponentMounted.current = false;
    };
  }, [handlePolling]);
}

export default usePolling;