Компонент не получает реквизит из магазина Redux через mapStateToProps

В моем компоненте react мне нужно получить состояние из магазина Redux в качестве реквизита и использовать их. Я использую mapStateToProps, который получает состояние из хранилища redux правильно, так как начальные значения являются консольными.правильно. Однако все реквизиты в моем компоненте не определены, когда я их использую. Я не делаю никаких явно асинхронных вызовов, которые, похоже, являются проблемой в предыдущих вопросах, которые я нашел, поэтому я не уверен, почему мой компонент не имеет доступа к ним реквизит.

Src / компоненты / панель поиска.js

import React, { Component } from 'react';
import { connect } from 'react-redux';
import actionType from '../constants/action-types';

class SearchBar extends Component {

  render() {
    return (
      <form>
        <input
          type="text"
          placeholder="Search..."
          value={this.props.filterText}
          onChange={this.onTextChange}
        />
        <p>
          <input
            type="checkbox"
            checked={this.props.inStockOnly}
            onChange={this.onInStockCheckedChange}
          />
          {' '}
          Only show products in stock
        </p>
      </form>
    );
  }
}


function mapStateToProps(state) {
    console.log("SearchBar state:", state);

    return {
        filterText: state.filterText,
        showInStockOnly: state.showInStockOnly
    };
}

function mapDispatchToProps(dispatch) {
    return {
        onTextChange: (evt) => {
            const action = {
                type: actionType.UPDATE_ON_TEXT_CHANGE,
                value: evt.target.value
            };
            dispatch(action);
        },

        onInStockCheckedChange: () => {
            const action = {
                type: actionType.SET_IN_STOCK_ONLY_CHECKED,
            };
            dispatch(action);
        }
    };
}

export default connect(mapStateToProps, mapDispatchToProps)(SearchBar);

Src / reducers / searchBar_reducer.js

import actionType from '../constants/action-types';
import initialState from '../constants/initial-state';


const searchBar = (state = initialState, action) =>{
    console.log('SearchBar reducer running: ', state, action);

    switch (action.type) {

        case actionType.UPDATE_ON_TEXT_CHANGE:
            console.log("Text change action dispatched!")
            return Object.assign({}, state, { filterText: action.value});

        case actionType.SET_IN_STOCK_ONLY_CHECKED:
            console.log("InStockOnly action dispatched!")
            return Object.assign({}, state, { inStockOnly: !state.inStockOnly});

        default:
            return state;
    }
}


export default searchBar;

Src / редукторы / индекс.js

import { combineReducers } from 'redux';

import searchBar from './searchBar_reducer'


const rootReducer = combineReducers({
    searchBar
});


export default rootReducer;

Src / индекс.js

import React from 'react';
import { render } from 'react-dom';
import { createStore } from 'redux';
import { Provider } from 'react-redux';
//import App from './components/App';
import SearchBar from './components/SearchBar'
import rootReducer from './reducers/';

const store = createStore(rootReducer);

const unsubscribe = store.subscribe(() =>
  console.log(store.getState())
)

render(
  <Provider store={store}>
    <SearchBar />
  </Provider>,
  document.getElementById('root')
);