git.iko.soy/bridge
on da9327a help sign in
bridge/src/views/SetKeys.js
386 lines 9.2 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 showGasDetails: false,
49 chainId: '',
50 gasLimit: '600000',
51 stx: Maybe.Nothing(),
52 }
54 this.handleNetworkSeedInput = this.handleNetworkSeedInput.bind(this)
55 // Transaction
56 this.handleCreateUnsignedTxn = this.handleCreateUnsignedTxn.bind(this)
57 this.handleSubmit = this.handleSubmit.bind(this)
58 this.handleSetUserApproval = this.handleSetUserApproval.bind(this)
59 this.handleSetTxn = this.handleSetTxn.bind(this)
60 this.handleSetStx = this.handleSetStx.bind(this)
61 this.handleSetNonce = this.handleSetNonce.bind(this)
62 this.handleSetChainId = this.handleSetChainId.bind(this)
63 this.handleSetGasPrice = this.handleSetGasPrice.bind(this)
64 this.handleSetGasLimit = this.handleSetGasLimit.bind(this)
65 this.toggleGasDetails = this.toggleGasDetails.bind(this)
66 }
68 toggleGasDetails() {
69 this.setState({
70 showGasDetails: !this.state.showGasDetails
71 })
72 }
74 componentDidMount() {
75 const { props } = this
77 this.deriveSeed()
79 const addr = props.wallet.matchWith({
80 Just: wal => addressFromSecp256k1Public(wal.value.publicKey),
81 Nothing: () => {
82 throw BRIDGE_ERROR.MISSING_WALLET
83 }
84 })
86 props.web3.matchWith({
87 Nothing: () => {},
88 Just: (w3) => {
89 const validWeb3 = w3.value
91 const getTxMetadata = [
92 validWeb3.eth.getTransactionCount(addr),
93 validWeb3.eth.net.getId(),
94 validWeb3.eth.getGasPrice()
95 ];
97 Promise.all(getTxMetadata).then(r => {
98 const txMetadata = {
99 nonce: r[0],
100 chainId: r[1],
101 gasPrice: fromWei(r[2], 'gwei'),
102 };
104 this.setState({...txMetadata})
106 })
107 }
108 });
110 }
113 async deriveSeed() {
114 const next = true
115 const seed = await attemptSeedDerivation(next, this.props)
116 this.setState({
117 networkSeed: seed.getOrElse('')
118 })
119 }
123 handleNetworkSeedInput(networkSeed) {
124 this.setState({ networkSeed })
125 }
129 handleCreateUnsignedTxn() {
130 const txn = this.createUnsignedTxn()
131 this.setState({ txn })
132 }
135 handleSetUserApproval(){
136 const {state} = this
137 this.setState({ userApproval: !state.userApproval })
138 }
142 handleSetTxn(txn){
143 this.setState({ txn })
144 }
148 handleSetStx(stx){
149 this.setState({
150 stx,
151 userApproval: false,
152 })
153 }
157 handleSetNonce(nonce){
158 this.setState({ nonce })
159 this.handleClearStx()
160 }
164 handleSetChainId(chainId){
165 this.setState({ chainId })
166 this.handleClearStx()
167 }
171 handleSetGasPrice(gasPrice){
172 this.setState({ gasPrice })
173 this.handleClearStx()
174 }
178 handleSetGasLimit(gasLimit){
179 this.setState({ gasLimit })
180 this.handleClearStx()
181 }
185 handleClearStx() {
186 this.setState({
187 userApproval: false,
188 stx: Maybe.Nothing(),
189 })
190 }
195 handleClearTxn() {
196 this.setState({
197 userApproval: false,
198 txn: Maybe.Nothing(),
199 stx: Maybe.Nothing(),
200 })
201 }
205 handleClearTransaction() {
206 this.setState({
207 userApproval: false,
208 txn: Maybe.Nothing(),
209 stx: Maybe.Nothing(),
210 })
211 }
215 handleSubmit(){
216 const { props, state } = this
217 sendSignedTransaction(props.web3.value, state.stx)
218 .then(sent => {
219 props.setTxnHashCursor(sent)
220 props.popRoute()
221 props.pushRoute(ROUTE_NAMES.SENT_TRANSACTION)
222 })
223 .catch(err => {
224 this.setState({ txError: err.map(val => val.merge()) })
225 })
226 }
230 createUnsignedTxn() {
231 const { state, props } = this
233 const validContracts = props.contracts.matchWith({
234 Just: (cs) => cs.value,
235 Nothing: () => {
236 throw BRIDGE_ERROR.MISSING_CONTRACTS
237 }
238 })
240 const validPoint = props.pointCursor.matchWith({
241 Just: (shp) => shp.value,
242 Nothing: () => {
243 throw BRIDGE_ERROR.MISSING_POINT
244 }
245 })
247 const hexRegExp = /[0-9A-Fa-f]{64}/g
249 if (hexRegExp.test(state.networkSeed)) {
250 // derive network keys
251 const pair = kg.deriveNetworkKeys(state.networkSeed)
253 const pencr = addHexPrefix(pair.crypt.public)
254 const pauth = addHexPrefix(pair.auth.public)
256 const txn = azimuth.ecliptic.configureKeys(
257 validContracts,
258 validPoint,
259 pencr,
260 pauth,
261 1,
262 false
263 )
265 return Maybe.Just(txn)
266 }
268 return Maybe.Nothing()
269 }
271 render() {
272 const { props, state } = this
274 const canGenerate =
275 state.networkSeed.length === 64
276 && state.networkSeed.length === 64
278 const canSign = Maybe.Just.hasInstance(state.txn)
279 const canApprove = Maybe.Just.hasInstance(state.stx)
281 const canSend =
282 Maybe.Just.hasInstance(state.stx)
283 && state.userApproval === true
285 const pointDetails =
286 state.point in props.pointCache
287 ? props.pointCache[state.point]
288 : (() => { throw BRIDGE_ERROR.MISSING_POINT })()
291 return (
292 <Row>
293 <Col>
294 <H1>
295 { 'Set Network Keys For ' } <code>{ `${ob.patp(state.point)}` }</code>
296 </H1>
298 <P>
299 {
300 `Please enter a network seed for generating and setting your public
301 network authentication and encryption keys. Your network seed
302 must be a string of 64 characters (containing 0-9, A-Z, a-z).`
303 }
304 </P>
305 <P>
306 {
307 `If you've authenticated with a master ticket or management proxy
308 mnemonic, a seed will be generated for you automatically.`
309 }
310 </P>
312 { pointDetails.keyRevisionNumber === '0'
313 ? <Warning>
314 <h3 className={'mb-2'}>{'Warning'}</h3>
315 {
316 'Once these keys have been set, your point is considered ' +
317 "'linked'. This operation cannot be undone."
318 }
319 </Warning>
320 : <div /> }
322 <RequiredInput
323 className='mono'
324 prop-size='lg'
325 prop-format='innerLabel'
326 autoFocus
327 value={ state.networkSeed }
328 onChange={ this.handleNetworkSeedInput }>
329 <InnerLabel>{ 'Network seed' }</InnerLabel>
330 </RequiredInput>
332 <StatelessTransaction
333 // Upper scope
334 web3={props.web3}
335 contracts={props.contracts}
336 wallet={props.wallet}
337 walletType={props.walletType}
338 walletHdPath={props.walletHdPath}
339 networkType={props.networkType}
340 // Tx
341 txn={state.txn}
342 stx={state.stx}
343 // Tx details
344 nonce={state.nonce}
345 gasPrice={state.gasPrice}
346 chainId={state.chainId}
347 gasLimit={state.gasLimit}
348 showGasDetails={state.showGasDetails}
349 toggleGasDetails={this.toggleGasDetails}
350 // Checks
351 userApproval={state.userApproval}
352 canGenerate={ canGenerate }
353 canSign={ canSign }
354 canApprove={ canApprove }
355 canSend={ canSend }
356 // Methods
357 createUnsignedTxn={this.handleCreateUnsignedTxn}
358 setUserApproval={this.handleSetUserApproval}
359 setTxn={this.handleSetTxn}
360 setStx={this.handleSetStx}
361 setNonce={this.handleSetNonce}
362 setChainId={this.handleSetChainId}
363 setGasPrice={this.handleSetGasPrice}
364 setGasLimit={this.handleSetGasLimit}
365 handleSubmit={this.handleSubmit} />
367 {
368 Maybe.Nothing.hasInstance(state.txError)
369 ? ''
370 : <Warning className={'mt-8'}>
371 <H3 style={{marginTop: 0, paddingTop: 0}}>
372 {
373 'There was an error sending your transaction.'
374 }
375 </H3>
376 { state.txError.value }
377 </Warning>
378 }
380 </Col>
381 </Row>
382 )
383 }
386export default SetKeys