How to cancel polling on Button click

[dhruvpandeysm]

I have logic to stop the polling from within the query
refetchInterval: (data) => data?.status_code === 'SUCCESS' ? false : 5000

But how to stop the polling in some other component when a Button is clicked. I tried this
queryClient.cancelQueries({ queryKey: ['runStatus'] })
but somehow the polling still continues.

[binhtran04]

You can have a state to track the refetch status, then use it in the refetchInterval function to decide to stop the polling.

const [shouldRefetch, setShouldRefetch] = useState(true)

const handleClick = () => setShouldRefetch(false)
...
refetchInterval: (data) => shouldRefetch ? 5000 : false