Example of how containers should work in complex apps.

LeftNav.js

export default ({
  selected_item, open, gotoIndex
}) => (¬                                                                                                                                                                                                                                    
  <List open={open} selected_item={selected_item}>¬                                                                                                                                                                                                                                    
    <ListItem value={1} onClick={e => gotoIndex(target.value)}/>¬                                                                                                                                                                                          
    <ListItem value={2} onClick={e => gotoIndex(target.value)}/>¬                                                                                                                                                                                          
    <ListItem value={3} onClick={e => gotoIndex(target.value)}/>¬                                                                                                                                                                                          
    <ListItem value={4} onClick={e => gotoIndex(target.value)}/>¬                                                                                                                                                                                          
    <ListItem value={5} onClick={e => gotoIndex(target.value)}/>¬                                                                                                                                                                                          
  </List>¬                                                                                                                                                                                                                                   
);                                                                                                                                                                                                                                        

LeftNavContainer-NoReactLifecycle.js

import React, { Component } from 'react';¬                                                                                                                                                                                          
import LeftNav from './leffNav';¬                                                                                                                                                                                      
import { connect } from 'react-redux';¬                                                                                                                                                                                                        
import { updateMenuxIndex } from './leftNavActions';¬ 

const mapStateToProps = (state) => {¬                                                                                                                                                                                                            
  const { leftNavState} = state;¬                                                                                                                                                                                                                 
  return {leftNavState };¬              
}
const mapDispatchToProps = (dispatch) => {¬                                                                                                                                                                                                    
  return {¬                                                                                                                                                                                                                                    
    // if index === curentIndex, then action should not be dispatched. With no react lifecycle functions, how do you manage
    // if an aciton at this point should or not should be dispatched, or if the state should or should not update, or, even if
    // you decide to update it, returning a new state which is the same as the previous one, how you determine if the component
    // must re-render or not. 
    // take a look at the next file, there, LeftNav is a dumb component. Perhaps the action must be always been dispatched being 
    // something like shouldStateUpdate. Anyway, you actually need the current state there, where the action is dispatched. 
    // Perhaps I'm missing something. 
    gotoIndex: (index) => {¬                                                                                                                                                                                                                  
      dispatch(updateIndex(index));¬                                                                                                                                                                                                       
    }¬                                                                                                                                                                                                                                         
  }¬                                                                                                                                                                                                                                           
}¬                                                                                                                                                                                                                                             
¬                                                                                                                                                                                                                                              
export default connect(¬                                                                                                                                                                                                                       
  mapStateToProps,¬                                                                                                                                                                                                                            
  mapDispatchToProps¬                                                                                                                                                                                                                          
)(LeftNav);¬          

LeftNavContainer-React-ComponentLifeCycleMethods.js

import React, { Component } from 'react';¬                                                                                                                                                                                          
import LeftNav from './leffNav';¬                                                                                                                                                                                      
import { connect } from 'react-redux';¬                                                                                                                                                                                                        
import { updateMenuxIndex } from './leftNavActions';¬                                                                                                                                                                                  
¬                                                                                                                                                                                                                                              
class LeftNavContainer extends Component {¬                                                                                                                                                                                                   
  constructor(props) {¬                                                                                                                                                                                                                        
    super(props);¬                                                                                                                                                                                                                             
    this.handleUpdateSelectedIndex = this.handleUpdateSelectedIndex.bind(this);¬                                                                                                                                                               
  }¬                                                                                                                                                                                                                                           
¬                                                                                                                                                                                                                                              
  componentWillMount(){¬                                                                                                                                                                                                                       
    const { dispatch, leftNavState } = this.props;¬                                                                                                                                                                                                
  }¬                                                                                                                                                                                                                                           
¬                                                                                         
  componentWillReceiveProps(nextProps) {¬                                                                                                                                                                                                      
    if (nextProps.leftNavState !== this.props.leftNavState) {¬                                                                                                                                                                                         
      const { dispatch, leftNavState } = nextProps;¬                                                                                                                                                                                               
    }¬                                                                                                                                                                                                                                         
  }¬                                                                                                                                                                                                                                           
¬                                                                                                                                                                                                                                              
  shouldComponentUpdate(nextProps, nextState){¬                                                                                                                                                                                                
    const currentLeftNavState = this.props.leftNavState;¬                                                                                                                                                                                              
    const nextLeftNavState = nextProps.leftNavState;¬                                                                                                                                                                                                  
    return (currentLeftNavState !== nextLeftNavState);¬                                                                                                                                                                                                
  }¬                                                                                                                                                                                                                                           
¬                                                                                                                                                                                                                                              
  handleUpdateSelectedIndex(e, index) {¬                                                                                                                                                                                                       
    const { dispatch } = this.props;¬                                                                                                                                                                                                          
    dispatch(updateMenuxIndex(index));¬                                                                                                                                                                                                        
  }¬                                                                                                                                                                                                                                           
¬                                                                                                                                                                                                                                              
  render() {¬                                                                                                                                                                                                                                  
    const { leftNavState} = this.props;¬                                                                                                                                                                                                          
    return (¬                                                                                                                                                                                                                                  
      <LeftNav¬                                                                                                                                                                                                                               
        selectedIndex={leftNavState.get('selectedIndex')}¬                                                                                                                                                                                         
        requestChange={this.handleUpdateSelectedIndex}/>¬                                                                                                                                                                                      
    );¬                                                                                                                                                                                                                                        
  }¬                                                                                                                                                                                                                                           
}¬                                                                                                                                                                                                                                             
¬                                                                                                                                                                                                                                              
const mapStateToProps = (state) => {¬                                                                                                                                                                                                            
  const { leftNavState} = state;¬                                                                                                                                                                                                                 
  return {leftNavState };¬              
}
const mapDispatchToProps = (dispatch) => {¬                                                                                                                                                                                                    
  return {¬                                                                                                                                                                                                                                    
    dispatch,¬                                                                                                                                                                                                                                 
    goToIndex: (index) => {¬                                                                                                                                                                                                                  
      dispatch(updateIndex(index));¬                                                                                                                                                                                                       
    }¬                                                                                                                                                                                                                                         
  }¬                                                                                                                                                                                                                                           
}¬                                                                                                                                                                                                                                             
¬                                                                                                                                                                                                                                              
export default connect(¬                                                                                                                                                                                                                       
  mapStateToProps,¬                                                                                                                                                                                                                            
  mapDispatchToProps¬                                                                                                                                                                                                                          
)(LeftNavContainer);¬                                                                                                                                                                                                                    
¬                            

LeftNavReducer.js

mport Immutable from 'immutable';¬                                                                                                                                                                                                            
import { UPDATE_INDEX, TOGGLE } from './LeftNavActions';¬                                                                                                                                                                                           
¬                                                                                                                                                                                                                                              
¬                                                                                                                                                                                                                                              
let initialState = Immutable.fromJS({
  selectedIndex: 1,
  open: true
});¬                                                                                                                                                                                      
¬                                                                                                                                                                                                                                              
export default (state = initialState, action) => {¬                                                                                                                                                                                            
  switch (action.type) {¬                                                                                                                                                                                                                      
  case UPDATE_INDEX:¬                                                                                                                                                                                                                          
    return state.set('selectedIndex', action.index);¬       
  case TOGGLE:¬                                                                                                                                                                                                                          
    return state.set('open', action.open);¬  
  default:¬                                                                                                                                                                                                                                    
    return state;¬                                                                                                                                                                                                                             
  }¬                                                                                                                                                                                                                                           
}¬                                                                                                                                                                                                                                             
¬