React-router v.4 - Links in header doesn't work - reactjs

Question

I'm using react-router v.4 in my React app and have faced with this trouble: when I click at <Link> component, the URL is changing, but data is not rendering.
Here is my code snippets:
Header.component.js:
import React from 'react';
import Navbar from 'react-bootstrap/lib/Navbar';
import Nav from 'react-bootstrap/lib/Nav';
import NavItem from 'react-bootstrap/lib/NavItem';
import NavDropdown from 'react-bootstrap/lib/NavDropdown';
import MenuItem from 'react-bootstrap/lib/MenuItem';
import {Link} from 'react-router-dom';
//utils
import History from '../../utils/History';
import bindAll from 'lodash/bindAll';
class Header extends React.Component {
constructor(props) {
super(props);
bindAll(this, '_getHeaderItem');
}
_getHeaderItem() {
switch (History.location.pathname) {
case '/sign-in':
return <li><Link to='/sign-up'>Sign Up</Link></li>;
break;
case '/sign-up':
return <li><Link to='/sign-in'>Sign In</Link></li>;
break;
default:
return null;
}
}
render() {
return (
<Navbar collapseOnSelect>
<Navbar.Header>
<Navbar.Brand>
Elevator
</Navbar.Brand>
<Navbar.Toggle />
</Navbar.Header>
<Navbar.Collapse>
<Nav>
<NavItem eventKey={1} href="#">Link</NavItem>
</Nav>
<Nav pullRight>
{this._getHeaderItem()}
<NavDropdown eventKey={4} id='member-dropdown' title={
<div className='inline-block'>
<img src='' alt='' />
Username
</div>
}>
<MenuItem eventKey={4.1}>My profile</MenuItem>
<MenuItem eventKey={4.2}>Logout</MenuItem>
<MenuItem divider />
<MenuItem eventKey={4.3}>Administration</MenuItem>
</NavDropdown>
</Nav>
</Navbar.Collapse>
</Navbar>
);
}
}
export default Header;
app.js: (which is collecting all components and has routing logic)
import React from 'react';
import ReactDOM from 'react-dom';
import fetch from 'whatwg-fetch';
import { Router, Route, Redirect } from 'react-router';
//utils
import History from './utils/History';
//components
import App from './common/components/App.component';
import SignUp from './modules/signUp/SignUp.component';
import SignIn from './modules/signIn/SignIn.component';
import Footer from './modules/footer/Footer.component';
//styles
require ('./../styles/main.scss');
let loggedIn = localStorage.getItem('token');
loggedIn ? History.replace('/dashboard') : History.replace('/sign-in');
ReactDOM.render(
<Router history={History}>
<App>
<Route path='/sign-in' render={() => (
loggedIn ? (
<Redirect to="/dashboard" />
) : (
<SignIn />
)
)} />
<Route path='/sign-up' render={() => (
loggedIn ? (
<Redirect to="/dashboard" />
) : (
<SignUp />
)
)} />
</App>
</Router>,
document.getElementById('app'));
ReactDOM.render(<Footer />, document.getElementById('footer'));
Temporary, I've done it with click handling (prevent default behavior and window.location.reload('some/path')), but it's not a React way.
I'll appreciate any advice.