Infinite loop when using refetch with useEffect

[wwselleck]

Code sandbox example: https://codesandbox.io/s/react-apollo-hooks-infinite-loop-irkwf

tl;dr

  const { data, error, loading, refetch } = useQuery(GET_DOGS, {
    suspend: false,
    // necessary for my use case, since I need an updated `loading` state on refetch
    notifyOnNetworkStatusChange: true
  });
  React.useEffect(() => {
    refetch();
  }, [refetch, trigger]);

refetch appears to be getting re-defined on every render, causing the useEffect to trigger. The callback calls refetch which, then re-renders the component, which re-defines refetch, which causes the useEffect callback to run again...

notifyOnNetworkStatusChange: false "fixes" this, but I want to get loading state updates on refetch.

[hyphaene]

Try to remove refetch from your dependencies array in useeffect ?