[Question] dispatch(pushState(...)) did not transition?

[bangedorrunt]

I'm refactoring the code and now the code failed me.

I have a simple Login page, after successfully login, it will move to App page. My previous code work, but since I update new version of Redux-Router and refactor some codes. It doesn't work any more. It seems to me the Redux-Router doesn't loads its child routes any more.

In Redux devTools, I have the following log after click on Sign In button:

My Routes:

export const routes = (
  <Route path='/' component={ Login }>
    <Route path='app' component={ App }>
    // Remove for simple demostration
    </Route>
  </Route>
)

My configureStore:

export default function configureStore(initialState) {

  const finalCreateStore = compose(
    reduxReactRouter({ routes, createHistory }),
    applyMiddleware(thunkMiddleware, createLogger()),
    devTools()
    )(createStore)

  const store = finalCreateStore(rootReducer, initialState)

  if (module.hot) {
    // Enable Webpack hot module replacement for reducers
    module.hot.accept('../reducers', () => {
      const nextRootReducer = require('../reducers/index')
      store.replaceReducer(nextRootReducer)
    })
  }

  return store
}

My _loginHandler which verify the login process and transit to /app if login successfully:

_loginHandler() {
    let { dispatch } = this.props
    // Simple login test
    dispatch(authenticationAction(true))
    // Navigate to `/app` page
    dispatch(pushState(null, '/app'))
  }

My package.json:

"devDependencies": {
    "babel-core": "^5.4.7",
    "babel-eslint": "^3.1.9",
    "babel-plugin-react-transform": "^1.1.1",
    "eslint": "^1.3.1",
    "eslint-plugin-react": "^2.3.0",
    "express": "^4.13.3",
    "react-transform-catch-errors": "^1.0.0",
    "react-transform-hmr": "^1.0.0",
    "redbox-react": "^1.0.1",
    "rimraf": "^2.4.3",
    "webpack": "^1.9.6",
    "webpack-dev-middleware": "^1.2.0",
    "webpack-hot-middleware": "^2.0.0"
  },
  "dependencies": {
    "autoprefixer-loader": "^3.1.0",
    "babel": "^5.8.29",
    "babel-loader": "^5.1.2",
    "bootstrap-sass": "^3.3.5",
    "css-loader": "^0.21.0",
    "file-loader": "^0.8.4",
    "firebase": "^2.3.1",
    "history": "^1.13.0",
    "imports-loader": "^0.6.5",
    "jquery": "^2.1.4",
    "moment": "^2.10.6",
    "node-sass": "^3.4.1",
    "normalize.css": "^3.0.3",
    "re-base": "^1.2.2",
    "react": "^0.14.2",
    "react-addons-create-fragment": "^0.14.2",
    "react-addons-css-transition-group": "^0.14.2",
    "react-addons-pure-render-mixin": "^0.14.2",
    "react-addons-transition-group": "^0.14.2",
    "react-addons-update": "^0.14.2",
    "react-bootstrap-datetimepicker": "0.0.22",
    "react-bootstrap-table": "^1.2.8",
    "react-dom": "^0.14.0",
    "react-redux": "^4.0.0",
    "react-router": "^1.0.0",
    "react-tap-event-plugin": "^0.2.1",
    "reactfire": "^0.5.1",
    "redux": "^3.0.4",
    "redux-devtools": "^2.1.5",
    "redux-logger": "^2.0.4",
    "redux-router": "^1.0.0-beta3",
    "redux-thunk": "^1.0.0",
    "resolve-url-loader": "^1.3.2",
    "rx": "^4.0.6",
    "sass-loader": "^3.1.1",
    "style-loader": "^0.13.0",
    "url-loader": "^0.5.6"
  }

[eriknyk]

similar problem here

[bangedorrunt]

I found the problems. I didn't pass the routes properly.

Provided that I have routes.js as following:

export const routes = (
  <Route path='/' component={ Login }>
    <Route path='app' component={ App }>
    // Remove for simple demostration
    </Route>
  </Route>
)

Either put that in Root component

import {routes} from './somewhere'
<ReduxRouter routes={routes} />

Or in reduxReactRouter:

const finalCreateStore = compose(
    applyMiddleware(thunkMiddleware, createLogger()),
    reduxReactRouter({ routes, createHistory }),
    devTools()
    )(createStore)

Will fix the prob