on master help sign in
Help with derivation path selection for Trezor
65a1ac4Fang
src/bridge/lib/trezor.js+2−2
@@ -1,6 +1,6 @@
1import TrezorConnect from 'trezor-connect'
1import TrezorConnect from 'trezor-connect'
2
2
3−const TREZOR_BASE_PATH = "m/44'/60'/0'/0/0"
3+const TREZOR_PATH = "m/44'/60'/0'/0/x"
4
4
5const formatChainId = val =>
5const formatChainId = val =>
6 typeof val === 'number'
6 typeof val === 'number'
@@ -33,7 +33,7 @@ const trezorSignTransaction = async (txn, hdpath) => {
33}
33}
34
34
35export {
35export {
36− TREZOR_BASE_PATH,
36+ TREZOR_PATH,
37 trezorSignTransaction
37 trezorSignTransaction
38}
38}
39
39
src/bridge/views/Trezor.js+66−14
@@ -3,11 +3,11 @@ import React from 'react'
3import Maybe from 'folktale/maybe'
3import Maybe from 'folktale/maybe'
4import { Button } from '../components/Base'
4import { Button } from '../components/Base'
5import { Row, Col, H1, P } from '../components/Base'
5import { Row, Col, H1, P } from '../components/Base'
6−import { InnerLabel, Input } from '../components/Base'
6+import { InnerLabel, Input, InnerLabelDropdown } from '../components/Base'
7import TrezorConnect from 'trezor-connect'
7import TrezorConnect from 'trezor-connect'
8import * as secp256k1 from 'secp256k1'
8import * as secp256k1 from 'secp256k1'
9
9
10−import { TREZOR_BASE_PATH } from '../lib/trezor'
10+import { TREZOR_PATH } from '../lib/trezor'
11import { ROUTE_NAMES } from '../lib/router'
11import { ROUTE_NAMES } from '../lib/router'
12
12
13class Trezor extends React.Component {
13class Trezor extends React.Component {
@@ -16,13 +16,23 @@ class Trezor extends React.Component {
16 super(props)
16 super(props)
17
17
18 this.state = {
18 this.state = {
19− hdpath: TREZOR_BASE_PATH
19+ hdpath: TREZOR_PATH.replace(/x/g, 0),
20+ account: 0
20 }
21 }
21
22
23+ this.handleAccountSelection = this.handleAccountSelection.bind(this)
22 this.handleHdPathInput = this.handleHdPathInput.bind(this)
24 this.handleHdPathInput = this.handleHdPathInput.bind(this)
23 this.pollDevice = this.pollDevice.bind(this)
25 this.pollDevice = this.pollDevice.bind(this)
24 }
26 }
25
27
28+ handleAccountSelection(account) {
29+ let hdpath = this.state.hdpath;
30+ if (account !== 'custom') {
31+ hdpath = TREZOR_PATH.replace(/x/g, account);
32+ }
33+ this.setState({ account, hdpath });
34+ }
35+
26 handleHdPathInput(hdpath) {
36 handleHdPathInput(hdpath) {
27 this.setState({ hdpath })
37 this.setState({ hdpath })
28 }
38 }
@@ -53,7 +63,57 @@ class Trezor extends React.Component {
53
63
54 render() {
64 render() {
55 const { pushRoute, popRoute, wallet } = this.props
65 const { pushRoute, popRoute, wallet } = this.props
56− const { hdpath } = this.state
66+ const { hdpath, account } = this.state
67+ const { handleAccountSelection } = this;
68+ console.log('hdpath', hdpath)
69+
70+ let accountOptions = [{
71+ title: 'Custom path',
72+ value: 'custom'
73+ }];
74+ for (let i = 0; i < 20; i++) {
75+ accountOptions.push({
76+ title: 'Account #' + (i+1),
77+ value: i
78+ });
79+ }
80+ //NOTE this is dumb
81+ let accountTitle = '';
82+ for (let i in accountOptions) {
83+ let option = accountOptions[i];
84+ if (option.value === account) {
85+ accountTitle = option.title;
86+ break;
87+ }
88+ }
89+
90+ const accountSelection = (
91+ <InnerLabelDropdown
92+ className='mt-8'
93+ prop-size='md'
94+ prop-format='innerLabel'
95+ options={accountOptions}
96+ handleUpdate={handleAccountSelection}
97+ title={'Account'}
98+ currentSelectionTitle={accountTitle}
99+ fullWidth={true}
100+ >
101+ </InnerLabelDropdown>
102+ );
103+
104+ const pathSelection = (account !== 'custom') ? null :
105+ (
106+ <Input
107+ className='mt-8 pt-8 text-mono'
108+ prop-size='md'
109+ prop-format='innerLabel'
110+ name='hdpath'
111+ value={ hdpath }
112+ autocomplete='off'
113+ onChange={ this.handleHdPathInput }>
114+ <InnerLabel>{'HD Path'}</InnerLabel>
115+ </Input>
116+ );
57
117
58 return (
118 return (
59 <Row>
119 <Row>
@@ -66,16 +126,8 @@ class Trezor extends React.Component {
66 }
126 }
67 </P>
127 </P>
68
128
69− <Input
129+ { accountSelection }
70− className='pt-8 text-mono'
130+ { pathSelection }
71− prop-size='md'
72− prop-format='innerLabel'
73− name='hdpath'
74− value={ hdpath }
75− autocomplete='off'
76− onChange={ this.handleHdPathInput }>
77− <InnerLabel>{'HD Path'}</InnerLabel>
78− </Input>
79
131
80 <Button
132 <Button
81 className={'mt-8'}
133 className={'mt-8'}