External actions usage

actions.js

import { createActions, createExternalActions } from 'redux-recompose';

// Our action names, as always. These will be handled by our reducer.
export const actions = createActions(['LOCAL_ACTION'], '@@SOCCER');

// External actions names being handled by the invisible reducer. We should specify
// what slice of the state is related with this reducer, say, state.soccer
// No need to handle them at our reducer.
const $ = createExternalActions('soccer');

const actionCreators = {
  getMatches = () => async dispatch => {
    dispatch({ type: $.LOADING, target: 'matches' });
    const response = await SoccerService.getMatches();
    if (response.ok) {
      dispatch({ type: $.SUCCESS, target: 'matches', payload: response.data });
    } else {
      dispatch({ type: $.FAILURE, target: 'matches', payload: response.problem });
    }
  }
};

export default actionCreators;