eslint-plugin-react-hooks useEffect autofix of adding function names causes a lot of infinite loops

I’ve read “My function value is constant” from https://github.com/facebook/react/issues/14920#issuecomment-471070149.

There is a problem on the opposite spectrum of this, which is where you get infinite loops (a function value always changes). We catch that in the lint rule now when possible (in the same component) and suggest a fix. But it’s tricky if you pass something several levels down.

If you autofix the useEffect, would it also be possible to autofix any functions added by wrapping them in a useCallback at the same time?

This would greatly improve the user experience.

[gaearon]

A much better fix is usually to either move a function either outside of the component (if it doesn’t use props or state), or move it inside the effect (if it does). useCallback is the escape hatch for when you can’t or don’t want to do either. So I don’t think we’d want to autofix it to useCallback every time.

We could offer an option that disables the autofix when we detect function deps.

[gaearon]

Regarding the autofix, I hope https://github.com/eslint/rfcs/pull/30 will let us solve the problem without compromising on IDE suggestions.