OSDN Git Service

add the language to the core status page
authorZhiting Lin <zlin035@uottawa.ca>
Mon, 5 Mar 2018 05:52:26 +0000 (13:52 +0800)
committerZhiting Lin <zlin035@uottawa.ca>
Mon, 5 Mar 2018 05:52:26 +0000 (13:52 +0800)
src/features/app/components/Navigation/Navigation.jsx
src/features/core/components/CoreIndex/CoreIndex.jsx

index 8f47c36..759d3ee 100644 (file)
@@ -72,20 +72,20 @@ class Navigation extends React.Component {
           </li>
         </ul>
 
-        <ul className={`${styles.navigation} ${styles.border}`}>
-          <li className={styles.navigationTitle}>language</li>
-          <li>
-            <DropdownButton
-              className={`btn btn-default ${styles.addAction} ${styles.smallFont} ${styles.langBtn}`}
-              id='input-dropdown-addon'
-              title={this.props.lang === 'zh' ? '中文' : 'English'}
-              onSelect={this.props.setLang}
-            >
-              <MenuItem className={`${styles.smallFont}`} eventKey='zh'>中文</MenuItem>
-              <MenuItem className={`${styles.smallFont}`} eventKey='en'>English</MenuItem>
-            </DropdownButton>
-          </li>
-        </ul>
+        {/*<ul className={`${styles.navigation} ${styles.border}`}>*/}
+          {/*<li className={styles.navigationTitle}>language</li>*/}
+          {/*<li>*/}
+            {/*<DropdownButton*/}
+              {/*className={`btn btn-default ${styles.addAction} ${styles.smallFont} ${styles.langBtn}`}*/}
+              {/*id='input-dropdown-addon'*/}
+              {/*title={this.props.lang === 'zh' ? '中文' : 'English'}*/}
+              {/*onSelect={this.props.setLang}*/}
+            {/*>*/}
+              {/*<MenuItem className={`${styles.smallFont}`} eventKey='zh'>中文</MenuItem>*/}
+              {/*<MenuItem className={`${styles.smallFont}`} eventKey='en'>English</MenuItem>*/}
+            {/*</DropdownButton>*/}
+          {/*</li>*/}
+        {/*</ul>*/}
 
         {/*{<Sync/>}*/}
       </div>
index 6ee0ef4..20894fb 100644 (file)
@@ -1,5 +1,6 @@
 import { chainClient } from 'utility/environment'
 import { connect } from 'react-redux'
+import { DropdownButton, MenuItem } from 'react-bootstrap'
 import componentClassNames from 'utility/componentClassNames'
 import { PageContent, ErrorBanner, PageTitle } from 'features/shared/components'
 import React from 'react'
@@ -13,17 +14,18 @@ class CoreIndex extends React.Component {
   constructor(props) {
     super(props)
     this.state = {}
+    this.deleteClick = this.deleteClick.bind(this)
+  }
 
+  componentDidMount() {
     const fetchInfo = () => {
-      chainClient().config.info().then(resp => {
-        this.setState({requestStatus : resp.data})
-      })
+      if(this.refs.requestComponent) {
+        chainClient().config.info().then(resp => {
+          this.setState({requestStatus: resp.data})
+        })
+      }
     }
-
-
     setInterval(fetchInfo.bind(this), 2 * 1000)
-    this.deleteClick = this.deleteClick.bind(this)
-
   }
 
   deleteClick() {
@@ -69,6 +71,18 @@ class CoreIndex extends React.Component {
       generatorUrl = this.props.core.generatorUrl
     }
 
+    let languageBlock =  (
+      <DropdownButton
+        className={'btn btn-default'}
+        id='input-dropdown-addon'
+        title={this.props.core.lang === 'zh' ? '中文' : 'English'}
+        onSelect={this.props.setLang}
+      >
+        <MenuItem eventKey='zh'>中文</MenuItem>
+        <MenuItem eventKey='en'>English</MenuItem>
+      </DropdownButton>
+    )
+
     let configBlock = (
       <div className={[styles.left, styles.col].join(' ')}>
         <div>
@@ -124,6 +138,13 @@ class CoreIndex extends React.Component {
                 <td className={styles.row_label}>Blockchain ID:</td>
                 <td><code className={styles.block_hash}>{this.props.core.blockchainId}</code></td>
               </tr>
+              <tr>
+                <td colSpan={2}><hr /></td>
+              </tr>
+              <tr>
+                <td className={styles.row_label}>Language:</td>
+                <td><code className={styles.block_hash}>{languageBlock}</code></td>
+              </tr>
             </tbody>
           </table>
         </div>
@@ -139,27 +160,24 @@ class CoreIndex extends React.Component {
       }
     }
 
-    let requestStatusBlock =  this.state.requestStatus && (
-      <div className={styles['sub-row']}>
-        <h4>Request status</h4>
-
-        <table className={styles.table}>
-          <tbody>
-          {Object.keys(this.state.requestStatus).map(key => (
-            <tr key={key}>
-              <td className={styles.row_label}> { key }: </td>
-              <td className={styles.row_value}>{ String(this.state.requestStatus[key])}</td>
-            </tr>))}
-          </tbody>
-        </table>
-
-        {testnetErr && <ErrorBanner title='Chain Testnet error' error={testnetErr} />}
-      </div>
+    let requestStatusBlock =
+        this.state.requestStatus && (<div className={styles['sub-row']}>
+          <h4>Request status</h4>
+          <table className={styles.table}>
+            <tbody>
+            {Object.keys(this.state.requestStatus).map(key => (
+              <tr key={key}>
+                <td className={styles.row_label}> {key}: </td>
+                <td className={styles.row_value}>{ String(this.state.requestStatus[key])}</td>
+              </tr>))}
+            </tbody>
+          </table>
+        </div>
     )
 
     let networkStatusBlock = (
       <div className={styles.right}>
-        {/*<div>*/}
+        <div ref="requestComponent">
           <div className={[styles.top, styles['sub-row']].join(' ')}>
             <h4>Network status</h4>
             <table className={styles.table}>
@@ -181,26 +199,13 @@ class CoreIndex extends React.Component {
               </tbody>
             </table>
           </div>
-
           {requestStatusBlock}
-
-          {testnetErr && <ErrorBanner title='Chain Testnet error' error={testnetErr} />}
         </div>
-
-      // </div>
+        {testnetErr && <ErrorBanner title='Chain Testnet error' error={testnetErr} />}
+      </div>
     )
 
 
-
-
-    // let requestStatusBlock =  this.state.requestStatus && (
-    //   Object.keys(this.state.requestStatus).map(key => (
-    //     <tr key={key}>
-    //       <td className={styles.row_label}> { key }: </td>
-    //       <td className={styles.row_value}>{ String(this.state.requestStatus[key])}</td>
-    //     </tr>))
-    // )
-
     let resetDataBlock = (
       <div className='row'>
         <div className='col-sm-6'>
@@ -243,7 +248,6 @@ class CoreIndex extends React.Component {
             {configBlock}
             {networkStatusBlock}
           </div>
-
           {resetDataBlock}
         </PageContent>
       </div>
@@ -259,7 +263,14 @@ const mapStateToProps = (state) => ({
   testnetNextReset: state.testnet.nextReset,
 })
 
-const mapDispatchToProps = () => ({})
+const mapDispatchToProps = (dispatch) => ({
+  setLang: (event) => {
+    dispatch({
+      type: 'UPDATE_CORE_LANGUAGE',
+      lang: event
+    })
+  }
+})
 
 export default connect(
   mapStateToProps,