OSDN Git Service

add the corestatus and sync i18n
authorZhiting Lin <zlin035@uottawa.ca>
Fri, 12 Oct 2018 03:19:09 +0000 (11:19 +0800)
committerZhiting Lin <zlin035@uottawa.ca>
Fri, 12 Oct 2018 03:19:09 +0000 (11:19 +0800)
src/features/app/components/Sync/Sync.jsx
src/features/core/components/CoreIndex/CoreIndex.jsx
src/features/shared/components/SelectField.jsx
src/locales/en/transaltion.json
src/locales/zh/translation.json

index 6be8127..4262e52 100644 (file)
@@ -3,10 +3,12 @@ import { connect } from 'react-redux'
 import { ProgressBar, OverlayTrigger, Tooltip } from 'react-bootstrap'
 import navStyles from '../Navigation/Navigation.scss'
 import styles from './Sync.scss'
+import {withNamespaces} from 'react-i18next'
 
 class Sync extends React.Component {
   render() {
     const coreData = this.props.coreData
+    const t = this.props.t
     if(!coreData){
       return <ul></ul>
     }
@@ -15,7 +17,6 @@ class Sync extends React.Component {
     const peerCount = coreData.peerCount
     const currentBlock = coreData.currentBlock
     const highestBlock = coreData.highestBlock
-    const lang = this.props.lang
 
     const now = ( (highestBlock === 0) ? 0 : (currentBlock * 100/highestBlock))
     const tooltip = (
@@ -27,31 +28,31 @@ class Sync extends React.Component {
 
     if (syncing) {
       return <ul className={`${navStyles.navigation} ${styles.main}`}>
-        <li key='sync-title' className={navStyles.navigationTitle}>{ networkID } { lang === 'zh' ? '同步状态' : 'Sync Status'}</li>
-        <li key='sync-peer-count' className={(peerCount>0)?styles.blockHightlight: null}>{lang === 'zh' ? '连接数' : 'Peer Count'}: {peerCount}</li>
+        <li key='sync-title' className={navStyles.navigationTitle}>{ networkID } { t('sync.status')}</li>
+        <li key='sync-peer-count' className={(peerCount>0)?styles.blockHightlight: null}>{t('sync.peer')}: {peerCount}</li>
         <li key='sync-status'> <OverlayTrigger placement='top' overlay={tooltip}>
-          <div> {lang === 'zh' ? '区块同步中...' : 'Synchronizing...'} {progressInstance} </div>
+          <div> {t('sync.synchronizing')} {progressInstance} </div>
         </OverlayTrigger></li>
       </ul>
     }
 
     const elems = []
 
-    elems.push(<li key='sync-title' className={navStyles.navigationTitle}>{ networkID } { lang === 'zh' ? '同步状态' : 'Sync Status' }</li>)
-    elems.push(<li key='sync-peer-count' className={(peerCount>0)?styles.blockHightlight: null}>{lang === 'zh' ? '连接数' : 'Peer Count'}: {peerCount}</li>)
+    elems.push(<li key='sync-title' className={navStyles.navigationTitle}>{ networkID } {t('sync.status') }</li>)
+    elems.push(<li key='sync-peer-count' className={(peerCount>0)?styles.blockHightlight: null}>{t('sync.peer')}: {peerCount}</li>)
 
     if(!syncing && currentBlock == highestBlock){
       elems.push(<li className={styles.blockHightlight} key='sync-done'>
         <OverlayTrigger placement='top' overlay={tooltip}>
           <div>
-            {lang === 'zh' ? '同步完成 ' : 'Fully synced ' }{progressInstance}
+            {t('sync.synced') }{progressInstance}
           </div>
         </OverlayTrigger>
       </li>)
     }
 
     if(!syncing && currentBlock < highestBlock){
-      elems.push(<li key='sync-disconnect'>{lang === 'zh' ? '同步中断' : 'Disconnect'}</li>)
+      elems.push(<li key='sync-disconnect'>{t('sync.disconnect')}</li>)
     }
 
     return <ul className={`${navStyles.navigation} ${styles.main}`}>{elems}</ul>
@@ -62,4 +63,4 @@ export default connect(
   (state) => ({
     coreData:state.core.coreData
   })
-)(Sync)
+)(withNamespaces('translations')(Sync))
index b881e98..eaa6728 100644 (file)
@@ -5,6 +5,7 @@ import { PageContent, PageTitle, ConsoleSection } from 'features/shared/componen
 import React from 'react'
 import styles from './CoreIndex.scss'
 import actions from 'actions'
+import {withNamespaces} from 'react-i18next'
 
 
 class CoreIndex extends React.Component {
@@ -65,27 +66,27 @@ class CoreIndex extends React.Component {
     let miningState = this.props.core.mingStatus
     let coreData = this.props.core.coreData
 
-    const lang = this.props.core.lang
+    const t = this.props.t
 
     let configBlock = (
       <div className={[styles.left, styles.col].join(' ')}>
         <div>
-          <h4>{lang === 'zh' ? '配置' : 'Configuration'}</h4>
+          <h4>{t('coreIndex.configuration')}</h4>
           <table className={styles.table}>
             <tbody>
             <tr className={styles.row}>
-              <td className={styles.row_label}>{lang === 'zh' ? '核心版本号' : 'Core Versions'}:</td>
+              <td className={styles.row_label}>{t('coreIndex.version')}:</td>
               <td><code>{coreData? coreData['versionInfo']['version']: null}</code></td>
             </tr>
             <tr className={styles.row}>
-              <td className={styles.row_label}>{lang === 'zh' ? '语言' : 'Language'}:</td>
-              <td>{lang === 'zh' ? '中文' : 'English'}</td>
+              <td className={styles.row_label}>{t('commonWords.language')}:</td>
+              <td>{t('languageFull')}</td>
             </tr>
             <tr className={styles.row}>
               <td colSpan={2}><hr /></td>
             </tr>
             <tr className={styles.row}>
-              <td className={styles.row_label}>{lang === 'zh' ? '高级导航选项' : 'Advanced'}: </td>
+              <td className={styles.row_label}>{t('coreIndex.advanced')}: </td>
               <td>
                 <label className={styles.switch}>
                   <input
@@ -98,7 +99,7 @@ class CoreIndex extends React.Component {
               </td>
             </tr>
             <tr className={styles.row}>
-              <td className={styles.row_label}>{lang === 'zh' ? '挖矿' : 'Mining'}: </td>
+              <td className={styles.row_label}>{t('coreIndex.mining')}: </td>
               <td>
                 <label className={styles.switch}>
                   <input
@@ -111,7 +112,7 @@ class CoreIndex extends React.Component {
               </td>
             </tr>
             <tr className={styles.row}>
-              <td className={styles.row_label} >{lang === 'zh' ? '比原数量单位显示' : 'Unit to show amount in'} </td>
+              <td className={styles.row_label} >{t('coreIndex.unit')} </td>
               <td>
                 <DropdownButton
                   bsSize='xsmall'
@@ -139,35 +140,35 @@ class CoreIndex extends React.Component {
     }else {
       requestStatusBlock = (
         <div>
-          <h4>{lang === 'zh' ? '网络状态' : 'Network status'}</h4>
+          <h4>{t('coreIndex.networkStatus')}</h4>
           <table className={styles.table}>
             <tbody>
             <tr className={styles.row} key={'core-listening'}>
-              <td className={styles.row_label}> {lang === 'zh' ? '节点监听' : 'Peer Listening'}:</td>
-              <td className={styles.row_value}>{(coreData['listening'])? (lang === 'zh' ? '连接' : <code>true</code>): (lang === 'zh' ? '断开' : <code>false</code>)}</td>
+              <td className={styles.row_label}> {t('coreIndex.listening')}:</td>
+              <td className={styles.row_value}><code>{(coreData['listening'])? t('coreIndex.connect'): t('coreIndex.disConnect')}</code></td>
             </tr>
             <tr className={styles.row} key={'core-syncing'}>
-              <td className={styles.row_label}> {lang === 'zh' ? '网络同步' : 'Syncing'}:</td>
-              <td className={styles.row_value}>{(coreData['syncing'])? (lang === 'zh' ? '同步中' : <code>true</code>): (lang === 'zh' ? '同步完成' : <code>false</code>)}</td>
+              <td className={styles.row_label}> {t('coreIndex.syncStatus')}:</td>
+              <td className={styles.row_value}><code>{(coreData['syncing'])? t('coreIndex.synchronizing'): t('coreIndex.synced')}</code></td>
             </tr>
             <tr className={styles.row} key={'core-mining'}>
-              <td className={styles.row_label}> {lang === 'zh' ? '挖矿状态' : 'Mining'}:</td>
-              <td className={styles.row_value}>{(coreData['mining'])? (lang === 'zh' ? '运行' : <code>true</code>): (lang === 'zh' ? '停止' :  <code>false</code>)}</td>
+              <td className={styles.row_label}> {t('coreIndex.miningStatus')}:</td>
+              <td className={styles.row_value}><code>{(coreData['mining'])? t('coreIndex.miningRuning'): t('coreIndex.miningStopped')}</code></td>
             </tr>
             <tr className={styles.row} key={'core-peerCount'}>
-              <td className={styles.row_label}> {lang === 'zh' ? '连接数' : 'Peer Count'}:</td>
+              <td className={styles.row_label}> {t('coreIndex.peer')}:</td>
               <td className={styles.row_value}><code>{String(coreData['peerCount'])}</code></td>
             </tr>
             <tr className={styles.row} key={'core-currentBlock'}>
-              <td className={styles.row_label}> {lang === 'zh' ? '当前高度' : 'Current Block'}:</td>
+              <td className={styles.row_label}> {t('coreIndex.currentBlock')}:</td>
               <td className={styles.row_value}><code>{String(coreData['currentBlock'])}</code></td>
             </tr>
             <tr className={styles.row} key={'core-highestBlock'}>
-              <td className={styles.row_label}> {lang === 'zh' ? '最高高度' : 'Highest Block'}:</td>
+              <td className={styles.row_label}> {t('coreIndex.highestBlock')}:</td>
               <td className={styles.row_value}><code>{String(coreData['highestBlock'])}</code></td>
             </tr>
             <tr className={styles.row} key={'core-networkID'}>
-              <td className={styles.row_label}> {lang === 'zh' ? '网络ID' : 'Network Id'}:</td>
+              <td className={styles.row_label}> {t('coreIndex.networkId')}:</td>
               <td className={styles.row_value}><code>{String(coreData['networkId'])}</code></td>
             </tr>
             </tbody>
@@ -187,7 +188,7 @@ class CoreIndex extends React.Component {
     return (
       <div className={componentClassNames(this, 'flex-container', styles.mainContainer)}>
         <PageTitle
-          title={lang === 'zh' ? '核心状态' :'Core Status'}
+          title={t('coreIndex.coreStatus')}
           actions={[
             <button className='btn btn-link' onClick={this.consolePopup}>
               <img src={require('images/console-window.svg')}/>
@@ -232,4 +233,4 @@ const mapDispatchToProps = (dispatch) => ({
 export default connect(
   mapStateToProps,
   mapDispatchToProps
-)(CoreIndex)
+)( withNamespaces('translations') (CoreIndex) )
index 292f796..221ddae 100644 (file)
@@ -2,6 +2,7 @@ import React from 'react'
 import FieldLabel from './FieldLabel/FieldLabel'
 import pick from 'lodash/pick'
 import ReactMarkdown from 'react-markdown'
+import {withNamespaces} from 'react-i18next'
 
 const SELECT_FIELD_PROPS = [
   'value',
@@ -12,9 +13,9 @@ const SELECT_FIELD_PROPS = [
 
 class SelectField extends React.Component {
   render() {
-    const lang = this.props.lang
+    const t = this.props.t
     const options = this.props.options
-    const emptyLabel = this.props.emptyLabel || ((lang === 'zh') ? '请选择...' : 'Select one...')
+    const emptyLabel = this.props.emptyLabel || (t('form.selectPlaceholder'))
     const valueKey = this.props.valueKey || 'value'
     const labelKey = this.props.labelKey || 'label'
 
@@ -42,4 +43,4 @@ class SelectField extends React.Component {
   }
 }
 
-export default SelectField
+export default withNamespaces('translations') (SelectField)
index cdfd280..154a28a 100644 (file)
@@ -1,5 +1,6 @@
 {
   "language": "EN",
+  "languageFull": "English",
   "asset":{
     "asset": "Asset",
     "xpubs":"xpub __id__",
@@ -17,7 +18,8 @@
   },
   "commonWords": {
     "version": "Version",
-    "viewDetails":"View details"
+    "viewDetails":"View details",
+    "language":"Language"
   },
   "form":{
     "detail": "Details",
@@ -27,7 +29,8 @@
     "quorum": "Quorum",
     "index":"Index",
     "keys": "Keys",
-    "key": "Key"
+    "key": "Key",
+    "selectPlaceholder": "Select one..."
   },
   "xpub":{
     "methodOptions" : {
       "provide": "Provide existing xpub"
     },
     "providePlaceholder": "Enter xpub"
+  },
+  "sync":{
+    "status":"Sync Status",
+    "peer":"Peer Count",
+    "synchronizing":"Synchronizing...",
+    "synced":"Fully synced",
+    "disconnect":"Disconnect"
+  },
+  "coreIndex":{
+    "configuration":"Configuration",
+    "version":"Core Versions",
+    "advanced":"Advanced",
+    "mining":"Mining",
+    "unit":"Unit to show amount in",
+    "networkStatus":"Network status",
+    "listening":"Peer Listening",
+    "connect": "true",
+    "disConnect": "false",
+    "syncStatus":"Syncing",
+    "synchronizing":"true",
+    "synced":"false",
+    "miningStatus":"Mining",
+    "miningRuning":"true",
+    "miningStopped":"false",
+    "peer":"Peer Count",
+    "currentBlock":"Current Block",
+    "highestBlock":"Highest Block",
+    "networkId":"Network Id",
+    "coreStatus":"Core Status"
   }
 }
\ No newline at end of file
index e958555..9531401 100644 (file)
@@ -1,5 +1,6 @@
 {
   "language": "中",
+  "languageFull": "中文",
   "asset":{
     "asset": "资产",
     "xpubs":"扩展公钥 __id__",
@@ -17,7 +18,8 @@
   },
   "commonWords": {
     "version": "版本号",
-    "viewDetails":"查看详情"
+    "viewDetails":"查看详情",
+    "language":"语言"
   },
   "form":{
     "detail": "详情",
@@ -27,7 +29,8 @@
     "quorum": "签名数",
     "index":"索引",
     "keys": "密钥数",
-    "key": "密钥"
+    "key": "密钥",
+    "selectPlaceholder": "请选择..."
   },
   "xpub":{
     "methodOptions" : {
       "provide": "提供已有的扩展公钥"
     },
     "providePlaceholder": "输入扩展公钥"
+  },
+  "sync":{
+    "status":"同步状态",
+    "peer":"连接数",
+    "synchronizing":"区块同步中...",
+    "synced":"同步完成",
+    "disconnect":"同步中断"
+  },
+  "coreIndex":{
+    "configuration":"配置",
+    "version":"核心版本号",
+    "advanced":"高级导航选项",
+    "mining":"挖矿",
+    "unit":"比原数量单位显示",
+    "networkStatus":"网络状态",
+    "listening":"节点监听",
+    "connect": "连接",
+    "disConnect": "断开",
+    "syncStatus":"网络同步",
+    "synchronizing":"同步中",
+    "synced":"同步完成",
+    "miningStatus":"挖矿状态",
+    "miningRuning":"运行",
+    "miningStopped":"停止",
+    "peer":"连接数",
+    "currentBlock":"当前高度",
+    "highestBlock":"最高高度",
+    "networkId":"网络ID",
+    "coreStatus":"核心状态"
   }
 }
\ No newline at end of file