title: How to chain actions in redux
body: <p>From research, I'm seeing that thunk is the tool you use to be able to chain actions together and/or deal with callbacks, asyc actions, and side-effects.</p>
  
  <p>I'm having trouble understanding the <a href="https://github.com/reduxjs/redux-thunk" rel="nofollow noreferrer">thunk middleware</a> guide. They reference 'store.dispatch' all the time (as do most tutorials on redux) yet I never actually call dispatch and never have access to 'store' so I'm unsure how to implement anything they propose.  (I assume this is because I use mapDispatchToProps in react.... which isn't an option in my action creators files)</p>
  
  <p>Below is my action creator (some code removed to clarity):</p>
  
  <pre><code>import { CREATE_NEW_SAMPLING_EVENT } from '../Constants/ActionTypes';
  import { emptySamplingEvent } from '../Constants/SamplingEvent';
  import _ from 'lodash';
  import uuidv4 from 'uuid';
  
  export function createNewSamplingEvent(eventName) {
      let newEvent = _.cloneDeep(emptySamplingEvent);
      newEvent.eventID = uuidv4();
      newEvent.eventName = eventName;
      newEvent.dateModified = new Date();
  
      //TODO: call an optional callback 
      //TODO: dispatch eventLinkTable event
  
      return { type: CREATE_NEW_SAMPLING_EVENT, event: newEvent }
  }
  </code></pre>
  
  <p>What I would like to do is listed in the 'todo's.</p>
  
  <p>I have another action, called EVENT_LINK_TABLE in a different action creator file and different reducer, that would take the uuid from this action creator as an argument.  I'd like to dispatch this EVENT_LINK_TABLE action (with the uuid) as soon as I'm done making this a new event.</p>
  
  <p>Further, I'd like to call a standard callback (which will actually be dispatching another action - LOAD_SAMPLNG_EVENT).. but I'm unsure how to call the callback AND return the action.  I'm also hearing that doing that from the action creator is bad practice, as well as I don't want it to happen if there is a failure in the creation process. </p>
  
  <p>To add additional info, this is where I'm dispatching the action in my react code:\</p>
  
  <pre><code>handleBrandNewButtonClick = () =&gt; {
      this.props.createNewSamplingEvent(this.state.newSamplingEventName);
  }
  </code></pre>
  
  <p>This component is 'connect'ed thusly:</p>
  
  <pre><code>const mapStateToProps = function (state) {
      return {
          samplingEvents: state.SamplingEvents, //to get list of sampling events to check for uniqueness for that user
      }
  }
  
  const mapDispatchToProps = {
      createNewSamplingEvent,
  }
  
  export default withRouter(
      withStyles(styles, { withTheme: true })
          (connect(mapStateToProps, mapDispatchToProps)
              (NewEventForm)
          )
  );
  </code></pre>