git.iko.soy/bridge
on 2fc74c8 help sign in
bridge/src/views/CancelTransfer.js
281 lines 6.8 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.setTxnHashCursor(sent)
165 props.popRoute()
166 props.pushRoute(ROUTE_NAMES.SENT_TRANSACTION)
167 })
168 .catch(err => {
169 this.setState({ txError: err.map(val => val.merge()) })
170 })
171 }
173 createUnsignedTxn() {
174 const { props } = this
176 const validContracts = props.contracts.matchWith({
177 Just: (cs) => cs.value,
178 Nothing: () => {
179 throw BRIDGE_ERROR.MISSING_CONTRACTS
180 }
181 })
183 const validPoint = props.pointCursor.matchWith({
184 Just: (pt) => pt.value,
185 Nothing: () => {
186 throw BRIDGE_ERROR.MISSING_POINT
187 }
188 })
190 const txn = azimuth.ecliptic.setTransferProxy(
191 validContracts,
192 validPoint,
193 ETH_ZERO_ADDR
194 )
196 return Maybe.Just(txn)
197 }
200 render() {
201 const { props, state } = this
203 const online = Maybe.Just.hasInstance(props.web3)
205 const proxy = online
206 ? props.pointCache[state.pointInTransfer].transferProxy
207 : 'any outgoing addresses'
209 // const canGenerate = validAddress === true
211 const canGenerate = true
212 const canSign = !Maybe.Nothing.hasInstance(state.txn)
213 const canApprove = !Maybe.Nothing.hasInstance(state.stx)
214 const canSend = !Maybe.Nothing.hasInstance(state.stx) && state.userApproval === true
217 return (
218 <Row>
219 <Col>
220 <H1>
221 { 'Cancel Transfer of '} <code>{ ` ${ob.patp(state.pointInTransfer)} ` }</code>
222 </H1>
224 <P>
225 {
226 `This action will cancel the transfer to ${proxy}.`
227 }
228 </P>
229 <StatelessTransaction
230 // Upper scope
231 web3={props.web3}
232 contracts={props.contracts}
233 wallet={props.wallet}
234 walletType={props.walletType}
235 walletHdPath={props.walletHdPath}
236 networkType={props.networkType}
237 // Tx
238 txn={state.txn}
239 stx={state.stx}
240 // Tx details
241 nonce={state.nonce}
242 gasPrice={state.gasPrice}
243 chainId={state.chainId}
244 gasLimit={state.gasLimit}
245 // Checks
246 userApproval={state.userApproval}
247 canGenerate={ canGenerate }
248 canSign={ canSign }
249 canApprove={ canApprove }
250 canSend={ canSend }
251 // Methods
252 createUnsignedTxn={this.handleCreateUnsignedTxn}
253 setUserApproval={this.handleSetUserApproval}
254 setTxn={this.handleSetTxn}
255 setStx={this.handleSetStx}
256 setNonce={this.handleSetNonce}
257 setChainId={this.handleSetChainId}
258 setGasPrice={this.handleSetGasPrice}
259 setGasLimit={this.handleSetGasLimit}
260 handleSubmit={this.handleSubmit} />
262 {
263 Maybe.Nothing.hasInstance(state.txError)
264 ? ''
265 : <Warning className={'mt-8'}>
266 <H3 style={{marginTop: 0, paddingTop: 0}}>
267 {
268 'There was an error sending your transaction.'
269 }
270 </H3>
271 { state.txError.value }
272 </Warning>
273 }
275 </Col>
276 </Row>
277 )
278 }
281export default CancelTransfer