aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app')
-rw-r--r--ui/app/accounts/import/index.js6
-rw-r--r--ui/app/accounts/import/json.js75
-rw-r--r--ui/app/accounts/import/private-key.js3
-rw-r--r--ui/app/actions.js19
-rw-r--r--ui/app/app.js5
-rw-r--r--ui/app/components/loading.js8
-rw-r--r--ui/app/conf-tx.js2
-rw-r--r--ui/app/reducers/app.js1
8 files changed, 107 insertions, 12 deletions
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 ]))
+}
+
diff --git a/ui/app/accounts/import/private-key.js b/ui/app/accounts/import/private-key.js
index 6b988a76b..b139a0374 100644
--- a/ui/app/accounts/import/private-key.js
+++ b/ui/app/accounts/import/private-key.js
@@ -2,7 +2,6 @@ const inherits = require('util').inherits
const Component = require('react').Component
const h = require('react-hyperscript')
const connect = require('react-redux').connect
-const type = 'Simple Key Pair'
const actions = require('../../actions')
module.exports = connect(mapStateToProps)(PrivateKeyImportView)
@@ -64,6 +63,6 @@ PrivateKeyImportView.prototype.createKeyringOnEnter = function (event) {
PrivateKeyImportView.prototype.createNewKeychain = function () {
const input = document.getElementById('private-key-box')
const privateKey = input.value
- this.props.dispatch(actions.addNewKeyring(type, [ privateKey ]))
+ this.props.dispatch(actions.importNewAccount('Private Key', [ privateKey ]))
}
diff --git a/ui/app/actions.js b/ui/app/actions.js
index 5b2ad8a79..78af80886 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -43,6 +43,7 @@ var actions = {
createNewVaultAndRestore: createNewVaultAndRestore,
createNewVaultInProgress: createNewVaultInProgress,
addNewKeyring,
+ importNewAccount,
addNewAccount,
NEW_ACCOUNT_SCREEN: 'NEW_ACCOUNT_SCREEN',
navigateToNewAccountScreen,
@@ -278,6 +279,21 @@ function addNewKeyring (type, opts) {
}
}
+function importNewAccount (strategy, args) {
+ return (dispatch) => {
+ dispatch(actions.showLoadingIndication('This may take a while, be patient.'))
+ background.importAccountWithStrategy(strategy, args, (err, newState) => {
+ dispatch(actions.hideLoadingIndication())
+ if (err) return dispatch(actions.displayWarning(err.message))
+ dispatch(actions.updateMetamaskState(newState))
+ dispatch({
+ type: actions.SHOW_ACCOUNT_DETAIL,
+ value: newState.selectedAccount,
+ })
+ })
+ }
+}
+
function navigateToNewAccountScreen() {
return {
type: this.NEW_ACCOUNT_SCREEN,
@@ -628,9 +644,10 @@ function useEtherscanProvider () {
}
}
-function showLoadingIndication () {
+function showLoadingIndication (message) {
return {
type: actions.SHOW_LOADING,
+ value: message,
}
}
diff --git a/ui/app/app.js b/ui/app/app.js
index 0e04c334c..d8dedd397 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -43,6 +43,7 @@ function mapStateToProps (state) {
return {
// state from plugin
isLoading: state.appState.isLoading,
+ loadingMessage: state.appState.loadingMessage,
isDisclaimerConfirmed: state.metamask.isDisclaimerConfirmed,
noActiveNotices: state.metamask.noActiveNotices,
isInitialized: state.metamask.isInitialized,
@@ -64,7 +65,7 @@ function mapStateToProps (state) {
App.prototype.render = function () {
var props = this.props
- const { isLoading, transForward } = props
+ const { isLoading, loadingMessage, transForward } = props
return (
@@ -76,7 +77,7 @@ App.prototype.render = function () {
},
}, [
- h(LoadingIndicator, { isLoading }),
+ h(LoadingIndicator, { isLoading, loadingMessage }),
// app bar
this.renderAppBar(),
diff --git a/ui/app/components/loading.js b/ui/app/components/loading.js
index ae735894f..88dc535df 100644
--- a/ui/app/components/loading.js
+++ b/ui/app/components/loading.js
@@ -12,7 +12,7 @@ function LoadingIndicator () {
}
LoadingIndicator.prototype.render = function () {
- var isLoading = this.props.isLoading
+ const { isLoading, loadingMessage } = this.props
return (
h(ReactCSSTransitionGroup, {
@@ -37,8 +37,14 @@ LoadingIndicator.prototype.render = function () {
h('img', {
src: 'images/loading.svg',
}),
+
+ showMessageIfAny(loadingMessage),
]) : null,
])
)
}
+function showMessageIfAny (loadingMessage) {
+ if (!loadingMessage) return null
+ return h('span', loadingMessage)
+}
diff --git a/ui/app/conf-tx.js b/ui/app/conf-tx.js
index a6e03c3ed..1bd69f7d9 100644
--- a/ui/app/conf-tx.js
+++ b/ui/app/conf-tx.js
@@ -134,7 +134,7 @@ ConfirmTxScreen.prototype.checkBalanceAgainstTx = function (txData) {
var address = txData.txParams.from || state.selectedAccount
var account = state.accounts[address]
var balance = account ? account.balance : '0x0'
- var maxCost = new BN(txData.maxCost)
+ var maxCost = new BN(txData.maxCost, 16)
var balanceBn = new BN(ethUtil.stripHexPrefix(balance), 16)
return maxCost.gt(balanceBn)
diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js
index ae91272cc..6a2c93f78 100644
--- a/ui/app/reducers/app.js
+++ b/ui/app/reducers/app.js
@@ -386,6 +386,7 @@ function reduceApp (state, action) {
case actions.SHOW_LOADING:
return extend(appState, {
isLoading: true,
+ loadingMessage: action.value,
})
case actions.HIDE_LOADING: