on bf5080e help sign in
bridge/src/views/SetKeys.js
377 lines 8.9 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 * as kg from '../../node_modules/urbit-key-generation/dist/index'
15import {
16 sendSignedTransaction,
17 fromWei,
18 } from '../lib/txn'
20import {
21 addressFromSecp256k1Public,
22 addHexPrefix
23} from '../lib/wallet'
25class SetKeys extends React.Component {
26 constructor(props) {
27 super(props)
29 const point = props.pointCursor.matchWith({
30 Just: (shp) => shp.value,
31 Nothing: () => {
32 throw BRIDGE_ERROR.MISSING_POINT
33 }
34 })
36 this.state = {
37 auth: '',
38 encr: '',
39 networkSeed: '',
40 point: point,
41 cryptoSuiteVersion: 1,
42 continuity: false,
43 txn: Maybe.Nothing(),
44 txError: Maybe.Nothing(),
45 userApproval: false,
46 nonce: '',
47 gasPrice: '5',
48 chainId: '',
49 gasLimit: '600000',
50 stx: Maybe.Nothing(),
51 }
53 this.handleNetworkSeedInput = this.handleNetworkSeedInput.bind(this)
54 // Transaction
55 this.handleCreateUnsignedTxn = this.handleCreateUnsignedTxn.bind(this)
56 this.handleSubmit = this.handleSubmit.bind(this)
57 this.handleSetUserApproval = this.handleSetUserApproval.bind(this)
58 this.handleSetTxn = this.handleSetTxn.bind(this)
59 this.handleSetStx = this.handleSetStx.bind(this)
60 this.handleSetNonce = this.handleSetNonce.bind(this)
61 this.handleSetChainId = this.handleSetChainId.bind(this)
62 this.handleSetGasPrice = this.handleSetGasPrice.bind(this)
63 this.handleSetGasLimit = this.handleSetGasLimit.bind(this)
64 }
67 componentDidMount() {
68 const { props } = this
70 this.deriveSeed()
72 const addr = props.wallet.matchWith({
73 Just: wal => addressFromSecp256k1Public(wal.value.publicKey),
74 Nothing: () => {
75 throw BRIDGE_ERROR.MISSING_WALLET
76 }
77 })
79 props.web3.matchWith({
80 Nothing: () => {},
81 Just: (w3) => {
82 const validWeb3 = w3.value
84 const getTxMetadata = [
85 validWeb3.eth.getTransactionCount(addr),
86 validWeb3.eth.net.getId(),
87 validWeb3.eth.getGasPrice()
88 ];
90 Promise.all(getTxMetadata).then(r => {
91 const txMetadata = {
92 nonce: r[0],
93 chainId: r[1],
94 gasPrice: fromWei(r[2], 'gwei'),
95 };
97 this.setState({...txMetadata})
99 })
100 }
101 });
103 }
106 async deriveSeed() {
107 const next = true
108 const seed = await attemptSeedDerivation(next, this.props)
109 this.setState({
110 networkSeed: seed.getOrElse('')
111 })
112 }
116 handleNetworkSeedInput(networkSeed) {
117 this.setState({ networkSeed })
118 }
122 handleCreateUnsignedTxn() {
123 const txn = this.createUnsignedTxn()
124 this.setState({ txn })
125 }
128 handleSetUserApproval(){
129 const {state} = this
130 this.setState({ userApproval: !state.userApproval })
131 }
135 handleSetTxn(txn){
136 this.setState({ txn })
137 }
141 handleSetStx(stx){
142 this.setState({
143 stx,
144 userApproval: false,
145 })
146 }
150 handleSetNonce(nonce){
151 this.setState({ nonce })
152 this.handleClearStx()
153 }
157 handleSetChainId(chainId){
158 this.setState({ chainId })
159 this.handleClearStx()
160 }
164 handleSetGasPrice(gasPrice){
165 this.setState({ gasPrice })
166 this.handleClearStx()
167 }
171 handleSetGasLimit(gasLimit){
172 this.setState({ gasLimit })
173 this.handleClearStx()
174 }
178 handleClearStx() {
179 this.setState({
180 userApproval: false,
181 stx: Maybe.Nothing(),
182 })
183 }
188 handleClearTxn() {
189 this.setState({
190 userApproval: false,
191 txn: Maybe.Nothing(),
192 stx: Maybe.Nothing(),
193 })
194 }
198 handleClearTransaction() {
199 this.setState({
200 userApproval: false,
201 txn: Maybe.Nothing(),
202 stx: Maybe.Nothing(),
203 })
204 }
208 handleSubmit(){
209 const { props, state } = this
210 sendSignedTransaction(props.web3.value, state.stx)
211 .then(sent => {
212 props.setTxnHashCursor(sent)
213 props.popRoute()
214 props.pushRoute(ROUTE_NAMES.SENT_TRANSACTION)
215 })
216 .catch(err => {
217 this.setState({ txError: err.map(val => val.merge()) })
218 })
219 }
223 createUnsignedTxn() {
224 const { state, props } = this
226 const validContracts = props.contracts.matchWith({
227 Just: (cs) => cs.value,
228 Nothing: () => {
229 throw BRIDGE_ERROR.MISSING_CONTRACTS
230 }
231 })
233 const validPoint = props.pointCursor.matchWith({
234 Just: (shp) => shp.value,
235 Nothing: () => {
236 throw BRIDGE_ERROR.MISSING_POINT
237 }
238 })
240 const hexRegExp = /[0-9A-Fa-f]{64}/g
242 if (hexRegExp.test(state.networkSeed)) {
243 // derive network keys
244 const pair = kg.deriveNetworkKeys(state.networkSeed)
246 const pencr = addHexPrefix(pair.crypt.public)
247 const pauth = addHexPrefix(pair.auth.public)
249 const txn = azimuth.ecliptic.configureKeys(
250 validContracts,
251 validPoint,
252 pencr,
253 pauth,
254 1,
255 false
256 )
258 return Maybe.Just(txn)
259 }
261 return Maybe.Nothing()
262 }
264 render() {
265 const { props, state } = this
267 const canGenerate =
268 state.networkSeed.length === 64
269 && state.networkSeed.length === 64
271 const canSign = Maybe.Just.hasInstance(state.txn)
272 const canApprove = Maybe.Just.hasInstance(state.stx)
274 const canSend =
275 Maybe.Just.hasInstance(state.stx)
276 && state.userApproval === true
278 const pointDetails =
279 state.point in props.pointCache
280 ? props.pointCache[state.point]
281 : (() => { throw BRIDGE_ERROR.MISSING_POINT })()
284 return (
285 <Row>
286 <Col>
287 <H1>
288 { 'Set Network Keys For ' } <code>{ `${ob.patp(state.point)}` }</code>
289 </H1>
291 <P>
292 {
293 `Please enter a network seed for generating and setting your public
294 network authentication and encryption keys. Your network seed
295 must be a 32-byte-long hexadecimal string.`
296 }
297 </P>
298 <P>
299 {
300 `If you've authenticated with a master ticket or management proxy
301 mnemonic, a seed will be generated for you automatically.`
302 }
303 </P>
305 { pointDetails.keyRevisionNumber === '0'
306 ? <Warning>
307 <h3 className={'mb-2'}>{'Warning'}</h3>
308 {
309 'Once these keys have been set, your point is considered ' +
310 "'linked'. This operation cannot be undone."
311 }
312 </Warning>
313 : <div /> }
315 <RequiredInput
316 className='mono'
317 prop-size='lg'
318 prop-format='innerLabel'
319 autoFocus
320 value={ state.networkSeed }
321 onChange={ this.handleNetworkSeedInput }>
322 <InnerLabel>{ 'Network seed' }</InnerLabel>
323 </RequiredInput>
325 <StatelessTransaction
326 // Upper scope
327 web3={props.web3}
328 contracts={props.contracts}
329 wallet={props.wallet}
330 walletType={props.walletType}
331 walletHdPath={props.walletHdPath}
332 networkType={props.networkType}
333 // Tx
334 txn={state.txn}
335 stx={state.stx}
336 // Tx details
337 nonce={state.nonce}
338 gasPrice={state.gasPrice}
339 chainId={state.chainId}
340 gasLimit={state.gasLimit}
341 // Checks
342 userApproval={state.userApproval}
343 canGenerate={ canGenerate }
344 canSign={ canSign }
345 canApprove={ canApprove }
346 canSend={ canSend }
347 // Methods
348 createUnsignedTxn={this.handleCreateUnsignedTxn}
349 setUserApproval={this.handleSetUserApproval}
350 setTxn={this.handleSetTxn}
351 setStx={this.handleSetStx}
352 setNonce={this.handleSetNonce}
353 setChainId={this.handleSetChainId}
354 setGasPrice={this.handleSetGasPrice}
355 setGasLimit={this.handleSetGasLimit}
356 handleSubmit={this.handleSubmit} />
358 {
359 Maybe.Nothing.hasInstance(state.txError)
360 ? ''
361 : <Warning className={'mt-8'}>
362 <H3 style={{marginTop: 0, paddingTop: 0}}>
363 {
364 'There was an error sending your transaction.'
365 }
366 </H3>
367 { state.txError.value }
368 </Warning>
369 }
371 </Col>
372 </Row>
373 )
374 }
377export default SetKeys