aurelia.js redux store setup

create-decorator.js

// it's needs to reduce the includes and simplify store and actions injection.

import { inject } from 'aurelia-framework'
import { bindActionCreators } from 'redux'
import { simpleActions } from 'redux-pirate-actions';

let actionsCallbacks = null;
let actionsWr = null;

export const createDecorator = (actions, store) => (...injectParams) => {
  actionsWr = actionsWr || simpleActions(actions);
  actionsCallbacks = actionsCallbacks || bindActionCreators(actionsWr, store.dispatch);
  return inject(store, actionsCallbacks, ...injectParams)
}

create-store.js

// the file apply the actions and reducers to the store. And create it. 
// Apply the `redux` middlewares.

import { createStore, applyMiddleware, combineReducers } from 'redux';
import promiseMiddleware from 'redux-pirate-promise';

function definePromiseMiddlewareHooks() {
    return {
        request: (data, next) => {
            data.type = `${data.type}Request`;
            next(data);
        },
        error: (data, next) => {
            let { error } = data;
            let err = error.data && error.data.error || error;

            data.error = err;
            data.type = `${data.type}Error`;

            next(data);
        }
    }
}

export default function(data, reducers) {
    var reducer = combineReducers(reducers);
    var finalCreateStore = applyMiddleware(promiseMiddleware.bind(null, definePromiseMiddlewareHooks()))(createStore);
    var store = finalCreateStore(reducer, data, window.devToolsExtension && window.devToolsExtension());

    return store;
}

index.js

// The root file to load the store to the application code. 
// Take a look to the reducers. We dropped loading logic here to simplify a sample. 
// But usually it needs to loads all actions / reducers from the application before the store would be created.

import createStore from "./create-store";
import { createDecorator } from './create-decorator';
import { setActionTypes } from 'redux-pirate-actions';
import * as actions from './reducers';
import * as reducers from './actions';

setActionTypes(actions);

export const store = createStore({}, reducers);
export const decorator = createDecorator(actions, store);
export { actions, routes, reducers }