--- a/client/src/components/Navbar.js	Mon Jun 19 15:05:36 2017 +0200
+++ b/client/src/components/Navbar.js	Mon Jun 19 15:36:52 2017 +0200
@@ -1,8 +1,10 @@
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
 // import logo from './logo.svg';
-import { Navbar, Nav, NavItem } from 'react-bootstrap';
+import { Navbar, Nav, NavItem, NavDropdown, MenuItem } from 'react-bootstrap';
+import * as authActions from '../actions/authActions';
 
 class AppNavbar extends Component {
 
@@ -21,11 +23,19 @@
     this.props.history.push('/login');
   }
 
+  onClickLogout = (e) => {
+    e.preventDefault();
+    this.props.authActions.logout();
+  }
+
   renderLogin() {
 
     if (this.props.currentUser) {
       return (
-        <NavItem>{ this.props.currentUser.username }</NavItem>
+        <NavDropdown title={ this.props.currentUser.username } id="user-dropdown">
+          <MenuItem>Settings</MenuItem>
+          <MenuItem onClick={this.onClickLogout}>Logout</MenuItem>
+        </NavDropdown>
       );
     }
 
@@ -67,4 +77,10 @@
   };
 }
 
-export default connect(mapStateToProps)(AppNavbar);
+function mapDispatchToProps(dispatch) {
+  return {
+    authActions: bindActionCreators(authActions, dispatch),
+  }
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(AppNavbar);