on a54b5ac help sign in
bridge/src/views/SentTransaction.js
95 lines 2.2 kB history raw
1import React from 'react'
2import { Row, Col, H1, H3, P, Warning, Anchor } from '../components/Base'
3import { Button } from '../components/Base'
5import { BRIDGE_ERROR, renderTxnError } from '../lib/error'
7const Success = (props) =>
8 <Row>
9 <Col>
10 <H1>{ 'Your Transaction was Sent' }</H1>
12 <P>
13 {
14 `We sent your transaction to the chain. It can take some time to
15 execute, especially if the network is busy. If you’d like to keep
16 track of it, click the Etherscan link below.`
17 }
18 </P>
20 <H3>{ 'Transaction Hash' }</H3>
21 <P>
22 { props.hash }
23 </P>
24 <Anchor
25 className={'mb-4 mt-1'}
26 prop-size={'sm'}
27 target={'_blank'}
28 href={`https://etherscan.io/tx/${props.hash}`}>
29 {'View on Etherscan ↗'}
30 </Anchor>
31 </Col>
32 </Row>
34const Failure = (props) =>
36 <Row>
37 <Col>
38 <H1>{ 'Error!' }</H1>
41 <Warning>
42 <H3>
43 {
44 'There was an error sending your transaction.'
45 }
46 </H3>
47 { renderTxnError(props.web3, props.message) }
48 </Warning>
49 </Col>
50 </Row>
52const SentTransaction = (props) => {
53 const { web3, txnCursor, popRoute } = props
54 const { setPointCursor, pointCursor } = props
56 const w3 = web3.matchWith({
57 Nothing: _ => { throw BRIDGE_ERROR.MISSING_WEB3 },
58 Just: res => res.value
59 })
61 const result = txnCursor.matchWith({
62 Nothing: _ => { throw BRIDGE_ERROR.MISSING_TXN },
63 Just: res => res.value
64 })
66 const body = result.matchWith({
67 Error: message => <Failure web3={ w3 } message={ message.value } />,
68 Ok: txn => <Success hash={ txn.value.transactionHash } />
69 })
71 const ok =
72 <Row>
73 <Col>
74 <Button
75 prop-type={'link'}
76 onClick={
77 () => {
78 setPointCursor(pointCursor)
79 popRoute()
80 }
81 }>
82 { 'Ok →' }
83 </Button>
84 </Col>
85 </Row>
87 return (
88 <div>
89 { body }
90 { ok }
91 </div>
92 )
95export default SentTransaction