aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/components
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app/components')
-rw-r--r--ui/app/components/dropdowns/network-dropdown.js27
-rw-r--r--ui/app/components/network.js14
2 files changed, 23 insertions, 18 deletions
diff --git a/ui/app/components/dropdowns/network-dropdown.js b/ui/app/components/dropdowns/network-dropdown.js
index 0908faf01..dfaa6b22c 100644
--- a/ui/app/components/dropdowns/network-dropdown.js
+++ b/ui/app/components/dropdowns/network-dropdown.js
@@ -6,6 +6,16 @@ const actions = require('../../actions')
const Dropdown = require('./components/dropdown').Dropdown
const DropdownMenuItem = require('./components/dropdown').DropdownMenuItem
const NetworkDropdownIcon = require('./components/network-dropdown-icon')
+const R = require('ramda')
+
+// classes from nodes of the toggle element.
+const notToggleElementClassnames = [
+ 'menu-icon',
+ 'network-name',
+ 'network-indicator',
+ 'network-caret',
+ 'network-component',
+]
function mapStateToProps (state) {
return {
@@ -32,8 +42,8 @@ function mapDispatchToProps (dispatch) {
showConfigPage: () => {
dispatch(actions.showConfigPage())
},
- showNetworkDropdown: () => { dispatch(actions.showNetworkDropdown()) },
- hideNetworkDropdown: () => { dispatch(actions.hideNetworkDropdown()) },
+ showNetworkDropdown: () => dispatch(actions.showNetworkDropdown()),
+ hideNetworkDropdown: () => dispatch(actions.hideNetworkDropdown()),
}
}
@@ -59,18 +69,13 @@ NetworkDropdown.prototype.render = function () {
}
return h(Dropdown, {
- useCssTransition: true,
isOpen,
onClickOutside: (event) => {
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) {
+ const isInClassList = className => classList.contains(className)
+ const notToggleElementIndex = R.findIndex(isInClassList)(notToggleElementClassnames)
+
+ if (notToggleElementIndex === -1) {
this.props.hideNetworkDropdown()
}
},
diff --git a/ui/app/components/network.js b/ui/app/components/network.js
index 915818009..5a8d0763d 100644
--- a/ui/app/components/network.js
+++ b/ui/app/components/network.js
@@ -39,7 +39,7 @@ Network.prototype.render = function () {
},
src: 'images/loading.svg',
}),
- h('i.fa.fa-caret-down'),
+ h('i.fa.fa-caret-down.network-caret'),
])
} else if (providerName === 'mainnet') {
hoverText = 'Main Ethereum Network'
@@ -63,7 +63,7 @@ Network.prototype.render = function () {
return (
h('div.network-component.pointer', {
- className: classnames('network-component pointer', {
+ className: classnames({
'network-component--disabled': this.props.disabled,
'ethereum-network': providerName === 'mainnet',
'ropsten-test-network': providerName === 'ropsten' || parseInt(networkNumber) === 3,
@@ -90,7 +90,7 @@ Network.prototype.render = function () {
color: '#039396',
}},
'Main Network'),
- h('i.fa.fa-caret-down.fa-lg'),
+ h('i.fa.fa-caret-down.fa-lg.network-caret'),
])
case 'ropsten-test-network':
return h('.network-indicator', [
@@ -103,7 +103,7 @@ Network.prototype.render = function () {
color: '#ff6666',
}},
'Ropsten Test Net'),
- h('i.fa.fa-caret-down.fa-lg'),
+ h('i.fa.fa-caret-down.fa-lg.network-caret'),
])
case 'kovan-test-network':
return h('.network-indicator', [
@@ -116,7 +116,7 @@ Network.prototype.render = function () {
color: '#690496',
}},
'Kovan Test Net'),
- h('i.fa.fa-caret-down.fa-lg'),
+ h('i.fa.fa-caret-down.fa-lg.network-caret'),
])
case 'rinkeby-test-network':
return h('.network-indicator', [
@@ -129,7 +129,7 @@ Network.prototype.render = function () {
color: '#e7a218',
}},
'Rinkeby Test Net'),
- h('i.fa.fa-caret-down.fa-lg'),
+ h('i.fa.fa-caret-down.fa-lg.network-caret'),
])
default:
return h('.network-indicator', [
@@ -145,7 +145,7 @@ Network.prototype.render = function () {
color: '#AEAEAE',
}},
'Private Network'),
- h('i.fa.fa-caret-down.fa-lg'),
+ h('i.fa.fa-caret-down.fa-lg.network-caret'),
])
}
})(),