https://blog.battlefy.com/how-to-escape-react-hooks-hell-a66c0d142c9e

object dependency.js

const BrokenComponent = (props) => {
  useEffect(() => {
    console.log('BrokenComponent called useEffect');
  }, [props]); // THIS IS ALWAYS WRONG!

  return <code>{JSON.stringify(props)}</code>;
};

const GoodComponent = (props) => {
  useEffect(() => {
    console.log('GoodComponent called useEffect');
  }, [JSON.stringify(props)]); // Cheesy fix, better to explicitly list all props

  return <code>{JSON.stringify(props)}</code>;
};