React-redux-loop NPM

(a part of restate project)

Allows to catch calls made to redux or dispatched inside redux.

These times, when applications becomes more diverse, redux is not a single thing. It have to coexists with other state managers, and those state manages have to communicate with redux.

It is always possible - they can always read values from the store, and dispatch a change back.

Meanwhile redux could not communicate back. It could only emit state change. Making a lot of things a bit harder. Usually - you dont need it. Redux is the start, and the end, Redux is a global state and stores everything.

That time have passed. You are not alone.

API

Inject middleware

import { loopMiddleware } from 'react-redux-loop'

const store = createStore(
  reducer,
  compose(
    applyMiddleware(loopMiddleware),
  )
);

Loop back on React

Comes in form of renderProp.

import { ReduxLoop } from 'react-redux-loop';

  <ReduxLoop>
    { action => yourCode }
  </ReduxUnbranch>

Single-action helper function

import { ReduxTrigger } from 'react-redux-loop';
<ReduxTrigger 
  when="ACTION_I_WAIT_FOR"
  then={ (event) => consume(event)}
/>

And HOC.

import reduxLoop from 'react-redux-loop';

const ReduxLoopEndpoint = reduxLoop(
  (action, props) => action.type === 'THAT-ACTION' && props.callback(action)
);

<ReduxLoopEndpoint callback = {x => this.setState({x})} />

And, you know, it can cause a loop, as long nothing prevents you to dispatch something back.