Merge branch 'master' of git://github.com/Bytom/dashboard into dashboardmaster

[bytom/bytom-electron.git] / src / features / app / components / Navigation / Navigation.jsx

diff --git a/src/features/app/components/Navigation/Navigation.jsx b/src/features/app/components/Navigation/Navigation.jsx
index db25d5c..4be4ae3 100644 (file)
--- a/src/features/app/components/Navigation/Navigation.jsx
+++ b/src/features/app/components/Navigation/Navigation.jsx
@@ -1,10 +1,11 @@
 import React from 'react'
 import {connect} from 'react-redux'
-import {DropdownButton, MenuItem} from 'react-bootstrap'
 import {Link} from 'react-router'
 import styles from './Navigation.scss'
 import {navIcon} from '../../utils'
 import Sync from '../Sync/Sync'
+import appAction from '../../../app/actions'
+import {docsRoot} from '../../../../utility/environment'
 
 class Navigation extends React.Component {
   constructor(props) {
@@ -13,6 +14,14 @@ class Navigation extends React.Component {
     this.openTutorial = this.openTutorial.bind(this)
   }
 
+  componentDidMount() {
+    if(window.ipcRenderer){
+      window.ipcRenderer.on('toggleNavState', (event, arg) => {
+        arg === 'advance'? this.props.showNavAdvanced() : this.props.hideNavAdvanced()
+      })
+    }
+  }
+
   openTutorial(event) {
     event.preventDefault()
     this.props.openTutorial()
@@ -23,10 +32,11 @@ class Navigation extends React.Component {
     return (
       <div className={styles.main}>
         <ul className={styles.navigation}>
-          <li className={styles.navigationTitle}>core data</li>
+          <li className={styles.navigationTitle}>{lang === 'zh' ? '核心数据' : 'core data'}</li>
           <li>
             <Link to='/transactions' activeClassName={styles.active}>
               {navIcon('transaction', styles)}
+              {}
               {lang === 'zh' ? '交易' : 'Transactions'}
             </Link>
           </li>
@@ -51,7 +61,7 @@ class Navigation extends React.Component {
         </ul>
 
         <ul className={styles.navigation}>
-          <li className={styles.navigationTitle}>services</li>
+          <li className={styles.navigationTitle}>{lang === 'zh' ? '服务' : 'services' }</li>
           {this.props.mockhsm &&
           <li>
             <Link to='/keys' activeClassName={styles.active}>
@@ -62,32 +72,40 @@ class Navigation extends React.Component {
           }
         </ul>
 
-        <ul className={styles.navigation}>
-          <li className={styles.navigationTitle}>advanced</li>
+        { this.props.showNavAdvance && <ul className={styles.navigation}>
+          <li className={styles.navigationTitle}>{lang === 'zh' ? '高级' : 'advanced' }</li>
           <li>
             <Link to='/unspents' activeClassName={styles.active}>
               {navIcon('unspent', styles)}
-              Unspent outputs
+              {lang === 'zh' ? '未花费输出' : 'Unspent outputs' }
             </Link>
           </li>
+        </ul>}
+
+        <ul className={styles.navigation}>
+          <li className={styles.navigationTitle}>{lang === 'zh' ? '帮助' : 'help' }</li>
+          <li>
+            <a href={docsRoot} target='_blank'>
+              {navIcon('docs', styles)}
+              {lang === 'zh' ? '文档' : 'Documentation'}
+            </a>
+          </li>
         </ul>
 
-        <ul className={`${styles.navigation} ${styles.border}`}>
-          <li className={styles.navigationTitle}>language</li>
+        <ul className={styles.navigation}>
+          <li className={styles.navigationTitle}>{lang === 'zh' ? '开发者' : 'Developer' }</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>
+            <a href='/equity' target='_blank'>
+              {navIcon('transaction', styles)}
+              {lang === 'zh' ? 'Equity 合约' : 'Equity Contract'}
+            </a>
           </li>
         </ul>
 
-        {<Sync/>}
+        <Sync
+          lang={lang}
+        />
+
       </div>
     )
   }
@@ -103,15 +121,18 @@ export default connect(
     }
 
     return {
+      coreData: state.core.coreData,
       routing: state.routing, // required for <Link>s to update active state on navigation
       showSync: state.core.configured && !state.core.generator,
       lang: state.core.lang,
       mockhsm: true,
-      docVersion
+      docVersion,
+      showNavAdvance: state.app.navAdvancedState === 'advance'
     }
   },
   (dispatch) => ({
-    openTutorial: () => dispatch({type: 'OPEN_TUTORIAL'}),
+    showNavAdvanced: () => dispatch(appAction.showNavAdvanced),
+    hideNavAdvanced: () => dispatch(appAction.hideNavAdvanced),
     setLang: (event) => {
       dispatch({
         type: 'UPDATE_CORE_LANGUAGE',