title: How to implement loading indicator with Redux in an app with multiple containers without code repetition?
body: <p>Managed to eliminate the repeating loading indicator state logic from the reducers of multiple container components by implementing a root reducer that handles the loading flags with a naming convention of the actions.</p>
  
  <p>After a bit of refactoring the following piece of code is still repeating through my container components render method:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const mapStateToProps = (state) =&gt; ({
    isLoading: loadingSelector(state)
  });
  
  if (this.props.isLoading) {
    return &lt;LoadingIndicator /&gt;;
  }
  return &lt;ActualComponent /&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>It bothers me to have that kind of code repetition but I couldn't find a way to do it in a centralised manner.</p>
  
  <p>Is there a better pattern to do this or it is normal to have that sort of code repetition in the containers?</p>