'undefined' action firing the "Actions must be plain objects" error

[ThiagoMiranda]

Hi..
I'm struggling with this all night ( literally ) but can't seem to solve this in any way. I'm trying to fire a action that returns a function ( and inside has a axios promise ) but the error described in the title keeps firing.

This is how I create the store:

import { createStore, applyMiddleware, compose } from 'redux';
import thunk from 'redux-thunk'
import { syncHistoryWithStore } from 'react-router-redux';
import { browserHistory } from 'react-router';
import createLogger from 'redux-logger'


//import the reducers
import rootReducer from '../reducers/index';

const loggerMiddleware = createLogger();

const store = createStore(rootReducer, applyMiddleware(thunk));
export const history = syncHistoryWithStore(browserHistory, store);

export default store;

This is my action ( tried everything like return the axios.get or return each of the dispatchers inside it ):

export function fetchEnvironments() {

    return function(dispatch) {
        dispatch(requestEnvironments());

        axios.get(`${ROOT_URL}/environments`).then((response) => {
            dispatch(fetchEnvironmentsSuccess(response.data))
        }).catch((error) => {
            dispatch(fetchEnvironmentsFailure(error));
        });
    }

}

In a component I just import the store and fire the action using:

import store from '../stores/store';
store.dispatch(fetchEnvironments())

Lookin at the redux-thunk code I've added a console.log inside it and the result is on the screenshot below:

function createThunkMiddleware(extraArgument) {
  return function (_ref) {
    var dispatch = _ref.dispatch;
    var getState = _ref.getState;
    return function (next) {
      return function (action) {
        console.log(action)
        if (typeof action === 'function') {
          return action(dispatch, getState, extraArgument);
        }

        return next(action);
      };
    };
  };
}

This is my app.js ( don't know if it's needed )

import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import * as pcasesActions from '../actions/pcases';
import * as categoriesActions from '../actions/categories';
import * as branchesActions from '../actions/branches';
import * as environmentsActions from '../actions/environments';
import Layout from '../pages/Layout';

const mapStateToProps = state => state;

const mapDispatchToProps = dispatch => bindActionCreators({...pcasesActions, ...categoriesActions, ...branchesActions, ...environmentsActions}, dispatch);

const App = connect(mapStateToProps, mapDispatchToProps)(Layout);

Probably it's my own fault but I'm losing my mind over here.
Thank you very much for your time and your module.
Cheers

[ThiagoMiranda]

After 3 hours trying to fix it I've found that I was calling the bindActionCreators wrongly. Sorry about it

( Now I'm using the fix 3 )
#29 (comment)