Basic reimplementation of promise middleware for Redux

basicReduxPromise.js

// middlewares/async.js
export default function({ dispatch }) {
  return next => action => {
    // Check if a thenable
    if (action.payload.then) {
      // If a thenable, don't call next until the promsie resolves
      action.payload = action.payload.then(res => {
        action = { ...action, payload: res.data };
        next(action);
      });
    } else {
      // Otherwise resolve immediately
      next(action);
    }
  };
}


// index.js
import React from "react";
import ReactDOM from "react-dom";
import { Provider } from "react-redux";
import { createStore, applyMiddleware } from "redux";
import Async from "./middlewares/async";

import App from "./components/app";
import reducers from "./reducers";

const createStoreWithMiddleware = applyMiddleware(Async)(createStore);

ReactDOM.render(
  <Provider store={createStoreWithMiddleware(reducers)}>
    <App />
  </Provider>,
  document.querySelector(".container")
);