git.iko.soy/bridge
on a8a4e1e help sign in
bridge/src/views/CancelTransfer.js
282 lines 6.9 kB history raw
1import Maybe from 'folktale/maybe'
2import React from 'react'
3import { Row, Col, H1, P, Warning, H3 } from '../components/Base'
4import * as azimuth from 'azimuth-js'
5import * as ob from 'urbit-ob'
7import StatelessTransaction from '../components/StatelessTransaction'
8import { BRIDGE_ERROR } from '../lib/error'
9import { ETH_ZERO_ADDR } from '../lib/wallet'
10import { ROUTE_NAMES } from '../lib/router'
12import {
13 sendSignedTransaction,
14 fromWei,
15 } from '../lib/txn'
17import {
18 addressFromSecp256k1Public,
19} from '../lib/wallet'
22class CancelTransfer extends React.Component {
23 constructor(props) {
24 super(props)
26 const pointInTransfer = props.pointCursor.matchWith({
27 Just: (pt) => pt.value,
28 Nothing: () => {
29 throw BRIDGE_ERROR.MISSING_POINT
30 }
31 })
33 this.state = {
34 proxyAddress: '',
35 txn: Maybe.Nothing(),
36 txError: Maybe.Nothing(),
37 pointInTransfer: pointInTransfer,
38 userApproval: false,
39 nonce: '',
40 gasPrice: '5',
41 chainId: '',
42 gasLimit: '600000',
43 stx: Maybe.Nothing(),
44 }
45 // Transaction
46 this.handleCreateUnsignedTxn = this.handleCreateUnsignedTxn.bind(this)
47 this.handleSubmit = this.handleSubmit.bind(this)
48 this.handleSetUserApproval = this.handleSetUserApproval.bind(this)
49 this.handleSetTxn = this.handleSetTxn.bind(this)
50 this.handleSetStx = this.handleSetStx.bind(this)
51 this.handleSetNonce = this.handleSetNonce.bind(this)
52 this.handleSetChainId = this.handleSetChainId.bind(this)
53 this.handleSetGasPrice = this.handleSetGasPrice.bind(this)
54 this.handleSetGasLimit = this.handleSetGasLimit.bind(this)
55 }
57 componentDidMount() {
58 const { props } = this
60 const addr = props.wallet.matchWith({
61 Just: wal => addressFromSecp256k1Public(wal.value.publicKey),
62 Nothing: () => {
63 throw BRIDGE_ERROR.MISSING_WALLET
64 }
65 })
67 props.web3.matchWith({
68 Nothing: () => {},
69 Just: (w3) => {
70 const validWeb3 = w3.value
72 const getTxMetadata = [
73 validWeb3.eth.getTransactionCount(addr),
74 validWeb3.eth.net.getId(),
75 validWeb3.eth.getGasPrice()
76 ];
78 Promise.all(getTxMetadata).then(r => {
79 const txMetadata = {
80 nonce: r[0],
81 chainId: r[1],
82 gasPrice: fromWei(r[2], 'gwei'),
83 };
85 this.setState({...txMetadata})
87 })
88 }
89 });
91 }
95 handleCreateUnsignedTxn() {
96 const txn = this.createUnsignedTxn()
97 this.setState({ txn })
98 }
102 handleSetUserApproval(){
103 const {state} = this
104 this.setState({ userApproval: !state.userApproval })
105 }
109 handleSetTxn(txn){
110 this.setState({ txn })
111 }
115 handleSetStx(stx){
116 this.setState({
117 stx,
118 userApproval: false,
119 })
120 }
124 handleSetNonce(nonce){
125 this.setState({ nonce })
126 this.handleClearStx()
127 }
131 handleSetChainId(chainId){
132 this.setState({ chainId })
133 this.handleClearStx()
134 }
138 handleSetGasPrice(gasPrice){
139 this.setState({ gasPrice })
140 this.handleClearStx()
141 }
145 handleSetGasLimit(gasLimit){
146 this.setState({ gasLimit })
147 this.handleClearStx()
148 }
152 handleClearStx() {
153 this.setState({
154 userApproval: false,
155 stx: Maybe.Nothing(),
156 })
157 }
160 handleSubmit(){
161 const { props, state } = this
162 sendSignedTransaction(props.web3.value, state.stx)
163 .then(sent => {
164 props.setTxnCursor(sent)
165 props.popRoute()
166 props.pushRoute(ROUTE_NAMES.SENT_TRANSACTION)
167 })
168 .catch(err => {
169 // Note that value.value is due to wrapped Maybe.Just + Result.Error
170 this.setState({ txError: Maybe.Just(err.value.value) })
171 })
172 }
174 createUnsignedTxn() {
175 const { props } = this
177 const validContracts = props.contracts.matchWith({
178 Just: (cs) => cs.value,
179 Nothing: () => {
180 throw BRIDGE_ERROR.MISSING_CONTRACTS
181 }
182 })
184 const validPoint = props.pointCursor.matchWith({
185 Just: (pt) => pt.value,
186 Nothing: () => {
187 throw BRIDGE_ERROR.MISSING_POINT
188 }
189 })
191 const txn = azimuth.ecliptic.setTransferProxy(
192 validContracts,
193 validPoint,
194 ETH_ZERO_ADDR
195 )
197 return Maybe.Just(txn)
198 }
201 render() {
202 const { props, state } = this
204 const online = Maybe.Just.hasInstance(props.web3)
206 const proxy = online
207 ? props.pointCache[state.pointInTransfer].transferProxy
208 : 'any outgoing addresses'
210 // const canGenerate = validAddress === true
212 const canGenerate = true
213 const canSign = !Maybe.Nothing.hasInstance(state.txn)
214 const canApprove = !Maybe.Nothing.hasInstance(state.stx)
215 const canSend = !Maybe.Nothing.hasInstance(state.stx) && state.userApproval === true
218 return (
219 <Row>
220 <Col>
221 <H1>
222 { 'Cancel Transfer of '} <code>{ ` ${ob.patp(state.pointInTransfer)} ` }</code>
223 </H1>
225 <P>
226 {
227 `This action will cancel the transfer to ${proxy}.`
228 }
229 </P>
230 <StatelessTransaction
231 // Upper scope
232 web3={props.web3}
233 contracts={props.contracts}
234 wallet={props.wallet}
235 walletType={props.walletType}
236 walletHdPath={props.walletHdPath}
237 networkType={props.networkType}
238 // Tx
239 txn={state.txn}
240 stx={state.stx}
241 // Tx details
242 nonce={state.nonce}
243 gasPrice={state.gasPrice}
244 chainId={state.chainId}
245 gasLimit={state.gasLimit}
246 // Checks
247 userApproval={state.userApproval}
248 canGenerate={ canGenerate }
249 canSign={ canSign }
250 canApprove={ canApprove }
251 canSend={ canSend }
252 // Methods
253 createUnsignedTxn={this.handleCreateUnsignedTxn}
254 setUserApproval={this.handleSetUserApproval}
255 setTxn={this.handleSetTxn}
256 setStx={this.handleSetStx}
257 setNonce={this.handleSetNonce}
258 setChainId={this.handleSetChainId}
259 setGasPrice={this.handleSetGasPrice}
260 setGasLimit={this.handleSetGasLimit}
261 handleSubmit={this.handleSubmit} />
263 {
264 Maybe.Nothing.hasInstance(state.txError)
265 ? ''
266 : <Warning className={'mt-8'}>
267 <H3 style={{marginTop: 0, paddingTop: 0}}>
268 {
269 'There was an error sending your transaction.'
270 }
271 </H3>
272 { state.txError.value }
273 </Warning>
274 }
276 </Col>
277 </Row>
278 )
279 }
282export default CancelTransfer