React router layout

У меня есть роутинг через react-router-redux:

index.j:

import React from 'react';
import ReactDOM from 'react-dom';
import registerServiceWorker from './registerServiceWorker';
import { createStore, applyMiddleware } from 'redux'
import thunk from 'redux-thunk'
import { syncHistoryWithStore } from "react-router-redux";
import { hashHistory } from "react-router"
import combineReducers from "./reducer";
import Root from './components/Root'

const store = createStore(combineReducers, applyMiddleware(thunk))
const history = syncHistoryWithStore(hashHistory, store)

ReactDOM.render(<Root history={history} store={store} />, document.getElementById('root'))
registerServiceWorker();

root.jsx

import React from 'react'
import PropTypes from 'prop-types'
import { Provider } from 'react-redux'
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'
import CustomersList from "./customers/CustomersList";
import CustomerCreate from "./customers/CustomerCreate";
const Root = ({ store }) => (
    <div>
    <Provider store={store}>
        <Router>
            <Switch>
                <Route path="/brokers/customers/list/:type/:project/:active" component={CustomersList} />
                <Route path="/brokers/customers/create" component={CustomerCreate} />
            </Switch>
        </Router>
    </Provider>
    </div>
)
Root.propTypes = {
    store: PropTypes.object.isRequired
}
export default Root

сейчас в каждый компонент я вставляю компонент Header, по сути одинаковый для всех. Как его вынести за пределы компонентов? Сейчас если вставить его в то просто компоненты не подгружаются, а если за пределы то не доступен store