Bug: eslint exhaustive-deps doesn't recognize JSXIdentifier as used

function Component({reportType}) {
  let Report = Reports[reportType];
  let child = useMemo(() => {
    return <Report />;
  }, [Report]);

says that Report is an unnecessary dependency. It’s not.

This is because eslint scope .references does not include JSX. I suspect if you pull in

https://github.com/yannickcr/eslint-plugin-react/blob/master/lib/rules/jsx-uses-vars.js

to your app’s config then this won’t happen. But maybe we should do something in the Hooks plugin itself too (since the others aren’t officially recommended by the React team anyway).

[sophiebits]

@yanneves Not quite. See the second code example in https://reactjs.org/docs/hooks-faq.html#how-to-memoize-calculations for more detail on the pattern I’m using.

[eps1lon]

Duplicate of #18051