[BUG] Usage of 'useSyncExternalStore' causes errors with react below version 18

[ArLau]

The new release of overmind-react (29.0.3) breaks the compatibility with react 17. Perhaps it is not intended to work with a react version lower than 18, but I could not find a mentioned required minimal version and just some issue which announced the support for react 18, which does not imply that react 17 is not supported anymore.

However, 'useSyncExternalStore' was introduced with react 18 and is not available for previous versions, resulting in errors like this:

ERROR in ../../node_modules/overmind-react/es/index.js 303:4-30 export 'useSyncExternalStore' (imported as 'react') was not found in 'react' (possible exports: Children, Component, Fragment, Profiler, PureComponent, StrictMode, Suspense, __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, cloneElement, createContext, createElement, createFactory, createRef, forwardRef, isValidElement, lazy, memo, useCallback, useContext, useDebugValue, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useReducer, useRef, useState, version)

Feel free to close this issue, if the minimal required version is react 18.

[henri-hulski]

@ArLau Can you please try out the next release with overmind-react@next and overmind@next as dependencies? It should work now. Please give some feedback if the next release works as it contains also a major dependencies clean-up and upgrade.

[ArLau]

@ArLau Can you please try out the next release with overmind-react@next and overmind@next as dependencies? It should work now. Please give some feedback if the next release works as it contains also a major dependencies clean-up and upgrade.

@henri-hulski Thanks a lot for this quick reply.

Unfortunately it is still broken. I updated the used versions to

"overmind": "^28.0.3-1688898842314",
"overmind-react": "^29.0.4-1688898842314",

but I still get

ERROR in ../../node_modules/overmind-react/es/index.js 131:17-43
export 'useSyncExternalStore' (imported as 'react') was not found in 'react' (possible exports: Children, Component, Fragment, Profiler, PureComponent, StrictMode, Suspense, __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, cloneElement, createContext, createElement, createFactory, createRef, forwardRef, isValidElement, lazy, memo, useCallback, useContext, useDebugValue, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useReducer, useRef, useState, version)
ERROR in ../../node_modules/overmind-react/es/index.js 303:11-40
export 'useSyncExternalStore' (imported as 'react') was not found in 'react' (possible exports: Children, Component, Fragment, Profiler, PureComponent, StrictMode, Suspense, __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, cloneElement, createContext, createElement, createFactory, createRef, forwardRef, isValidElement, lazy, memo, useCallback, useContext, useDebugValue, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useReducer, useRef, useState, version)

[ArLau]

Hi @henri-hulski ,

I tried again with

    "overmind": "^28.0.3-1694810606160",
    "overmind-react": "^29.0.5-1694810606160",
    "overmind-devtools": "^29.0.5-1694810606160"

but still get

x: Attempted import error: 'useSyncExternalStore' is not exported from 'react' (imported as 'React').
x: ERROR in ../../node_modules/overmind-react/es/index.js 130:17-43
x: export 'useSyncExternalStore' (imported as 'React') was not found in 'react' (possible exports: Children, Component, Fragment, Profiler, PureComponent, StrictMode, Suspense, __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, cloneElement, createContext, createElement, createFactory, createRef, forwardRef, isValidElement, lazy, memo, useCallback, useContext, useDebugValue, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useReducer, useRef, useState, version)
x: ERROR in ../../node_modules/overmind-react/es/index.js 303:11-40
x: export 'useSyncExternalStore' (imported as 'React') was not found in 'react' (possible exports: Children, Component, Fragment, Profiler, PureComponent, StrictMode, Suspense, __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, cloneElement, createContext, createElement, createFactory, createRef, forwardRef, isValidElement, lazy, memo, useCallback, useContext, useDebugValue, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useReducer, useRef, useState, version)

I also deleted the node_modules folder before updating overmind - just to be sure I'm not accidentally using old files.

Can you have a look?