API middleware

middleware.js

export const apiMiddleware = store => next => action => {
  //use destructuring to get apiCall and request from action object
  const {apiCall, request, ...actualAction} = action

  //ignore normal actions
  if (!apiCall) {
    return next(action)
  }

  //dispatch request_begin action — maybe we'd like some loaders
  //note no apiCall and request fields here — with them middleware will have an endless cycle
  store.dispatch({...actualAction, type: `${action.type}_REQUEST`})
  //actually fire a request
  apiCall(request)
  .then(apiResponse => apiResponse.json().then(response => {
    if (apiResponse.status === 200) {
      //all fine, fire action with response
      return store.dispatch({response, request, type: `${action.type}_RESPONSE`});
    } else {
      //something went wrong, fire action with error
      return store.dispatch({error: response, request, type: `${action.type}_FAIL`});
    }
  }))
  .catch(error => {
    //error during request, something with API or network or whatever
    store.dispatch({type: 'REQUEST_ERROR', error})
  })
};