From 4e1d8ba19db729f5c282c4e3c6b43433b562a45e Mon Sep 17 00:00:00 2001 From: brunobar79 Date: Mon, 13 Aug 2018 19:29:43 -0400 Subject: good progress adding paths --- .../connect-hardware/account-list.js | 41 ++++++++++++++++++++- .../pages/create-account/connect-hardware/index.js | 43 ++++++++++++++++------ 2 files changed, 71 insertions(+), 13 deletions(-) (limited to 'ui/app/components/pages') diff --git a/ui/app/components/pages/create-account/connect-hardware/account-list.js b/ui/app/components/pages/create-account/connect-hardware/account-list.js index ac020345a..4c6cc67f9 100644 --- a/ui/app/components/pages/create-account/connect-hardware/account-list.js +++ b/ui/app/components/pages/create-account/connect-hardware/account-list.js @@ -2,16 +2,53 @@ const { Component } = require('react') const PropTypes = require('prop-types') const h = require('react-hyperscript') const genAccountLink = require('../../../../../lib/account-link.js') +const Select = require('react-select').default class AccountList extends Component { constructor (props, context) { super(props) } + getHdPaths () { + return [ + { + label: `m/44'/60'/0' (Legacy)`, + value: `m/44'/60'/0'`, + }, + { + label: `m/44'/60'/0'/0`, + value: `m/44'/60'/0'/0'`, + }, + ] + } + + renderHdPathSelector () { + const { onPathChange, selectedPath } = this.props + + const options = this.getHdPaths() + return h('div.hw-connect__hdPath', [ + h('h3.hw-connect__hdPath__title', {}, `HD Path`), + h(Select, { + className: 'hw-connect__hdPath__select', + name: 'hd-path-select', + clearable: false, + value: selectedPath, + options, + onChange: (opt) => { + onPathChange(opt.value) + }, + }), + ]) + } renderHeader () { + const { device } = this.props return ( h('div.hw-connect', [ - h('h3.hw-connect__title', {}, `${this.props.device.toUpperCase()} - ${this.context.t('selectAnAccount')}`), + + h('h3.hw-connect__title', {}, `${device.toUpperCase()} - ${this.context.t('selectAnAccount')}`), + + device.toLowerCase() === 'ledger' ? this.renderHdPathSelector() : null, + h('p.hw-connect__msg', {}, this.context.t('selectAnAccountHelp')), ]) ) @@ -125,6 +162,8 @@ class AccountList extends Component { AccountList.propTypes = { + onPathChange: PropTypes.func.isRequired, + selectedPath: PropTypes.string.isRequired, device: PropTypes.string.isRequired, accounts: PropTypes.array.isRequired, onAccountChange: PropTypes.func.isRequired, diff --git a/ui/app/components/pages/create-account/connect-hardware/index.js b/ui/app/components/pages/create-account/connect-hardware/index.js index 644742172..0eb2aa16f 100644 --- a/ui/app/components/pages/create-account/connect-hardware/index.js +++ b/ui/app/components/pages/create-account/connect-hardware/index.js @@ -18,7 +18,7 @@ class ConnectHardwareForm extends Component { accounts: [], browserSupported: true, unlocked: false, - device: null + device: null, } } @@ -40,10 +40,10 @@ class ConnectHardwareForm extends Component { async checkIfUnlocked () { ['trezor', 'ledger'].forEach(async device => { - const unlocked = await this.props.checkHardwareStatus(device) + const unlocked = await this.props.checkHardwareStatus(device, this.props.defaultHdPaths[device]) if (unlocked) { this.setState({unlocked: true}) - this.getPage(0, device) + this.getPage(0, device, this.props.defaultHdPaths[device]) } }) } @@ -52,8 +52,16 @@ class ConnectHardwareForm extends Component { if (this.state.accounts.length) { return null } + + // Default values this.setState({ btnText: this.context.t('connecting')}) - this.getPage(0, device) + this.getPage(0, device, this.props.defaultHdPaths[device]) + } + + onPathChange = (path) => { + console.log('BRUNO: path changed', path) + this.props.setHardwareWalletDefaultHdPath({device: this.state.device, path}) + this.getPage(0, this.state.device, path) } onAccountChange = (account) => { @@ -68,9 +76,9 @@ class ConnectHardwareForm extends Component { }, 5000) } - getPage = (page, device) => { + getPage = (page, device, hdPath) => { this.props - .connectHardware(device, page) + .connectHardware(device, page, hdPath) .then(accounts => { if (accounts.length) { @@ -162,6 +170,8 @@ class ConnectHardwareForm extends Component { } return h(AccountList, { + onPathChange: this.onPathChange, + selectedPath: this.props.defaultHdPaths[this.state.device], device: this.state.device, accounts: this.state.accounts, selectedAccount: this.state.selectedAccount, @@ -193,12 +203,14 @@ ConnectHardwareForm.propTypes = { showAlert: PropTypes.func, hideAlert: PropTypes.func, unlockHardwareWalletAccount: PropTypes.func, + setHardwareWalletDefaultHdPath: PropTypes.func, numberOfExistingAccounts: PropTypes.number, history: PropTypes.object, t: PropTypes.func, network: PropTypes.string, accounts: PropTypes.object, address: PropTypes.string, + defaultHdPaths: PropTypes.object, } const mapStateToProps = state => { @@ -206,28 +218,35 @@ const mapStateToProps = state => { metamask: { network, selectedAddress, identities = {}, accounts = [] }, } = state const numberOfExistingAccounts = Object.keys(identities).length + const { + appState: { defaultHdPaths }, + } = state return { network, accounts, address: selectedAddress, numberOfExistingAccounts, + defaultHdPaths, } } const mapDispatchToProps = dispatch => { return { - connectHardware: (deviceName, page) => { - return dispatch(actions.connectHardware(deviceName, page)) + setHardwareWalletDefaultHdPath: ({device, path}) => { + return dispatch(actions.setHardwareWalletDefaultHdPath({device, path})) + }, + connectHardware: (deviceName, page, hdPath) => { + return dispatch(actions.connectHardware(deviceName, hdPath, page)) }, - checkHardwareStatus: (deviceName) => { - return dispatch(actions.checkHardwareStatus(deviceName)) + checkHardwareStatus: (deviceName, hdPath) => { + return dispatch(actions.checkHardwareStatus(deviceName, hdPath)) }, forgetDevice: (deviceName) => { return dispatch(actions.forgetDevice(deviceName)) }, - unlockHardwareWalletAccount: (index, deviceName) => { - return dispatch(actions.unlockHardwareWalletAccount(index, deviceName)) + unlockHardwareWalletAccount: (index, deviceName, hdPath) => { + return dispatch(actions.unlockHardwareWalletAccount(index, deviceName, hdPath)) }, showImportPage: () => dispatch(actions.showImportPage()), showConnectPage: () => dispatch(actions.showConnectPage()), -- cgit v1.2.3