using routerMiddleware function in react and redux

Question

how can I use routerMiddleware to pass history to redux. I have tried below but not working. I couldn't find any resources that integrate the routerMiddleware. Here, I am trying to react-admin dashboard where it asks to pass history as props to redux store. so I am trying to use routeMiddleware to pass the history props.

import { createStore, combineReducers, applyMiddleware } from 'redux'
import thunk from 'redux-thunk'
import { composeWithDevTools } from 'redux-devtools-extension'
import { routerMiddleware, connectRouter } from 'connected-react-router'
import { createBrowserHistory } from 'history'
import { postListReducer } from './reducers/postReducers'

const history = createBrowserHistory()

const reducer = combineReducers({
  postList: postListReducer,
  router: connectRouter(history),
})

const initialState = { postList: { posts: [] } }

const middleware = [thunk, routerMiddleware(history)]

const store = createStore(
  reducer(history),
  initialState,
  composeWithDevTools(applyMiddleware(...middleware))
)

export default store

Reducers:

import {
    POST_LIST_REQUEST,
    POST_LIST_SUCCESS,
    POST_LIST_FAIL,
    POST_CREATE_REQUEST,
    POST_CREATE_SUCCESS,
    POST_CREATE_FAIL,
  } from '../constants/postConstants'
  
  export const postListReducer = (state = { posts: [] }, action) => {
    switch (action.type) {
      case POST_LIST_REQUEST:
        return { loading: true }
      case POST_LIST_SUCCESS:
        return {
          loading: false,
          posts: action.payload,
        }
      case POST_LIST_FAIL:
        return { loading: false, error: action.payload }
      default:
        return state
    }
  }

using routerMiddleware function in react and redux

0 Answers0