Redux: props are undefined when rendering
<p>trying to implement ReactRedux with my own example, I'm a bit struggling. It appears as if my props aren't given any value and are still undefined when React renders them. Is my approach in general correct and only a simple error or is there something really wrong?</p>

<p>I've recreated my problem in <a href="http://jsbin.com/xupuhozixa/edit?js,output" rel="nofollow">jsbin</a>:</p>

<pre><code>class Walls extends React.Component {
    render() {
    return (
        &lt;div id="main"&gt;
            &lt;div&gt;volume: {this.props.volume}m³&lt;/div&gt;
        &lt;/div&gt;
    )}
}

const mapStateToProps = (state) =&gt; {
    return {
        volume: state.volume
    };
}

const WallContainer = connect(mapStateToProps)(Walls);

function reducer(state = Map(), action) {
  switch (action.type) {
  case 'SET_STATE':
    return state.merge(action.state);
  }
  return state;
} 

const store = createStore(reducer)
store.dispatch({
    type: 'SET_STATE',
    state: {"volume":1567.571734691151}
})

ReactDOM.render(
        &lt;Provider store={store}&gt;
            &lt;WallContainer /&gt;
        &lt;/Provider&gt;, 
        document.getElementById('root')
);
</code></pre>