73 lines
2.8 KiB
JavaScript
73 lines
2.8 KiB
JavaScript
import React, { Component } from 'react'
|
|
import { constants } from '../../utils/constants'
|
|
|
|
export default class NetworkSelect extends Component {
|
|
changeNetworkRPC(e) {
|
|
e.preventDefault()
|
|
let getCurrentClickedLink = e.target.innerHTML
|
|
let getCurrentClickedLinkId = ''
|
|
for (const _netId in constants.NETWORKS) {
|
|
if (constants.NETWORKS[_netId].FULLNAME === getCurrentClickedLink) {
|
|
getCurrentClickedLinkId = _netId
|
|
}
|
|
}
|
|
this.props.onChange({ value: getCurrentClickedLinkId })
|
|
}
|
|
|
|
render() {
|
|
let networkFullNames = []
|
|
let currentNetworkFullName = ''
|
|
|
|
const networks = constants.NETWORKS
|
|
|
|
let netIds = []
|
|
Object.keys(networks)
|
|
.sort((a, b) => (networks[a].SORTORDER > networks[b].SORTORDER ? 1 : -1))
|
|
.forEach(function(_netId) {
|
|
netIds.push(_netId)
|
|
})
|
|
|
|
let selectedNetworkIndex = -1
|
|
|
|
netIds.forEach(_netId => {
|
|
networkFullNames.push(networks[_netId].FULLNAME)
|
|
if (networks[_netId].BRANCH === this.props.networkBranch) {
|
|
currentNetworkFullName = networks[_netId].FULLNAME
|
|
selectedNetworkIndex = networkFullNames.length - 1
|
|
}
|
|
})
|
|
|
|
const listItems = networkFullNames.map((name, index) => {
|
|
let className = ''
|
|
if (index === selectedNetworkIndex) {
|
|
className = 'currentNetwork'
|
|
}
|
|
return (
|
|
<li key={name.toString()} className={className}>
|
|
<button onClick={e => this.changeNetworkRPC(e)}>{name}</button>
|
|
</li>
|
|
)
|
|
})
|
|
|
|
return (
|
|
<div className={`NetworkSelect nl-NavigationLinks_Link opacityFull`}>
|
|
<div className={`NetworkSelect_Top`}>
|
|
<svg className={`nl-IconNetwork`} xmlns="http://www.w3.org/2000/svg" width="18" height="18">
|
|
<path
|
|
className={`nl-IconNetwork_Path nl-IconNetwork_Path-${this.props.networkBranch}`}
|
|
d="M9 18a9 9 0 0 1-9-9 9 9 0 0 1 9-9 9 9 0 0 1 9 9 9 9 0 0 1-9 9zm6.923-8h-1.974c-.116 1.85-.525 3.539-1.167 4.876A6.993 6.993 0 0 0 15.923 10zM9 16c1.51 0 2.747-2.612 2.957-6H6.043c.21 3.388 1.447 6 2.957 6zm-3.782-1.124C4.576 13.539 4.167 11.85 4.051 10H2.077a6.993 6.993 0 0 0 3.141 4.876zM2.077 8h1.974c.116-1.85.525-3.538 1.167-4.876A6.993 6.993 0 0 0 2.077 8zM9 2C7.49 2 6.253 4.612 6.043 8h5.914C11.747 4.612 10.51 2 9 2zm3.782 1.124C13.424 4.462 13.833 6.15 13.949 8h1.974a6.993 6.993 0 0 0-3.141-4.876z"
|
|
/>
|
|
</svg>
|
|
<span className={`nl-NavigationLinks_Text nl-NavigationLinks_Text-${this.props.networkBranch}`}>
|
|
{currentNetworkFullName}
|
|
</span>
|
|
<svg className={`nl-IconNetwork_Arrow`} xmlns="http://www.w3.org/2000/svg" width="8" height="4">
|
|
<path d="M0 0h8L4 4 0 0z" />
|
|
</svg>
|
|
</div>
|
|
<ul className={`NetworkSelect_List`}>{listItems}</ul>
|
|
</div>
|
|
)
|
|
}
|
|
}
|