Why Does Mapping State To Props Give Undefined?

I'm having a problem with my setup of Redux. I didn't have a problem with single file of posts actions and reducers, but as soon as added a searchQueries sections, it shows only un

Solution 1:

That's because you're accessing the wrong par of state. Take a look at your combineReducers call:

export default combineReducers({
  posts,
  postsHasErrored,
  postsIsLoading,
  totalPages,

  setSearchString,
  setSearchCategories,
  setSearchPage
})

Per the Redux documentation:

combineReducers(reducers)

The shape of the state object matches the keys of the passed reducers.

Thus your state object actually looks like this:

{
  posts:...,
  postsHasErrored:...,
  postsIsLoading:...,
  totalPages:...,
  setSearchString:...,
  setSearchCategories:...,
  setSearchPage:...
}

In your mapDispatchToProps, you're trying to access the wrong part of state:

currentPage: state.searchPage,searchCategories: state.searchCategories,searchString: state.searchString

Since state.searchPage and the other two don't exist in the state object, you get undefined. Instead, make sure you access the keys which have the same name as the reducers:

currentPage: state.setSearchPage,searchCategories: state.setSearchCategories,searchString: state.setSearchString

Or just rename your reducers (which would be preferable as they are misnomers right now). Get rid of the set prefix on the reducers, they are not actions.