Warning: Failed propType: Required prop `dimensionName` was not specified in `DimensionPicker`. Check the render method of `Connect(DimensionPicker)`
<p>I have the following Redux+React component</p>

<pre><code>import {PropTypes, React, Component} from 'react';
import Select from 'react-select';

class DimensionPicker extends Component {
    componentDidMount() {
        const {onLoad} = this.props;
        onLoad();
    }
    render() {
        const {onChange, attributeList, currentAttribute} = this.props;
        return (
            &lt;div&gt;
                &lt;Select value={currentAttribute} options={attributeList} onChange={onChange} /&gt;
            &lt;/div&gt;
        )       
    }
}

DimensionPicker.propTypes = {
    dimensionName: PropTypes.string.isRequired,
    onChange: PropTypes.func.isRequired,
    attributeList: PropTypes.arrayOf(PropTypes.shape({
        value: PropTypes.string.isRequired,
        label: PropTypes.string.isRequired
    }).isRequired).isRequired,
    currentAttribute: PropTypes.string.isRequired
}

export default DimensionPicker;
</code></pre>

<p>and the following container component</p>

<pre><code>import React from 'react';
import DimensionPickerActions from '../actions/DimensionPickerActions';
import {connect} from 'react-redux';
import DimensionPicker from './controls/DimensionPicker.jsx';

const mapStateToProps = (state) =&gt; {
    return {
        dimensionName: state.dimensionName,
        attributeList: state.attributeList,
        currentAttribute: state.currentAttribute
    }
}

const mapDispatchToProps = (state) =&gt; {
    return {
        onChange: (newValue) =&gt; {
            dispatch(updateAttributeSelection(newValue));
        },
        onLoad: () =&gt; {
            dispatch(fetchDimensionAttributes(state.dimensionName));
        }
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(DimensionPicker);
</code></pre>

<p>I also have a reducer which populates the initial state</p>

<pre><code>// define the state tree for the dimenion picker.
const initialState = {
    dimenisionName: '',
    isLoading :'false',
    error : '',
    currentAttribute: '',
    attributeList: []
}

function dimensionPickerReducer(state = initialState, action) {

    switch(action.type) {
        case ATTRIBUTE_SELECTION_CHANGED: 
            return Object.assign({}, state, {currentAttribute: action.data});
            break;
        case REQUEST_DIMENSION_ATTRIBUTES:
            return Object.assign({}, state, {isLoading: 'true', error: ''})
            break;
        case DIMENSION_ATTRIBUTES_RECEIVED:
            return Object.assign({}, state, {attributeList: action.data, isLoading: 'false', error: action.error});
            break;
        case SET_DIMENSION_NAME:
            return Object.assign({}, state, {dimensionName: action.data})
            break;
        default:
            return state;
            break;
    }
}

export default dimensionPickerReducer;
</code></pre>

<p>I build my state store like this</p>

<pre><code>import React from 'react';
import { createStore, combineReducers, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import { Provider } from 'react-redux';
import DataTableReducer from './reducers/DataTableReducer';
import DimensionPickerReducer from './reducers/DimensionPickerReducer';

const combinedReducer = combineReducers({
    dataTable: DataTableReducer,
    dimensionPicker: DimensionPickerReducer
});
export default applyMiddleware(thunk)(createStore)(combinedReducer);
</code></pre>

<p>I load the component like</p>

<pre><code>import React from 'react';
import DimensionPicker from '../containers/DimensionPickerContainer';

const App = () =&gt; (
    &lt;div&gt;
    &lt;DimensionPicker dimensionName="Genre"/&gt;
    &lt;/div&gt;
    )

export default App;
</code></pre>

<p>and finally here is how I load my App </p>

<pre><code>import React from 'react';
import {render} from 'react-dom';
import {Provider} from 'react-redux';
import App from './Reports/App.jsx';
import MovieLensAppStore from './stores/MovieLensAppStore';

render (
    &lt;Provider store={MovieLensAppStore}&gt;
        &lt;App /&gt;
    &lt;/Provider&gt;,
    document.getElementById('container')
    )
</code></pre>

<p>My expectation was that</p>

<ol>
<li>the reducer will initialize state</li>
<li>the container component will map that state to props using the 2 methods in the container component</li>
<li>finally when the component loads, it will have the state and the dispatch methods available to it.</li>
</ol>

<p>but that does not happen. instead I get a warning like</p>

<pre><code>Warning: Failed propType: Required prop `dimensionName` was not specified in `DimensionPicker`. Check the render method of `Connect(DimensionPicker)`.
</code></pre>

<p>I have published my entire code base here</p>

<p><a href="https://github.com/abhitechdojo/MovieLensReact" rel="noreferrer">https://github.com/abhitechdojo/MovieLensReact</a></p>