react-bl | React components powered by XJST | Frontend Utils library

I'm a Redux maintainer, and I implemented React-Redux v7.

By bizarre coincidence, I actually debugged this exact issue for someone else recently over in Reactiflux (or at least I think it was someone else).

The first problem here is that you need to be using the "alternate renderer" entry point for React-Redux, because the primary entry point assumes you're using react-dom or react-native. So, you need import { connect } from "react-redux/lib/alternate-renderers".

However, even once you do that, there is actually a bug in react-blessed, combined with a sort of deficiency in React-Redux. The result is that React-Redux's ends up unsubscribing itself from the store after the first action is dispatched, which causes all further dispatched actions to result in no UI updates.

It's a combo of three things:

• react-blessed is using an old version of react-reconciler which has a bug in it related to calling useEffect, and react-blessed really needs a new release that uses the latest version of react-reconciler
• Sorta related, React-Redux's is still calling useEffect instead of our useIsomorphicLayoutEffect wrapper, but that would still fall back to actually being useEffect because this is running in a Node environment instead of a browser
• To fix that, we'd need to have a way for you as the end user to say "no, I really do want this to be useLayoutEffect to fix timing issues when running under Node", and we don't currently expose an API to do that right now.

Pasting my notes from that debugging session:

• there's a bug somehow between react-blessed and react-reconciler that is causing useEffect cleanup functions to be run when they shouldn't be. This may be due to react-blessed keeping around this runningEffects array, or it may be due to something odd in this specific version of react-reconciler. Either way, the root cause of the behavior you're seeing is that Provider is unsubscribed when it shouldn't be because it was calling useEffect , and then having its cleanup function run when you dispatched a new Redux action and queued a UI update. That caused a flush of passive effects, which hits this bit:

I had the exact same issue. Turned out that Webpack would mess around with Material UI's rules of JSS precedence. You need to manually override the injection order using the index option.

In your makeStyles() or withStyles(), add {index: 1}:

React.PropTypes has been extracted to it's own package since React v15.5.0.

From this issue. The fix is to use the prop-types package instead