status-im
/
MyCrypto
mirror of https://github.com/status-im/MyCrypto.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Create NodeDropdownComponent with working, adjustable local state.

This commit is contained in:
Daniel Ternyak 2017-04-13 20:25:28 -05:00
parent f91f47b877
commit 2fc8cf4116
1 changed files with 134 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

134
common/components/Header/components/NodeDropdownComponent.jsx Normal file
View File

@ -0,0 +1,134 @@
import React, {Component} from 'react';
const nodeList = [
{
'name': 'ETH',
'blockExplorerTX': 'https://etherscan.io/tx/[[txHash]]',
'blockExplorerAddr': 'https://etherscan.io/address/[[address]]',
// 'type': nodes.nodeTypes.ETH,
'eip155': true,
'chainId': 1,
// 'tokenList': require('./tokens/ethTokens.json'),
// 'abiList': require('./abiDefinitions/ethAbi.json'),
'estimateGas': true,
'service': 'MyEtherWallet',
// 'lib': new nodes.customNode('https://api.myetherapi.com/eth', '')
},
{
'name': 'ETH',
'blockExplorerTX': 'https://etherscan.io/tx/[[txHash]]',
'blockExplorerAddr': 'https://etherscan.io/address/[[address]]',
// 'type': nodes.nodeTypes.ETH,
'eip155': true,
'chainId': 1,
// 'tokenList': require('./tokens/ethTokens.json'),
// 'abiList': require('./abiDefinitions/ethAbi.json'),
'estimateGas': false,
'service': 'Etherscan.io',
// 'lib': require('./nodeHelpers/etherscan')
},
{
'name': 'Ropsten',
// 'type': nodes.nodeTypes.Ropsten,
'blockExplorerTX': 'https://ropsten.etherscan.io/tx/[[txHash]]',
'blockExplorerAddr': 'https://ropsten.etherscan.io/address/[[address]]',
'eip155': true,
'chainId': 3,
// 'tokenList': require('./tokens/ropstenTokens.json'),
// 'abiList': require('./abiDefinitions/ropstenAbi.json'),
'estimateGas': false,
'service': 'MyEtherWallet',
// 'lib': new nodes.customNode('https://api.myetherapi.com/rop', '')
},
{
'name': 'Kovan',
// 'type': nodes.nodeTypes.Kovan,
'blockExplorerTX': 'https://kovan.etherscan.io/tx/[[txHash]]',
'blockExplorerAddr': 'https://kovan.etherscan.io/address/[[address]]',
'eip155': true,
'chainId': 42,
// 'tokenList': require('./tokens/kovanTokens.json'),
// 'abiList': require('./abiDefinitions/kovanAbi.json'),
'estimateGas': false,
'service': 'Etherscan.io',
// 'lib': require('./nodeHelpers/etherscanKov')
},
{
'name': 'ETC',
'blockExplorerTX': 'https://gastracker.io/tx/[[txHash]]',
'blockExplorerAddr': 'https://gastracker.io/addr/[[address]]',
// 'type': nodes.nodeTypes.ETC,
'eip155': true,
'chainId': 61,
// 'tokenList': require('./tokens/etcTokens.json'),
// 'abiList': require('./abiDefinitions/etcAbi.json'),
'estimateGas': false,
'service': 'Epool.io',
// 'lib': new nodes.customNode('https://mewapi.epool.io', '')
}
]
export default class NodeDropdownComponent extends Component {
constructor(props) {
super(props);
this.state = {
nodeToggle: false,
nodeSelection: 0
}
}
customNodeModalOpen() {
}
changeNode(i) {
let nextState = this.state;
nextState["nodeSelection"] = i;
nextState['nodeToggle'] = false;
this.setState(nextState);
}
nodeToggle() {
let nextState = this.state;
nextState['nodeToggle'] = !nextState['nodeToggle'];
this.setState(nextState)
}
render() {
return (
<span className="dropdown">
<a tabIndex="0"
aria-haspopup="true"
aria-label="change node. current node ETH node by MyEtherWallet"
className="dropdown-toggle" onClick={() => this.nodeToggle()}>
{nodeList[this.state.nodeSelection].name}
<small>{' '} ({nodeList[this.state.nodeSelection].service})</small>
<i className="caret"/>
</a>
{
this.state.nodeToggle &&
<ul className="dropdown-menu">
{nodeList.map((object, i) => {
return (
<li key={i} onClick={() => this.changeNode(i)}>
<a>
{object.name}
<small className={i === this.state.nodeSelection ? 'active' : ''}>
({object.service})
</small>
</a>
</li>
)
})}
<li>
<a onClick={this.customNodeModalOpen()}>
Add Custom Node
</a>
</li>
</ul>
}
</span>
)
}
}