useQuery: running function on error

[ibrahim-ytl]

Hi I have a question to ask. Is it recommended to run the function directly without useEffect upon useQuery return error?

Here is the example code:

const ComponentA = () => {
  const { data, error } = useQuery(....);
  
  const functionA = () => {
    // run a logic that will log the error to the server
  }
  
  if (error) {
    functionA();
  }

  return (
    <div>{data}</div>
  )
}

or it is recommended to run the function inside useEffect?:

const ComponentA = () => {
  const { data, error } = useQuery(....);
  
  const functionA = () => {
    // run a logic that will log the error to the server
  }

  useEffect(() => {
    if (error) {
        functionA();
    }
  }, [error])

  return (
    <div>{data}</div>
  )
}

Which one is the recomended way?

[TkDodo]

depends on what the function does ...