From 24d375aaf1717f1ae743fbe6e83eb50f0e6a4b95 Mon Sep 17 00:00:00 2001
From: sdtsui <szehungdanieltsui@gmail.com>
Date: Fri, 28 Jul 2017 15:31:03 -0700
Subject: Fix dropdown toggle behavior - account dropdowns

---
 ui/app/components/account-dropdowns.js | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

(limited to 'ui/app')

diff --git a/ui/app/components/account-dropdowns.js b/ui/app/components/account-dropdowns.js
index 61f32f713..2813f4752 100644
--- a/ui/app/components/account-dropdowns.js
+++ b/ui/app/components/account-dropdowns.js
@@ -17,6 +17,8 @@ class AccountDropdowns extends Component {
       accountSelectorActive: false,
       optionsMenuActive: false,
     }
+    this.accountSelectorToggleClassName = 'fa-angle-down';
+    this.optionsMenuToggleClassName = 'fa-ellipsis-h';
   }
 
   renderAccounts () {
@@ -63,7 +65,13 @@ class AccountDropdowns extends Component {
           maxHeight: '300px',
         },
         isOpen: accountSelectorActive,
-        onClickOutside: () => { this.setState({ accountSelectorActive: false }) },
+        onClickOutside: (event) => {
+          const { classList } = event.target
+          const isNotToggleElement = !classList.contains(this.accountSelectorToggleClassName)
+          if (accountSelectorActive && isNotToggleElement) {
+            this.setState({ accountSelectorActive: false })
+          }
+        },
       },
       [
         ...this.renderAccounts(),
@@ -115,7 +123,13 @@ class AccountDropdowns extends Component {
           minWidth: '180px',
         },
         isOpen: optionsMenuActive,
-        onClickOutside: () => { this.setState({ optionsMenuActive: false }) },
+        onClickOutside: () => {
+          const { classList } = event.target
+          const isNotToggleElement = !classList.contains(this.optionsMenuToggleClassName)
+          if (optionsMenuActive && isNotToggleElement) {
+            this.setState({ optionsMenuActive: false })
+          }
+        },
       },
       [
         h(
-- 
cgit 


From 34834c108dafd1de75f26a09d78feb8949ef5e56 Mon Sep 17 00:00:00 2001
From: sdtsui <szehungdanieltsui@gmail.com>
Date: Fri, 28 Jul 2017 15:40:26 -0700
Subject: Fix dropdown toggle behavior - settings

---
 ui/app/app.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

(limited to 'ui/app')

diff --git a/ui/app/app.js b/ui/app/app.js
index b251baefd..f293e89bd 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -308,7 +308,11 @@ App.prototype.renderDropdown = function () {
     isOpen: isOpen,
     zIndex: 11,
     onClickOutside: (event) => {
-      this.setState({ isMainMenuOpen: !isOpen })
+      const { classList } = event.target
+      const isNotToggleElement = !classList.contains('sandwich-expando')
+      if (isNotToggleElement) {
+        this.setState({ isMainMenuOpen: false })
+      }
     },
     style: {
       position: 'absolute',
-- 
cgit 


From 4044b58b5a7133caeefd0f3c0a16478387fe7247 Mon Sep 17 00:00:00 2001
From: sdtsui <szehungdanieltsui@gmail.com>
Date: Fri, 28 Jul 2017 15:55:55 -0700
Subject: Fix dropdown behavior - network

---
 ui/app/app.js | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

(limited to 'ui/app')

diff --git a/ui/app/app.js b/ui/app/app.js
index f293e89bd..8fad0f7d6 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -198,7 +198,17 @@ App.prototype.renderNetworkDropdown = function () {
   return h(Dropdown, {
     isOpen,
     onClickOutside: (event) => {
-      this.setState({ isNetworkMenuOpen: !isOpen })
+      const { classList } = event.target
+      const isNotToggleElement = [
+        classList.contains('menu-icon'),
+        classList.contains('network-name'),
+        classList.contains('network-indicator'),
+      ].filter(bool => bool).length === 0;
+      // classes from three constituent nodes of the toggle element
+
+      if (isNotToggleElement) {
+        this.setState({ isNetworkMenuOpen: false })
+      }
     },
     zIndex: 11,
     style: {
-- 
cgit