aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--package.json1
-rw-r--r--ui/app/accounts/import/index.js6
-rw-r--r--ui/app/accounts/import/json.js75
3 files changed, 77 insertions, 5 deletions
diff --git a/package.json b/package.json
index 2c0c30523..828828753 100644
--- a/package.json
+++ b/package.json
@@ -84,6 +84,7 @@
"react-markdown": "^2.3.0",
"react-redux": "^4.4.5",
"react-select": "^1.0.0-rc.2",
+ "react-simple-file-input": "^1.0.0",
"react-tooltip-component": "^0.3.0",
"readable-stream": "^2.1.2",
"redux": "^3.0.5",
diff --git a/ui/app/accounts/import/index.js b/ui/app/accounts/import/index.js
index 18a6b985c..96350852a 100644
--- a/ui/app/accounts/import/index.js
+++ b/ui/app/accounts/import/index.js
@@ -6,11 +6,11 @@ import Select from 'react-select'
// Subviews
const JsonImportView = require('./json.js')
-const SeedImportView = require('./seed.js')
const PrivateKeyImportView = require('./private-key.js')
const menuItems = [
'Private Key',
+ 'JSON File',
]
module.exports = connect(mapStateToProps)(AccountImportSubview)
@@ -81,10 +81,10 @@ AccountImportSubview.prototype.renderImportView = function() {
const current = type || menuItems[0]
switch (current) {
- case 'HD Key Tree':
- return h(SeedImportView)
case 'Private Key':
return h(PrivateKeyImportView)
+ case 'JSON File':
+ return h(JsonImportView)
default:
return h(JsonImportView)
}
diff --git a/ui/app/accounts/import/json.js b/ui/app/accounts/import/json.js
index 22cf95cfd..1c2b331d4 100644
--- a/ui/app/accounts/import/json.js
+++ b/ui/app/accounts/import/json.js
@@ -2,11 +2,15 @@ const inherits = require('util').inherits
const Component = require('react').Component
const h = require('react-hyperscript')
const connect = require('react-redux').connect
+const actions = require('../../actions')
+const FileInput = require('react-simple-file-input').default
module.exports = connect(mapStateToProps)(JsonImportSubview)
function mapStateToProps (state) {
- return {}
+ return {
+ error: state.appState.warning,
+ }
}
inherits(JsonImportSubview, Component)
@@ -15,13 +19,80 @@ function JsonImportSubview () {
}
JsonImportSubview.prototype.render = function () {
+ const { error } = this.props
+
return (
h('div', {
style: {
+ display: 'flex',
+ flexDirection: 'column',
+ alignItems: 'center',
+ padding: '5px 15px 0px 15px',
},
}, [
- `Upload your json file here!`,
+
+ h('p', 'Used by a variety of different clients'),
+
+ h(FileInput, {
+ readAs: 'text',
+ onLoad: this.onLoad.bind(this),
+ style: {
+ margin: '20px 0px 12px 20px',
+ fontSize: '15px',
+ },
+ }),
+
+ h('input.large-input.letter-spacey', {
+ type: 'password',
+ placeholder: 'Enter password',
+ id: 'json-password-box',
+ onKeyPress: this.createKeyringOnEnter.bind(this),
+ style: {
+ width: 260,
+ marginTop: 12,
+ },
+ }),
+
+ h('button.primary', {
+ onClick: this.createNewKeychain.bind(this),
+ style: {
+ margin: 12,
+ },
+ }, 'Import'),
+
+ error ? h('span.warning', error) : null,
])
)
}
+JsonImportSubview.prototype.onLoad = function (event, file) {
+ this.setState({file: file, fileContents: event.target.result})
+}
+
+JsonImportSubview.prototype.createKeyringOnEnter = function (event) {
+ if (event.key === 'Enter') {
+ event.preventDefault()
+ this.createNewKeychain()
+ }
+}
+
+JsonImportSubview.prototype.createNewKeychain = function () {
+ const state = this.state
+ const { fileContents } = state
+
+ if (!fileContents) {
+ const message = 'You must select a file to import.'
+ return this.props.dispatch(actions.displayWarning(message))
+ }
+
+ const passwordInput = document.getElementById('json-password-box')
+ const password = passwordInput.value
+
+ if (!password) {
+ const message = 'You must enter a password for the selected file.'
+ return this.props.dispatch(actions.displayWarning(message))
+ }
+
+ this.props.dispatch(actions.importNewAccount('JSON File', [ fileContents, password ]))
+}
+