diff --git a/ui/app/app.js b/ui/app/app.js
index 6196040b6..339e13fd7 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -37,7 +37,7 @@ const HDRestoreVaultScreen = require('./keychains/hd/restore-vault')
 const RevealSeedConfirmation = require('./keychains/hd/recover-seed/confirmation')
 const ReactCSSTransitionGroup = require('react-addons-css-transition-group')
 
-module.exports = connect(mapStateToProps)(App)
+module.exports = connect(mapStateToProps, mapDispatchToProps)(App)
 
 inherits(App, Component)
 function App () { Component.call(this) }
@@ -67,6 +67,12 @@ function mapStateToProps (state) {
   }
 }
 
+function mapDispatchToProps (dispatch) {
+  return {
+    hideSidebar: () => {dispatch(actions.hideSidebar())},
+  }
+}
+
 App.prototype.render = function () {
   var props = this.props
   const { isLoading, loadingMessage, transForward, network, sidebarOpen } = props
@@ -151,7 +157,10 @@ App.prototype.renderSidebar = function() {
     // overlay
     // TODO: add onClick for overlay to close sidebar
     this.props.sidebarOpen ? h('div.sidebar-overlay', {
-      style: {}
+      style: {},
+      onClick: () => {
+        this.props.hideSidebar()
+      },
     }, []) : undefined,
   ])
 }