Wrong message for anonymous functions #29
Description
Consider the following scenario:
const Component = observer(function (props: IProps)) { /* Note that this is, in fact, an anonymous function */
const { useHook } = props;
const { myState } = useHook(); /* A hook cannot be used inside of another function */
return <div>{myState}</div>
})
const WrappedComponent = function() {
const [state, setState] = React.useState();
React.useEffect((
expensiveState.lazyImport().then(s => setState(s));
), []);
const Wrapper = React.useCallback(() => state ? <Component {...state}>/> : <Loading/>, [state])
return <Wrapper/>
}
ReactDOM.render(<WrappedComponent />, ...)It is in fact a wrong function React component declaration, as React component functions must be named. However, I'm arguing that we should provide a meaningful and relevant error message, analogous to the eslint plugin's.