Invalid hook call in React with HOC

[whs]

What version of astro are you using?

1.6.3

Are you using an SSR adapter? If so, which one?

No

What package manager are you using?

npm

What operating system are you using?

Linux

Describe the Bug

It seems that #4220 were solved in #4831 by adding more React component detection rules. However, components wrapped with HOC still get the error:

Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.

In my case local development (astro start) also might not work due to this issue. Stack trace:

[plugin:@astrojs/react] Cannot read properties of null (reading 'useRef')

 error   Cannot read properties of null (reading 'useRef')
  File:
    node_modules/react/cjs/react.development.js:1630:21
  Code:
      1629 |   var dispatcher = resolveDispatcher();
    > 1630 |   return dispatcher.useRef(initialValue);
           |                     ^
      1631 | }
      1632 | function useEffect(create, deps) {
      1633 |   var dispatcher = resolveDispatcher();
    
  Stacktrace:
TypeError: Cannot read properties of null (reading 'useRef')
    at Object.useRef (node_modules/react/cjs/react.development.js:1630:21)
    at useConstant (node_modules/@xstate/react/lib/useConstant.js:5:21)
    at useIdleInterpreter (node_modules/@xstate/react/lib/useInterpret.js:47:45)
    at Proxy.useMachine (node_modules/@xstate/react/lib/useMachine.js:35:57)
    at eval (/src/utils/xstate.tsx:11:60)
    at Tester (@astrojs/react/server.js:38:18)
    at describeNativeComponentFrame (node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:3732:7)
    at describeFunctionComponentFrame (node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:3827:12)
    at getStackByComponentStackNode (node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:5294:19)
    at getCurrentStackInDEV (node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:5460:12)

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-mnqssn?file=src/components/withCounter.tsx

Participation

• I am willing to submit a pull request for this issue.