redux-router with onEnter

main.js

import React from 'react';
import { render } from 'react-dom';

import { Provider } from 'react-redux';
import { applyMiddleware, compose, createStore } from 'redux';
import thunk from 'redux-thunk';
import createLogger from 'redux-logger';

import { createHistory } from 'history';
import { IndexRoute, Route } from 'react-router';
import { ReduxRouter, reduxReactRouter } from 'redux-router';

import App from './containers/Root';
import Home from './components/Home';
import Login from './components/Login';
import Error404 from './components/404';
import rootReducers from './reducers';
import { User } from './actions';

var userinfo = localStorage.getItem('user');

try {
    userinfo = JSON.parse(userinfo);
    if (userinfo === null) {
        userinfo = undefined;
    }
} catch (ex) {
    userinfo = undefined;
}

// Compose reduxReactRouter with other store enhancers
export const store = compose(
    applyMiddleware(thunk),
    reduxReactRouter({
        createHistory,
    }),
    applyMiddleware(createLogger()),
)(createStore)(rootReducers, { user: userinfo });

store.subscribe(() => {
    const state = store.getState();

    localStorage.setItem('user', JSON.stringify(state.user));
});

window.store = store; // easy way to access the store remove later

const routes = (
  <Route path="/" component={ App }>
  <IndexRoute component={Home} />
    <Route path="user">
        <Route path="login" component={Login} />
        <Route path="logout" onEnter={(nextState, replaceState) => { store.dispatch(User.logoutAndRedirect()); replaceState(null, '/user/login'); }}/>
    </Route>
    <Route path="*" component={Error404} />
  </Route>
);

let node = (
    <Provider store={store}>
        <ReduxRouter routes={routes} />
    </Provider>
    );

let rootElement = document.getElementById('root');

render(
    node,
    rootElement
    );