on c2a7ff5 help sign in
bridge/src/views/SetKeys.js
379 lines 9.1 kB history raw
1import React from 'react'
2import Maybe from 'folktale/maybe'
3import * as azimuth from 'azimuth-js'
4import * as ob from 'urbit-ob'
5import { Row, Col, H1, P, Warning, H3 } from '../components/Base'
6import { RequiredInput, InnerLabel } from '../components/Base'
8import StatelessTransaction from '../components/StatelessTransaction'
9import { BRIDGE_ERROR } from '../lib/error'
10import { ROUTE_NAMES } from '../lib/router'
11import { attemptSeedDerivation } from '../lib/keys'
13import { WALLET_NAMES } from '../lib/wallet'
15import * as kg from '../../node_modules/urbit-key-generation/dist/index'
17import {
18 sendSignedTransaction,
19 fromWei,
20 } from '../lib/txn'
22import {
23 addressFromSecp256k1Public,
24 addHexPrefix
25} from '../lib/wallet'
27class SetKeys extends React.Component {
28 constructor(props) {
29 super(props)
31 const point = props.pointCursor.matchWith({
32 Just: (shp) => shp.value,
33 Nothing: () => {
34 throw BRIDGE_ERROR.MISSING_POINT
35 }
36 })
38 this.state = {
39 auth: '',
40 encr: '',
41 networkSeed: '',
42 point: point,
43 cryptoSuiteVersion: 1,
44 continuity: false,
45 txn: Maybe.Nothing(),
46 txError: Maybe.Nothing(),
47 userApproval: false,
48 nonce: '',
49 gasPrice: '5',
50 chainId: '',
51 gasLimit: '600000',
52 stx: Maybe.Nothing(),
53 }
55 this.handleNetworkSeedInput = this.handleNetworkSeedInput.bind(this)
56 // Transaction
57 this.handleCreateUnsignedTxn = this.handleCreateUnsignedTxn.bind(this)
58 this.handleSubmit = this.handleSubmit.bind(this)
59 this.handleSetUserApproval = this.handleSetUserApproval.bind(this)
60 this.handleSetTxn = this.handleSetTxn.bind(this)
61 this.handleSetStx = this.handleSetStx.bind(this)
62 this.handleSetNonce = this.handleSetNonce.bind(this)
63 this.handleSetChainId = this.handleSetChainId.bind(this)
64 this.handleSetGasPrice = this.handleSetGasPrice.bind(this)
65 this.handleSetGasLimit = this.handleSetGasLimit.bind(this)
66 }
69 componentDidMount() {
70 const { props } = this
72 this.deriveSeed()
74 const addr = props.wallet.matchWith({
75 Just: wal => addressFromSecp256k1Public(wal.value.publicKey),
76 Nothing: () => {
77 throw BRIDGE_ERROR.MISSING_WALLET
78 }
79 })
81 props.web3.matchWith({
82 Nothing: () => {},
83 Just: (w3) => {
84 const validWeb3 = w3.value
86 const getTxMetadata = [
87 validWeb3.eth.getTransactionCount(addr),
88 validWeb3.eth.net.getId(),
89 validWeb3.eth.getGasPrice()
90 ];
92 Promise.all(getTxMetadata).then(r => {
93 const txMetadata = {
94 nonce: r[0],
95 chainId: r[1],
96 gasPrice: fromWei(r[2], 'gwei'),
97 };
99 this.setState({...txMetadata})
101 })
102 }
103 });
105 }
108 async deriveSeed() {
109 const next = true
110 const seed = await attemptSeedDerivation(next, this.props)
111 this.setState({
112 networkSeed: seed.getOrElse('')
113 })
114 }
118 handleNetworkSeedInput(networkSeed) {
119 this.setState({ networkSeed })
120 }
124 handleCreateUnsignedTxn() {
125 const txn = this.createUnsignedTxn()
126 this.setState({ txn })
127 }
130 handleSetUserApproval(){
131 const {state} = this
132 this.setState({ userApproval: !state.userApproval })
133 }
137 handleSetTxn(txn){
138 this.setState({ txn })
139 }
143 handleSetStx(stx){
144 this.setState({
145 stx,
146 userApproval: false,
147 })
148 }
152 handleSetNonce(nonce){
153 this.setState({ nonce })
154 this.handleClearStx()
155 }
159 handleSetChainId(chainId){
160 this.setState({ chainId })
161 this.handleClearStx()
162 }
166 handleSetGasPrice(gasPrice){
167 this.setState({ gasPrice })
168 this.handleClearStx()
169 }
173 handleSetGasLimit(gasLimit){
174 this.setState({ gasLimit })
175 this.handleClearStx()
176 }
180 handleClearStx() {
181 this.setState({
182 userApproval: false,
183 stx: Maybe.Nothing(),
184 })
185 }
190 handleClearTxn() {
191 this.setState({
192 userApproval: false,
193 txn: Maybe.Nothing(),
194 stx: Maybe.Nothing(),
195 })
196 }
200 handleClearTransaction() {
201 this.setState({
202 userApproval: false,
203 txn: Maybe.Nothing(),
204 stx: Maybe.Nothing(),
205 })
206 }
210 handleSubmit(){
211 const { props, state } = this
212 sendSignedTransaction(props.web3.value, state.stx)
213 .then(sent => {
214 props.setTxnHashCursor(sent)
215 props.popRoute()
216 props.pushRoute(ROUTE_NAMES.SENT_TRANSACTION)
217 })
218 .catch(err => {
219 this.setState({ txError: err.map(val => val.merge()) })
220 })
221 }
225 createUnsignedTxn() {
226 const { state, props } = this
228 const validContracts = props.contracts.matchWith({
229 Just: (cs) => cs.value,
230 Nothing: () => {
231 throw BRIDGE_ERROR.MISSING_CONTRACTS
232 }
233 })
235 const validPoint = props.pointCursor.matchWith({
236 Just: (shp) => shp.value,
237 Nothing: () => {
238 throw BRIDGE_ERROR.MISSING_POINT
239 }
240 })
242 const hexRegExp = /[0-9A-Fa-f]{64}/g
244 if (hexRegExp.test(state.networkSeed)) {
245 // derive network keys
246 const pair = kg.deriveNetworkKeys(state.networkSeed)
248 const pencr = addHexPrefix(pair.crypt.public)
249 const pauth = addHexPrefix(pair.auth.public)
251 const txn = azimuth.ecliptic.configureKeys(
252 validContracts,
253 validPoint,
254 pencr,
255 pauth,
256 1,
257 false
258 )
260 return Maybe.Just(txn)
261 }
263 return Maybe.Nothing()
264 }
266 render() {
267 const { props, state } = this
269 const canGenerate =
270 state.networkSeed.length === 64
271 && state.networkSeed.length === 64
273 const canSign = Maybe.Just.hasInstance(state.txn)
274 const canApprove = Maybe.Just.hasInstance(state.stx)
276 const canSend =
277 Maybe.Just.hasInstance(state.stx)
278 && state.userApproval === true
280 const pointDetails =
281 state.point in props.pointCache
282 ? props.pointCache[state.point]
283 : (() => { throw BRIDGE_ERROR.MISSING_POINT })()
285 return (
286 <Row>
287 <Col>
288 <H1>
289 { 'Set Network Keys For ' } <code>{ `${ob.patp(state.point)}` }</code>
290 </H1>
292 <P>
293 {
294 `Please enter a network seed for generating and setting your public
295 network authentication and encryption keys. Your network seed
296 must be a 32-byte-long hexadecimal string.`
297 }
298 </P>
299 <P>
300 {
301 `If you've authenticated with a master ticket or management proxy
302 mnemonic, a seed will be generated for you automatically.`
303 }
304 </P>
306 { pointDetails.keyRevisionNumber === '0'
307 ? <Warning>
308 <h3 className={'mb-2'}>{'Warning'}</h3>
309 {
310 'Once these keys have been set, your point is considered ' +
311 "'linked'. This operation cannot be undone."
312 }
313 </Warning>
314 : <div /> }
316 <RequiredInput
317 className='mono'
318 prop-size='lg'
319 prop-format='innerLabel'
320 autoFocus
321 disabled= { props.walletType === WALLET_NAMES.TICKET || props.walletType === WALLET_NAMES.SHARD}
322 value={ state.networkSeed }
323 onChange={ this.handleNetworkSeedInput }>
324 <InnerLabel>{ 'Network seed' }</InnerLabel>
325 </RequiredInput>
327 <StatelessTransaction
328 // Upper scope
329 web3={props.web3}
330 contracts={props.contracts}
331 wallet={props.wallet}
332 walletType={props.walletType}
333 walletHdPath={props.walletHdPath}
334 networkType={props.networkType}
335 // Tx
336 txn={state.txn}
337 stx={state.stx}
338 // Tx details
339 nonce={state.nonce}
340 gasPrice={state.gasPrice}
341 chainId={state.chainId}
342 gasLimit={state.gasLimit}
343 // Checks
344 userApproval={state.userApproval}
345 canGenerate={ canGenerate }
346 canSign={ canSign }
347 canApprove={ canApprove }
348 canSend={ canSend }
349 // Methods
350 createUnsignedTxn={this.handleCreateUnsignedTxn}
351 setUserApproval={this.handleSetUserApproval}
352 setTxn={this.handleSetTxn}
353 setStx={this.handleSetStx}
354 setNonce={this.handleSetNonce}
355 setChainId={this.handleSetChainId}
356 setGasPrice={this.handleSetGasPrice}
357 setGasLimit={this.handleSetGasLimit}
358 handleSubmit={this.handleSubmit} />
360 {
361 Maybe.Nothing.hasInstance(state.txError)
362 ? ''
363 : <Warning className={'mt-8'}>
364 <H3 style={{marginTop: 0, paddingTop: 0}}>
365 {
366 'There was an error sending your transaction.'
367 }
368 </H3>
369 { state.txError.value }
370 </Warning>
371 }
373 </Col>
374 </Row>
375 )
376 }
379export default SetKeys