Close sidebar on token selection.

2 files changed, 20 insertions, 4 deletions

diff --git a/ui/app/components/token-cell.js b/ui/app/components/token-cell.js
index dc1c7f46f..e87d2c859 100644
--- a/ui/app/components/token-cell.js
+++ b/ui/app/components/token-cell.js
@@ -15,6 +15,7 @@ function mapStateToProps (state) {
     userAddress: selectors.getSelectedAddress(state),
     tokenExchangeRates: state.metamask.tokenExchangeRates,
     ethToUSDRate: state.metamask.conversionRate,
+    sidebarOpen: state.appState.sidebarOpen,
   }
 }
 
@@ -22,6 +23,7 @@ function mapDispatchToProps (dispatch) {
   return {
     setSelectedToken: address => dispatch(actions.setSelectedToken(address)),
     updateTokenExchangeRate: token => dispatch(actions.updateTokenExchangeRate(token)),
+    hideSidebar: () => dispatch(actions.hideSidebar()),
   }
 }
 
@@ -52,6 +54,8 @@ TokenCell.prototype.render = function () {
     selectedTokenAddress,
     tokenExchangeRates,
     ethToUSDRate,
+    hideSidebar,
+    sidebarOpen,
     // userAddress,
   } = props
   
@@ -73,13 +77,16 @@ TokenCell.prototype.render = function () {
     })
     formattedUSD = `$${currentTokenInUSD} USD`;
   }
-
+ 
   return (
     h('div.token-list-item', {
       className: `token-list-item ${selectedTokenAddress === address ? 'token-list-item--active' : ''}`,
       // style: { cursor: network === '1' ? 'pointer' : 'default' },
       // onClick: this.view.bind(this, address, userAddress, network),
-      onClick: () => setSelectedToken(address),
+      onClick: () => {
+        setSelectedToken(address)
+        selectedTokenAddress !== address && sidebarOpen && hideSidebar()
+      },
     }, [
 
       h(Identicon, {
diff --git a/ui/app/components/wallet-view.js b/ui/app/components/wallet-view.js
index b306fb7d4..00c86298d 100644
--- a/ui/app/components/wallet-view.js
+++ b/ui/app/components/wallet-view.js
@@ -40,7 +40,13 @@ function WalletView () {
 }
 
 WalletView.prototype.renderWalletBalance = function () {
-  const { selectedTokenAddress, selectedAccount, unsetSelectedToken } = this.props
+  const {
+    selectedTokenAddress,
+    selectedAccount,
+    unsetSelectedToken,
+    hideSidebar,
+    sidebarOpen
+  } = this.props
   const selectedClass = selectedTokenAddress
     ? ''
     : 'wallet-balance-wrapper--active'
@@ -49,7 +55,10 @@ WalletView.prototype.renderWalletBalance = function () {
   return h('div', { className }, [
     h('div.wallet-balance',
       {
-        onClick: unsetSelectedToken,
+        onClick: () => {
+          unsetSelectedToken()
+          selectedTokenAddress && sidebarOpen && hideSidebar()
+        },
       },
       [
         h(BalanceComponent, {