Issue with Routing logic and React Router v4 - reactjs

Question

Im building a small application where i have used ReactJs for the front end and node express with jwt and passport in back end. Im using react router v4 and i have configured the applications routes like this.
import React,{Component} from 'react';
import Login from './login/login';
import Signup from './signup/signup';
import Account from './account/account';
import Navigation from './navigation/navigation';
import Newsfeeds from './newsfeed/feedcontainer';
import Test from './test';
import NotMatch from './nomatch/Notmatch';
import injectTapEventPlugin from 'react-tap-event-plugin';
import createBrowserHistory from 'history/createBrowserHistory';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import { BrowserRouter as Router, Route, Switch, Redirect } from 'react-router-dom';
const history = createBrowserHistory({});
injectTapEventPlugin();
let hasToken = () => {
const token = localStorage.getItem('jwtToken');
return (token == undefined);
}
class App extends Component{
render(){
return(
<MuiThemeProvider>
<Router history={history}>
<Switch>
<Route path="/login" exact component={Login}/>
<Route path="/signup" exact component={Signup}/>
<Route path="/test" exact component={Test}/>
<Navigation>
<Route path="/account" exact render={() => (hasToken() ? (<Account />) : (<Redirect to="/login"/>))}/>
<Route path="/home" exact render={() => (hasToken() ? (<Newsfeeds />) : (<Redirect to="/login"/>))}/>
</Navigation>
<Route component={NotMatch}/>
</Switch>
</Router>
</MuiThemeProvider>
);
}
}
export default App;
The code for logout
<Link to="/login"><MenuItem primaryText="Logout" onTouchTap={e=>{localStorage.clear();}}></MenuItem></Link>
When ever i try to logout(clear my localstorage and redirect to login route) it gets stuck in loop and the app breaks. How to avoid this?
How to restrict/authenticate routes. When already logged switch to home page when user tries to move to /login or /signup routes.