1 import { connect } from 'react-redux'
2 import {DropdownButton, MenuItem} from 'react-bootstrap'
3 import componentClassNames from 'utility/componentClassNames'
4 import { PageContent, PageTitle, ConsoleSection } from 'features/shared/components'
5 import React from 'react'
6 import styles from './CoreIndex.scss'
7 import actions from 'actions'
8 import {withNamespaces} from 'react-i18next'
11 class CoreIndex extends React.Component {
17 this.handleMiningState = this.handleMiningState.bind(this)
18 this.handleAdvancedOptionChange = this.handleAdvancedOptionChange.bind(this)
19 this.changeBTMamount = this.changeBTMamount.bind(this)
20 this.consolePopup = this.consolePopup.bind(this)
24 if(window.ipcRenderer){
25 window.ipcRenderer.on('btmAmountUnitState', (event, arg) => {
26 this.props.uptdateBtmAmountUnit(arg)
31 changeBTMamount(value) {
32 this.setState({ btmAmountUnit: value })
33 this.props.uptdateBtmAmountUnit(value)
36 handleAdvancedOptionChange(event) {
37 const target = event.target
39 this.props.showNavAdvanced()
41 this.props.hideNavAdvanced()
45 handleMiningState(event){
46 const target = event.target
48 this.props.updateMiningState(true)
50 this.props.updateMiningState(false)
64 let navState = this.props.navAdvancedState === 'advance'
65 let miningState = this.props.core.mingStatus
66 let coreData = this.props.core.coreData
68 const t = this.props.t
71 <div className={[styles.left, styles.col].join(' ')}>
73 <h4>{t('coreIndex.configuration')}</h4>
74 <table className={styles.table}>
76 <tr className={styles.row}>
77 <td className={styles.row_label}>{t('coreIndex.version')}:</td>
78 <td><code>{coreData? coreData['versionInfo']['version']: null}</code></td>
80 <tr className={styles.row}>
81 <td className={styles.row_label}>{t('commonWords.language')}:</td>
82 <td>{t('languageFull')}</td>
84 <tr className={styles.row}>
85 <td colSpan={2}><hr /></td>
87 <tr className={styles.row}>
88 <td className={styles.row_label}>{t('coreIndex.advanced')}: </td>
90 <label className={styles.switch}>
93 onChange={this.handleAdvancedOptionChange}
96 <span className={styles.slider}></span>
100 <tr className={styles.row}>
101 <td className={styles.row_label}>{t('coreIndex.mining')}: </td>
103 <label className={styles.switch}>
106 onChange={this.handleMiningState}
107 checked={miningState}
109 <span className={styles.slider}></span>
113 <tr className={styles.row}>
114 <td className={styles.row_label} >{t('coreIndex.unit')} </td>
118 id='input-dropdown-amount'
119 title={this.props.core.btmAmountUnit || this.state.btmAmountUnit}
120 onSelect={this.changeBTMamount}
122 <MenuItem eventKey='BTM'>BTM</MenuItem>
123 <MenuItem eventKey='mBTM'>mBTM</MenuItem>
124 <MenuItem eventKey='NEU'>NEU</MenuItem>
134 let requestStatusBlock
138 requestStatusBlock = (<div>loading...</div>)
140 requestStatusBlock = (
142 <h4>{t('coreIndex.networkStatus')}</h4>
143 <table className={styles.table}>
145 <tr className={styles.row} key={'core-listening'}>
146 <td className={styles.row_label}> {t('coreIndex.listening')}:</td>
147 <td className={styles.row_value}><code>{(coreData['listening'])? t('coreIndex.connect'): t('coreIndex.disConnect')}</code></td>
149 <tr className={styles.row} key={'core-syncing'}>
150 <td className={styles.row_label}> {t('coreIndex.syncStatus')}:</td>
151 <td className={styles.row_value}><code>{(coreData['syncing'])? t('coreIndex.synchronizing'): t('coreIndex.synced')}</code></td>
153 <tr className={styles.row} key={'core-mining'}>
154 <td className={styles.row_label}> {t('coreIndex.miningStatus')}:</td>
155 <td className={styles.row_value}><code>{(coreData['mining'])? t('coreIndex.miningRuning'): t('coreIndex.miningStopped')}</code></td>
157 <tr className={styles.row} key={'core-peerCount'}>
158 <td className={styles.row_label}> {t('coreIndex.peer')}:</td>
159 <td className={styles.row_value}><code>{String(coreData['peerCount'])}</code></td>
161 <tr className={styles.row} key={'core-currentBlock'}>
162 <td className={styles.row_label}> {t('coreIndex.currentBlock')}:</td>
163 <td className={styles.row_value}><code>{String(coreData['currentBlock'])}</code></td>
165 <tr className={styles.row} key={'core-highestBlock'}>
166 <td className={styles.row_label}> {t('coreIndex.highestBlock')}:</td>
167 <td className={styles.row_value}><code>{String(coreData['highestBlock'])}</code></td>
169 <tr className={styles.row} key={'core-networkID'}>
170 <td className={styles.row_label}> {t('coreIndex.networkId')}:</td>
171 <td className={styles.row_value}><code>{String(coreData['networkId'])}</code></td>
179 let networkStatusBlock = (
180 <div className={[styles.right, styles.col].join(' ')}>
181 {/*<div ref='requestComponent'>*/}
188 <div className={componentClassNames(this, 'flex-container')}>
190 title={t('coreIndex.coreStatus')}
192 <button className='btn btn-link' onClick={this.consolePopup}>
193 <img src={require('images/console-window.svg')}/>
199 <div className={`${styles.flex} ${styles.mainContainer}`}>
209 const mapStateToProps = (state) => ({
211 navAdvancedState: state.app.navAdvancedState,
214 const mapDispatchToProps = (dispatch) => ({
215 showNavAdvanced: () => dispatch(actions.app.showNavAdvanced),
216 hideNavAdvanced: () => dispatch(actions.app.hideNavAdvanced),
217 uptdateBtmAmountUnit: (param) => dispatch(actions.core.updateBTMAmountUnit(param)),
218 updateMiningState: (param) => dispatch(actions.core.updateMiningState(param)),
219 showModal: (body) => dispatch(actions.app.showModal(
221 actions.app.hideModal,
229 cmd: (data) => dispatch(actions.app.cmd(data))
232 export default connect(
235 )( withNamespaces('translations') (CoreIndex) )