I'm calling a mutation like so:

const [deleteTask, deleteTaskResponse] = useMutation(deleteTaskMutation);

// this is called in a different component (all of this logic is in a context provider)
const deleteTaskFunction = (taskId) => {
  deleteTask({variables: { taskId }})
}

I have a a useEffect set up to monitor for when the deleteTaskResponse is changed to update state with the response like so:

useEffect(()=>{
   const { data, loading, error } = deleteTaskResponse;
   
   if (data && data.deleteTask){
       console.log(data.deleteTask)
       setTasks(data.deleteTask.tasks) // state
   }

}, [deleteTaskResponse])

I don't understand why this is causing an infinite effect loop as the response shouldn't be changing since the function is only called once. I've tried putting a console.log in the deleteTaskFunction and can confirm that it is only being called once when the delete button is pressed.