title: React/redux multiple components with same container
body: <p>I'm very new in this technology stack but i'm confused about something:</p>
  
  <p>I have a react container that handle what view should be shown to the user in the app:</p>
  
  <pre><code>const mapStateToProps = (state) =&gt; {
    return {
      currentScreen: state.currentScreen
    }
  }
  </code></pre>
  
  <p>and also handle when the app should change the current screen:</p>
  
  <pre><code>const mapDispatchToProps = (dispatch) =&gt; {
    return {
      changeScreen: (newScreen) =&gt; {
        dispatch(changeScreen(newScreen))
      }
    }
  }
  </code></pre>
  
  <p>but is "connected" <a href="https://github.com/reactjs/react-redux/blob/master/docs/api.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options" rel="nofollow" title="connect&#40;&#41;">connect()</a> only with App component:</p>
  
  <pre><code>import App from '../components/App'
  
  const AppScreen = connect(
    mapStateToProps,
    mapDispatchToProps
  )(App)
  </code></pre>
  
  <p>How can I share with all components the <code>changeScreen</code> function?</p>