title: Redux dispatch actions in response to actions
body: <p>I'm thinking through some scenarios surrounding redux and I wasn't able to find a clean solution to this example:</p>
  
  <p>Let's say you have a component that is a list of recipes. When you select a recipe from that list, you <code>dispatch(RECIPE_SELECTED)</code>. That async action-creator may do additional related to the recipe - perhaps go async fetch the ingredients for the recipes, save the selection to the server, whatever. </p>
  
  <p>In a totally separate component you have a list of professional chefs. The desired behavior is that when a user selects a recipe, you populate the list of professional chefs with any chef who has a variation of the selected recipe.</p>
  
  <p>How do you listen for <code>RECIPE_SELECTED</code> and then dispatch a totally unrelated action that has a dependency on the recipe? Something like...</p>
  
  <pre><code>when RECIPE_SELECTED:recipe
    loadChefs(recipe).then(res =&gt; dispatch(CHEFS_LOADED, res.chefs))
  </code></pre>
  
  <p>You <em>could</em> mix this <code>loadChefs/dispatch</code> into the action-creator of <code>RECIPE_SELECTED</code>, but that's a really gross mixing of concerns and will quickly weave a tangled web.</p>
  
  <p>You could also do some very imperative (i.e. against the grain for redux) stuff like so (using React):</p>
  
  <pre><code>componentWillReceiveProps(nextProps) {
    if (nextProps.recipe !== this.props.recipe) {
      const { dispatch, recipe } = nextProps
      dispatch(loadChefs(recipe))
    }
  }
  </code></pre>
  
  <p>I really don't like either of these solutions. Thoughts?</p>