"Error: Hooks can't be inside conditionals, neither loops." with React.useMemo0 hook

[kleinspire]

The following code:

@react.component
let make = () => {
  let className = React.useMemo0(() => "rescript + react + emotion + styled-ppx rocks!")
  <div className />
}

...triggers an error:

3 |   let className = React.useMemo0(() => "rescript + react + emotion + styled-ppx rocks!")
                      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Error: Hooks can't be inside conditionals, neither loops.

[kleinspire]

The following seems to work though:

@react.component
let make = () => {
  React.useMemo0(() => "rescript + react + emotion + styled-ppx rocks!")
}

[davesnx]

Hey @webican

Seems like the logic to detect if hooks are being called on the top have a bug where considers the useMemo call to be "inside" the JSX transformation.

I will look into it, since there are a few cases that this linter isn't aligned with what the ESLint plugin does.

Thanks for reporting