TanStackT
TanStack•3y ago•
6 replies
uncertain-scarlet

Suggestions on dynamic refetchInterval adjustment

I'm aware of the fact that refetchInterval takes a function to allow it to be adjusted, which is great. I'm wondering what the suggested/ideal approach is for the following scenario:

What I'd like to achieve is to be able to trigger a more rapid refetch after a job is triggered by a button push, and then fall back to a more relaxed schedule once all the tasks associated with that job are complete. The idea here being that the UI should be more reactive when a job is ongoing, but in the interest of performance should slow down if nothing is happening.

The issue I'm encountering is that because I'd like to use a more relaxed interval as my default (30 seconds), it takes a long time to trigger the recalculation to switch over to the more rapid interval (5 seconds). I'd like the switch to be instantaneous.

I've tried using queryClient.invalidateQueries and queryClient.refetchQueries combined with the refetchIntervals function at the point that the button push occurs to try to immediately trigger a refetch and recalculate the interval as a result but I'm not getting the desired effect.

The API call that triggers the jobs resolves immediately, but the jobs may take some indeterminate amount of time to run, so I have to monitor the results of queries to determine when everything has finished.

Here is what I have so far:

  function useProjectQuery() {
    return useQuery({
        queryKey: ['rootItem', 'project'],
        queryFn: async () => {
          let fetchedProject = await getProject();
          fetchedProject = JSON.parse(fetchedProject);
          return fetchedProject;
        },
        refetchInterval: data => ((data != undefined && data.status === "finished") ? 5000 : 30000)
      });
  }


I've also tried accomplishing this using state, by storing the refetchInterval in state and passing it to the hook; but although I can observe that the initial state is passed to the hook/query successfully, updates to the refetchInterval state using setRefetchInterval on button press appear to have no effect. I have also tried using state to set a custom useEffect+useRef+useInterval hook that monitors whether jobs are running and sets the interval accordingly. No luck there either.

Any ideas or observations on how to accomplish this would be appreciated. Thank you.
Was this page helpful?