This seems to happen when
1. I take a component as a prop
2. I use that component as a JSX constructor in a hook

Minimal repro:
```jsx
export const Foo = ({ Component }) => {
  React.useEffect(() => {
    console.log(<Component />);
  }, []);
};
```

```
    "eslint-plugin-react-hooks": "^4.1.1",
```


---

Interestingly, this does NOT cause the error:
```jsx
export const Foo = ({ component }) => {
  React.useEffect(() => {
    const Component = component;
    console.log(<Component />);
  }, []);
};
```
missingDependencies.size +
        unnecessaryDependencies.size;
      if (problemCount === 0) {
        
        
        const constructions = scanForConstructions({
          declaredDependencies,
          declaredDependenciesNode,
          componentScope,
          scope,
        });
        constructions.forEach(
          ({construction, isUsedOutsideOfHook, depType}) => {
            const wrapperHook =
              depType === 'function' ? 'useCallback' : 'useMemo';
            const constructionType =
              depType === 'function' ? 'definition' : 'initialization';
            const defaultAdvice = `wrap the ${constructionType} of '${construction.name.name}' in its own ${wrapperHook}() Hook.`;
            const advice = isUsedOutsideOfHook
              ? `To fix this, ${defaultAdvice}`
              : `Move it inside the ${reactiveHookName} callback. Alternatively, ${defaultAdvice}`;
            const causation =
              depType === 'conditional' || depType === 'logical expression'
                ? 'could make'
                : 'makes';
            const message =
              `The '${construction.name.name}' ${depType} ${causation} the dependencies of ` +
              `${reactiveHookName} Hook (at line ${declaredDependenciesNode.loc.start.line}) ` +
              `change on every render. ${advice}`;
            let suggest;