T
TanStack•3y ago
fuzzy-lavender

Removing `onSuccess` from this query

Hi, I have a task endpoint that requires short polling in order to get the response. I recall that onSuccess is a bit of an antipattern with useQuery. How could I remove it in this instance (using v3 RQ)? Thanks 
const data = useFetchTaskOutput(taskId, {
    enabled: !outputHasCompleted,
    refetchInterval: 1000,
    retry: false,
    onSuccess: (data) => {
      const completed = Boolean(data.status === 'complete');
      setOutputHasCompleted(completed);
      if (completed) {
        // controlled input handler
        onCompleted(data.value);
      }
    },
  });
const data = useFetchTaskOutput(taskId, {
    enabled: !outputHasCompleted,
    refetchInterval: 1000,
    retry: false,
    onSuccess: (data) => {
      const completed = Boolean(data.status === 'complete');
      setOutputHasCompleted(completed);
      if (completed) {
        // controlled input handler
        onCompleted(data.value);
      }
    },
  });
2 Replies
magic-beige
magic-beige•3y ago
const queryClient = useQueryClient()
const data = useFetchTaskOutput(taskId, {
    enabled: queryClient.getQueryData({queryKey: taskId})?.status !== "complete",
    refetchInterval: 1000,
    retry: false,
  });

const outputHasCompleted = data.status === "complete"
useEffect(()=> outputHasCompleted  && onCompleted(data.value), [outputHasCompleted])
const queryClient = useQueryClient()
const data = useFetchTaskOutput(taskId, {
    enabled: queryClient.getQueryData({queryKey: taskId})?.status !== "complete",
    refetchInterval: 1000,
    retry: false,
  });

const outputHasCompleted = data.status === "complete"
useEffect(()=> outputHasCompleted  && onCompleted(data.value), [outputHasCompleted])
or 
const {data:queryStatus}= useQuery({queryKey: taskid})
const data = useFetchTaskOutput(taskId, {
    enabled: queryStatus?.status !== "complete",
    refetchInterval: 1000,
    retry: false,
  });

const outputHasCompleted = queryStatus?.status === "complete"
useEffect(()=> outputHasCompleted  && onCompleted(data.value), [outputHasCompleted])
const {data:queryStatus}= useQuery({queryKey: taskid})
const data = useFetchTaskOutput(taskId, {
    enabled: queryStatus?.status !== "complete",
    refetchInterval: 1000,
    retry: false,
  });

const outputHasCompleted = queryStatus?.status === "complete"
useEffect(()=> outputHasCompleted  && onCompleted(data.value), [outputHasCompleted])
metropolitan-bronze
metropolitan-bronze•3y ago
Derived state…

Did you find this page helpful?