add the new reset password page

[bytom/bytom-electron.git] / src / features / mockhsm / components / Show.jsx

diff --git a/src/features/mockhsm/components/Show.jsx b/src/features/mockhsm/components/Show.jsx
index 802baff..ee1e7e2 100644 (file)
--- a/src/features/mockhsm/components/Show.jsx
+++ b/src/features/mockhsm/components/Show.jsx
@@ -1,41 +1,36 @@
 import React from 'react'
+import { Link } from 'react-router'
 import {
   BaseShow,
   KeyValueTable,
   PageContent,
   PageTitle,
-  TextField
 } from 'features/shared/components'
+import  ExportKey  from './ExportKey/ExportKey'
 import componentClassNames from 'utility/componentClassNames'
 
 class Show extends BaseShow {
   constructor(props) {
     super(props)
-    this.submitWithErrors = this.submitWithErrors.bind(this)
   }
 
-  submitWithErrors(data) {
-    return new Promise((resolve, reject) => {
-      const arg = {
-        'xpub': this.props.item.xpub,
-        'old_password': data.oldPassword,
-        'new_password': data.newPassword
-      }
-      this.props.submitForm(arg)
-        .catch((err) => reject({_error: err.message}))
-    })
+  showExportKey(item, lang){
+    this.props.showModal(
+      <div>
+        <p>{lang === 'zh' ?  `请输入密码然后导出${item.alias}的私钥：` : `Please enter the password and export ${item.alias}'s private key:`}</p>
+        <ExportKey
+          key='export-key-form' // required by React
+          item={item}
+          lang={lang}
+          exportKey={this.props.exportKey}
+        />
+      </div>
+      )
   }
 
   render() {
     const item = this.props.item
     const lang = this.props.lang
-    const {
-      fields: { oldPassword, newPassword, repeatPassword },
-      handleSubmit,
-      submitting
-    } = this.props
-
-    // let exportPassword
 
     let view
     if (item) {
@@ -55,8 +50,8 @@ class Show extends BaseShow {
             object='key'
             title={lang === 'zh' ? '详情' : 'Details'}
             actions={[
-              <button key='export-key' className='btn btn-link' onClick={this.props.exportKey.bind(this, item)}>
-                { lang === 'zh' ? '导出私钥' : 'Export private key' }</button>,
+              <button key='show-exportkey' className='btn btn-link' onClick={this.showExportKey.bind(this, item, lang)}> {lang === 'zh' ? '导出私钥' : 'Export Private Key' }</button>,
+              <Link className='btn btn-link' to={`/keys/${item.id}/reset-password`}>{lang === 'zh' ? '重置密码' : 'Reset Password' }</Link>
             ]}
             items={[
               {label: 'Alias', value: item.alias},
@@ -64,57 +59,6 @@ class Show extends BaseShow {
             ]}
             lang={lang}
           />
-
-          <h5>Reset password</h5>
-          <form onSubmit={handleSubmit(this.submitWithErrors)}>
-            <TextField
-              title = 'Old Password'
-              placeholder='Please entered the old password.'
-              fieldProps={oldPassword}
-              autoFocus={true} />
-            <TextField
-              title = 'New Password'
-              placeholder='Please entered the new password.'
-              fieldProps={newPassword}
-              autoFocus={true} />
-            <TextField
-              title = 'Repeat Password'
-              placeholder='Please repeated the new password.'
-              fieldProps={repeatPassword}
-              autoFocus={true} />
-
-            <button type='submit' className='btn btn-primary' disabled={submitting}>
-              Reset the password
-            </button>
-          </form>
-
-          {/*<form onSubmit={handleSubmit(this.submitWithErrors)}>*/}
-            {/*<TextField*/}
-              {/*placeholder='Enter the password.'*/}
-              {/*fieldProps={token}*/}
-              {/*autoFocus={true} />*/}
-
-            {/*<button type='submit' className='btn btn-primary' disabled={submitting}>*/}
-              {/*Log In*/}
-            {/*</button>*/}
-          {/*</form>*/}
-          {/*<Section*/}
-            {/*title={ lang === 'zh' ? '导出私钥' : 'Export private key' }*/}
-            {/*>*/}
-            {/*/!*<TextField*!/*/}
-              {/*/!*placeholder='Enter the password'*!/*/}
-              {/*/!*fieldProps={exportPassword}*!/*/}
-              {/*/!*autoFocus={true} />*!/*/}
-            {/*<input type="text"/>*/}
-
-
-          {/*</Section>*/}
-
-          {/*<Section*/}
-            {/*title={ lang === 'zh' ? '重置密码' : 'Reset password' }*/}
-            {/*>*/}
-
-          {/*</Section>*/}
         </PageContent>
       </div>
     }
@@ -126,7 +70,6 @@ class Show extends BaseShow {
 
 import {connect} from 'react-redux'
 import actions from 'actions'
-import {reduxForm} from 'redux-form'
 
 const mapStateToProps = (state, ownProps) => ({
   item: state.key.items[ownProps.params.id],
@@ -135,15 +78,15 @@ const mapStateToProps = (state, ownProps) => ({
 
 const mapDispatchToProps = ( dispatch ) => ({
   fetchItem: (id) => dispatch(actions.key.fetchItems({id: `${id}`})),
-  exportKey: (item) => dispatch(actions.key.createExport(item)),
-  submitForm: (params) => dispatch(actions.key.submitResetForm(params))
+  exportKey: (item, fileName) => dispatch(actions.key.createExport(item, fileName)),
+  showModal: (body) => dispatch(actions.app.showModal(
+    body,
+    actions.app.hideModal
+  )),
 })
 
 
 export default connect(
   mapStateToProps,
   mapDispatchToProps
-)(reduxForm({
-  form: 'ResetPassword',
-  fields: ['oldPassword', 'newPassword', 'repeatPassword' ],
-})(Show))
+)(Show)