Change the status or disable refetching of failed query

[timtnleeProject]

I notice that if a query failed (isError = true), the status will be stale, so it will refetch by default.

If it's possible for failed query to change its status besides stale so it will not refetch, or just disable refetching after query returns error?

[TkDodo]

it is always considered stale if we don't have data to display yet. if you want to see the error forever, you can use the enabled option to disable the query. You'd need some state and set it in the onError callback, but the boilerplate is minimal:

const useMyQuery = () => {
  const [hasError, setHasError] = React.useState(false)
  return useQuery(key, queryFn, { enabled: !hasError, onError: (error) => setHasError(true) }
}

if you provide data via initialData or so, the staleTime would be respected.

[strickc]

I'm curious what the best way to do this would be now that onError has been removed from the api? I have

const myQuery = () => {
    const [refetchInterval, setRefetchInterval] = useState(10 * 1000);
    const query = useQuery({
        queryKey: ['myQuery'],
        queryFn: performQuery,
        refetchInterval,
    });
    if (query.isError && refetchInterval > 0) {
        setRefetchInterval(0);
    }
    return query;
};

but that seems suboptimal putting the state outside of useQuery.

Edit - probably this is the way:

const myQuery = () => {
    return useQuery({
        queryKey: ['myQuery'],
        queryFn: performQuery,
        refetchInterval: (data, query) => query.state.error ? 0 : 10 * 1000,
    });
};