DEV Community

Discussion on: Popular patterns and anti-patterns with React Hooks

tkdodo profile image
Dominik D

Good read! Question on number 2: Would we not want to keep the function as dependency and let the user solve it, either with useCallback or by letting the user move the isInteractive function outside if the component:

const isInteractive = (option) => !option.disabled


const [ref, handleKeyDown] = useFocusMove({ isInteractive })
Enter fullscreen mode Exit fullscreen mode

With this, you can still closure over a prop in isInteractive if you want to

justboris profile image
Boris Serdiuk Author

The answer depends on the use-case. Some things are not supposed to change in runtime and it is nice to move them out of the dependencies tracking logic altogether

For example, you can see this pattern in react-redux hook: