Common.tsx

import * as React from 'react'

import { Dispatch } from 'redux'
import { connect } from 'react-redux'
import { AppState, history } from '../store'

import * as Common from '../modules/common'

const Menu: React.SFC<Common.PageProps> = (props) => {
    let key = Common.PathIndeces.indexOf(props.path)
    return (
        <Nav bsStyle="pills" stacked activeKey={key}
            onSelect={e => props.move(Common.PathIndeces[Number(e)])}>
            <NavItem eventKey={0}>
                Home
            </NavItem>
        </Nav>
    )
}
const ConnectedMenu = (() => {
    function mapStateToProps(appState: AppState) {
        return { ...appState.page }
    }
    function mapDispatchToProps(dispatch: Dispatch<void>) {
        return {
            move: (path: string) => {
                history.push(path)
            },
        }
    }
    return connect(mapStateToProps, mapDispatchToProps)(Menu)
})()

common.tsx

import { actionCreatorFactory } from 'typescript-fsa'
import { reducerWithInitialState } from 'typescript-fsa-reducers'
import { Action } from 'typescript-fsa';
import { LOCATION_CHANGE } from 'react-router-redux';

// constants
export const PathIndeces = ["/", "/crawl", "/search"]

// actions
const actionCreator = actionCreatorFactory()

export const pageActions = {
    locationChange: actionCreator<any>(LOCATION_CHANGE)
}
export interface PageActions {
    move: (path: string) => Action<string>
}

// states
export interface PageState {
    path: string
}
const initPageState: PageState = {
    path: "/"
}

// props
export type PageProps = PageActions & PageState

// reducers
export const PageReducer = reducerWithInitialState(initPageState)
    .case(pageActions.locationChange, (state, payload) => {
        return {
            ...state, path: payload.pathname
        }
    })