title: Meteor createContainer and Redux
body: <p>I created a Meteor <code>createContainer</code> to wrap the entire App to just look for <code>Meteor.users()</code>:</p>
  
  <pre><code>import { Meteor } from 'meteor/meteor';
  import { createContainer } from 'meteor/react-meteor-data';
  
  import App from './../App.js';
  
  export default AccountContainer = createContainer(() =&gt; {
    const _id = Meteor.userId();
    const accountHandle = Meteor.subscribe('userData', _id);
    const loading = !accountHandle.ready();
    const user = Meteor.users.findOne(_id);
    const userExist = !loading &amp;&amp; !!user;
  
    return {
      loading,
      userExist,
      user
    };
  }, App);
  </code></pre>
  
  <p>I need to use this data all around the App to show / hide elements and to take control of User private pages like a control panel.</p>
  
  <p>I'm using Redux to store the data coming from <code>createContainer</code> and actually I'm doing it in the <code>App.js</code> file:</p>
  
  <pre><code>// a few imports here...
  
  class App extends Component {
    render() {
      const { loading, userExist, user } = this.props;
      this.props.updateUser({ loading, userExist, user });
  
      return (
        &lt;Router history={history}&gt;
          &lt;div className="app"&gt;
            &lt;Header /&gt;
            &lt;Switch&gt;
              &lt;Route exact path="/" component={Home} /&gt;
              &lt;Route exact path="/login" component={Login} /&gt;
              &lt;Route exact path="/signup" component={Signup} /&gt;
              &lt;Route exact path="/account" component={Account} /&gt;
              &lt;Route exact path="/account/pictures" component={Pictures} /&gt;
            &lt;/Switch&gt;
            &lt;Newsletter /&gt;
            &lt;Footer /&gt;
          &lt;/div&gt;
        &lt;/Router&gt;
      );
    }
  };
  
  export default connect(null, { updateUser })(App);
  </code></pre>
  
  <p>As you can see here I call <code>this.props.updateUser({ loading, userExist, user });</code> and it update my redux store.</p>
  
  <p>The issue is that I do receive the following error:</p>
  
  <blockquote>
    <p>Warning: setState(...): Cannot update during an existing state
    transition (such as within <code>render</code> or another component's
    constructor). Render methods should be a pure function of props and
    state; constructor side-effects are an anti-pattern, but can be moved
    to <code>componentWillMount</code>.</p>
  </blockquote>
  
  <p>This because I'm updating Redux state within the <code>render()</code> App method.</p>
  
  <p>I tried wrapping it between a <code>setTimeout</code>:</p>
  
  <pre><code>setTimeout(() =&gt; {
    this.props.updateUser({ loading, userExist, user });
  });
  </code></pre>
  
  <p>This solve my issue but I think it is not the best solution to fix it.</p>
  
  <p>I'm confused about how and when to update Redux state using Meteor <code>createContainer</code>.</p>
  
  <p>What I wish to achieve is to be able share the <code>{ loading, userExist, user }</code> data all around the App taking that information using for ie in <code>Account.js</code>:</p>
  
  <pre><code>const mapStateToProps = (state) =&gt; {
    return state.user;
  }
  
  export default connect(mapStateToProps)(Account);
  </code></pre>
  
  <p>Thanks.</p>
  
  <p><strong>EDIT</strong>:
  Just moved the Redux update frm <code>render()</code> to <code>componentDidMount()</code> method.
  It doesn't show the error anymore, it update well in <code>App.js</code> but in <code>Account.js</code> I don't get it updated, it looks like it miss it:</p>
  
  <p><a href="https://i.stack.imgur.com/QY7ri.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/QY7ri.png" alt="enter image description here"></a></p>