on master help sign in
- Transfer transactions refactored
commitb021adb11d96ef3533edba5681e2c929c8d97d00 authorChris Johnson <chris@cjohnson.io> dateWed 3 Apr 2019, 20:16 (8 years ago) parenta31db0a
3 files changed+22−571
src/bridge/views/AcceptTransfer.js+7−174 src/bridge/views/CancelTransfer.js+6−185 src/bridge/views/Transfer.js+9−212
src/bridge/views/AcceptTransfer.js+7−174
@@ -32,144 +32,17 @@ class AcceptTransfer extends React.Component {
3232
3333 this.state = {
3434 receivingAddress: receivingAddress,
35− txn: Nothing(),
36− txError: Nothing(),
3735 incomingPoint: incomingPoint,
38− userApproval: false,
39− nonce: '',
40− gasPrice: '5',
41− showGasDetails: false,
42− chainId: '',
43− gasLimit: '600000',
44− stx: Nothing(),
4536 }
4637
4738 this.handleAddressInput = this.handleAddressInput.bind(this)
48− this.handleCreateUnsignedTxn = this.handleCreateUnsignedTxn.bind(this)
49− this.handleSubmit = this.handleSubmit.bind(this)
50− this.handleSetUserApproval = this.handleSetUserApproval.bind(this)
51− this.handleSetTxn = this.handleSetTxn.bind(this)
52− this.handleSetStx = this.handleSetStx.bind(this)
53− this.handleSetNonce = this.handleSetNonce.bind(this)
54− this.handleSetChainId = this.handleSetChainId.bind(this)
55− this.handleSetGasPrice = this.handleSetGasPrice.bind(this)
56− this.handleSetGasLimit = this.handleSetGasLimit.bind(this)
57− this.toggleGasDetails = this.toggleGasDetails.bind(this)
58− }
59−
60− toggleGasDetails() {
61− this.setState({
62− showGasDetails: !this.state.showGasDetails
63− })
64− }
65−
66− componentDidMount() {
67− const { props } = this
68−
69− const addr = props.wallet.matchWith({
70− Just: wal => addressFromSecp256k1Public(wal.value.publicKey),
71− Nothing: () => {
72− throw BRIDGE_ERROR.MISSING_WALLET
73− }
74− })
75−
76− props.web3.matchWith({
77− Nothing: () => {},
78− Just: (w3) => {
79− const validWeb3 = w3.value
80−
81− const getTxMetadata = [
82− validWeb3.eth.getTransactionCount(addr),
83− validWeb3.eth.net.getId(),
84− validWeb3.eth.getGasPrice()
85− ];
86−
87− Promise.all(getTxMetadata).then(r => {
88− const txMetadata = {
89− nonce: r[0],
90− chainId: r[1],
91− gasPrice: fromWei(r[2], 'gwei'),
92− };
93−
94− this.setState({...txMetadata})
95−
96− })
97− }
98− });
39+ this.createUnsignedTxn = this.createUnsignedTxn.bind(this)
40+ this.statelessRef = React.createRef();
9941 }
10042
10143 handleAddressInput(proxyAddress) {
10244 this.setState({ proxyAddress })
103− this.handleClearTxn()
104− }
105−
106− handleCreateUnsignedTxn() {
107− const txn = this.createUnsignedTxn()
108− this.setState({ txn })
109− }
110−
111− handleSetUserApproval(){
112− const {state} = this
113− this.setState({ userApproval: !state.userApproval })
114− }
115−
116− handleSetTxn(txn){
117− this.setState({ txn })
118− }
119−
120− handleSetStx(stx){
121− this.setState({
122− stx,
123− userApproval: false,
124− })
125− }
126−
127− handleSetNonce(nonce){
128− this.setState({ nonce })
129− this.handleClearStx()
130− }
131−
132− handleSetChainId(chainId){
133− this.setState({ chainId })
134− this.handleClearStx()
135− }
136−
137− handleSetGasPrice(gasPrice){
138− this.setState({ gasPrice })
139− this.handleClearStx()
140− }
141−
142− handleSetGasLimit(gasLimit){
143− this.setState({ gasLimit })
144− this.handleClearStx()
145− }
146−
147− handleClearStx() {
148− this.setState({
149− userApproval: false,
150− stx: Nothing(),
151− })
152− }
153−
154− handleClearTxn() {
155− this.setState({
156− userApproval: false,
157− txn: Nothing(),
158− stx: Nothing(),
159− })
160− }
161−
162− handleSubmit() {
163− const { props, state } = this
164− sendSignedTransaction(props.web3.value, state.stx)
165− .then(sent => {
166− props.setTxnHashCursor(sent)
167− props.popRoute()
168− props.pushRoute(ROUTE_NAMES.SENT_TRANSACTION)
169− })
170− .catch(err => {
171− this.setState({ txError: err.map(val => val.merge()) })
172− })
45+ this.statelessRef.current.clearTxn()
17346 }
17447
17548 createUnsignedTxn() {
@@ -200,15 +73,9 @@ class AcceptTransfer extends React.Component {
20073 }
20174
20275 render() {
203−
20476 const { state, props } = this
20577 const validAddress = isValidAddress(state.receivingAddress)
20678 const canGenerate = validAddress === true
207− const canSign = Just.hasInstance(state.txn)
208− const canApprove = Just.hasInstance(state.stx)
209− const canSend =
210− Just.hasInstance(state.stx)
211− && state.userApproval === true
21279
21380 const esvisible =
21481 props.networkType === NETWORK_NAMES.ROPSTEN ||
@@ -260,46 +127,12 @@ class AcceptTransfer extends React.Component {
260127 walletType={props.walletType}
261128 walletHdPath={props.walletHdPath}
262129 networkType={props.networkType}
130+ setTxnHashCursor={props.setTxnHashCursor}
131+ popRoute={props.popRoute}
132+ pushRoute={props.pushRoute}
263133 // Tx
264− txn={state.txn}
265− stx={state.stx}
266− // Tx details
267− nonce={state.nonce}
268− gasPrice={state.gasPrice}
269− chainId={state.chainId}
270− gasLimit={state.gasLimit}
271− showGasDetails={state.showGasDetails}
272− toggleGasDetails={this.toggleGasDetails}
273− // Checks
274− userApproval={state.userApproval}
275134 canGenerate={ canGenerate }
276− canSign={ canSign }
277− canApprove={ canApprove }
278− canSend={ canSend }
279− // Methods
280− createUnsignedTxn={this.handleCreateUnsignedTxn}
281− setUserApproval={this.handleSetUserApproval}
282− setTxn={this.handleSetTxn}
283− setStx={this.handleSetStx}
284− setNonce={this.handleSetNonce}
285− setChainId={this.handleSetChainId}
286− setGasPrice={this.handleSetGasPrice}
287− setGasLimit={this.handleSetGasLimit}
288− handleSubmit={this.handleSubmit} />
289−
290− {
291− Nothing.hasInstance(state.txError)
292− ? ''
293− : <Warning className={'mt-8'}>
294− <H3 style={{marginTop: 0, paddingTop: 0}}>
295− {
296− 'There was an error sending your transaction.'
297− }
298− </H3>
299− { state.txError.value }
300− </Warning>
301− }
302−
135+ createUnsignedTxn={this.createUnsignedTxn} />
303136 </Col>
304137 </Row>
305138 )
src/bridge/views/CancelTransfer.js+6−185
@@ -32,150 +32,10 @@ class CancelTransfer extends React.Component {
3232
3333 this.state = {
3434 proxyAddress: '',
35− txn: Maybe.Nothing(),
36− txError: Maybe.Nothing(),
3735 pointInTransfer: pointInTransfer,
38− userApproval: false,
39− nonce: '',
40− gasPrice: '5',
41− showGasDetails: false,
42− chainId: '',
43− gasLimit: '600000',
44− stx: Maybe.Nothing(),
4536 }
46− // Transaction
47− this.handleCreateUnsignedTxn = this.handleCreateUnsignedTxn.bind(this)
48− this.handleSubmit = this.handleSubmit.bind(this)
49− this.handleSetUserApproval = this.handleSetUserApproval.bind(this)
50− this.handleSetTxn = this.handleSetTxn.bind(this)
51− this.handleSetStx = this.handleSetStx.bind(this)
52− this.handleSetNonce = this.handleSetNonce.bind(this)
53− this.handleSetChainId = this.handleSetChainId.bind(this)
54− this.handleSetGasPrice = this.handleSetGasPrice.bind(this)
55− this.handleSetGasLimit = this.handleSetGasLimit.bind(this)
56− this.toggleGasDetails = this.toggleGasDetails.bind(this)
57− }
58−
59− toggleGasDetails() {
60− this.setState({
61− showGasDetails: !this.state.showGasDetails
62− })
63− }
64−
65− componentDidMount() {
66− const { props } = this
67−
68− const addr = props.wallet.matchWith({
69− Just: wal => addressFromSecp256k1Public(wal.value.publicKey),
70− Nothing: () => {
71− throw BRIDGE_ERROR.MISSING_WALLET
72− }
73− })
74−
75− props.web3.matchWith({
76− Nothing: () => {},
77− Just: (w3) => {
78− const validWeb3 = w3.value
79−
80− const getTxMetadata = [
81− validWeb3.eth.getTransactionCount(addr),
82− validWeb3.eth.net.getId(),
83− validWeb3.eth.getGasPrice()
84− ];
85−
86− Promise.all(getTxMetadata).then(r => {
87− const txMetadata = {
88− nonce: r[0],
89− chainId: r[1],
90− gasPrice: fromWei(r[2], 'gwei'),
91− };
92−
93− this.setState({...txMetadata})
94−
95− })
96− }
97− });
98−
99− }
100−
101−
102−
103− handleCreateUnsignedTxn() {
104− const txn = this.createUnsignedTxn()
105− this.setState({ txn })
106− }
107−
108−
109−
110− handleSetUserApproval(){
111− const {state} = this
112− this.setState({ userApproval: !state.userApproval })
113− }
114−
115−
116−
117− handleSetTxn(txn){
118− this.setState({ txn })
119− }
120−
12137
122−
123− handleSetStx(stx){
124− this.setState({
125− stx,
126− userApproval: false,
127− })
128− }
129−
130−
131−
132− handleSetNonce(nonce){
133− this.setState({ nonce })
134− this.handleClearStx()
135− }
136−
137−
138−
139− handleSetChainId(chainId){
140− this.setState({ chainId })
141− this.handleClearStx()
142− }
143−
144−
145−
146− handleSetGasPrice(gasPrice){
147− this.setState({ gasPrice })
148− this.handleClearStx()
149− }
150−
151−
152−
153− handleSetGasLimit(gasLimit){
154− this.setState({ gasLimit })
155− this.handleClearStx()
156− }
157−
158−
159−
160− handleClearStx() {
161− this.setState({
162− userApproval: false,
163− stx: Maybe.Nothing(),
164− })
165− }
166−
167−
168− handleSubmit(){
169− const { props, state } = this
170− sendSignedTransaction(props.web3.value, state.stx)
171− .then(sent => {
172− props.setTxnHashCursor(sent)
173− props.popRoute()
174− props.pushRoute(ROUTE_NAMES.SENT_TRANSACTION)
175− })
176− .catch(err => {
177− this.setState({ txError: err.map(val => val.merge()) })
178− })
38+ this.createUnsignedTxn = this.createUnsignedTxn.bind(this)
17939 }
18040
18141 createUnsignedTxn() {
@@ -204,7 +64,6 @@ class CancelTransfer extends React.Component {
20464 return Maybe.Just(txn)
20565 }
20666
207−
20867 render() {
20968 const { props, state } = this
21069
@@ -217,10 +76,6 @@ class CancelTransfer extends React.Component {
21776 // const canGenerate = validAddress === true
21877
21978 const canGenerate = true
220− const canSign = Maybe.Just.hasInstance(state.txn)
221− const canApprove = Maybe.Just.hasInstance(state.stx)
222− const canSend = Maybe.Just.hasInstance(state.stx) && state.userApproval === true
223−
22479
22580 return (
22681 <Row>
@@ -242,46 +97,12 @@ class CancelTransfer extends React.Component {
24297 walletType={props.walletType}
24398 walletHdPath={props.walletHdPath}
24499 networkType={props.networkType}
245− // Tx
246− txn={state.txn}
247− stx={state.stx}
248− // Tx details
249− nonce={state.nonce}
250− gasPrice={state.gasPrice}
251− chainId={state.chainId}
252− gasLimit={state.gasLimit}
253− showGasDetails={state.showGasDetails}
254− toggleGasDetails={this.toggleGasDetails}
255− // Checks
256− userApproval={state.userApproval}
100+ setTxnHashCursor={props.setTxnHashCursor}
101+ popRoute={props.popRoute}
102+ pushRoute={props.pushRoute}
103+ // Other
257104 canGenerate={ canGenerate }
258− canSign={ canSign }
259− canApprove={ canApprove }
260− canSend={ canSend }
261− // Methods
262− createUnsignedTxn={this.handleCreateUnsignedTxn}
263− setUserApproval={this.handleSetUserApproval}
264− setTxn={this.handleSetTxn}
265− setStx={this.handleSetStx}
266− setNonce={this.handleSetNonce}
267− setChainId={this.handleSetChainId}
268− setGasPrice={this.handleSetGasPrice}
269− setGasLimit={this.handleSetGasLimit}
270− handleSubmit={this.handleSubmit} />
271−
272− {
273− Maybe.Nothing.hasInstance(state.txError)
274− ? ''
275− : <Warning className={'mt-8'}>
276− <H3 style={{marginTop: 0, paddingTop: 0}}>
277− {
278− 'There was an error sending your transaction.'
279− }
280− </H3>
281− { state.txError.value }
282− </Warning>
283− }
284−
105+ createUnsignedTxn={this.createUnsignedTxn} />
285106 </Col>
286107 </Row>
287108 )
src/bridge/views/Transfer.js+9−212
@@ -33,191 +33,26 @@ class Transfer extends React.Component {
3333 })
3434
3535 this.state = {
36− txError: Maybe.Nothing(),
3736 receivingAddress: '',
3837 issuingPoint: issuingPoint,
39− userApproval: false,
40− nonce: '',
41− gasPrice: '5',
42− showGasDetails: false,
43− chainId: '',
44− gasLimit: '600000',
45− txn: Maybe.Nothing(),
46− stx: Maybe.Nothing(),
4738 }
48− this.handleAddressInput = this.handleAddressInput.bind(this)
49− // Transaction
50− this.handleCreateUnsignedTxn = this.handleCreateUnsignedTxn.bind(this)
51− this.handleSubmit = this.handleSubmit.bind(this)
52− this.handleSetUserApproval = this.handleSetUserApproval.bind(this)
53− this.handleSetTxn = this.handleSetTxn.bind(this)
54− this.handleSetStx = this.handleSetStx.bind(this)
55− this.handleSetNonce = this.handleSetNonce.bind(this)
56− this.handleSetChainId = this.handleSetChainId.bind(this)
57− this.handleSetGasPrice = this.handleSetGasPrice.bind(this)
58− this.handleSetGasLimit = this.handleSetGasLimit.bind(this)
59− this.toggleGasDetails = this.toggleGasDetails.bind(this)
60− }
61−
62− toggleGasDetails() {
63− this.setState({
64− showGasDetails: !this.state.showGasDetails
65− })
66− }
67−
68− componentDidMount() {
69− const { props } = this
70−
71− const addr = props.wallet.matchWith({
72− Just: wal => addressFromSecp256k1Public(wal.value.publicKey),
73− Nothing: () => {
74− throw BRIDGE_ERROR.MISSING_WALLET
75− }
76− })
77−
78− props.web3.matchWith({
79− Nothing: () => {},
80− Just: (w3) => {
81− const validWeb3 = w3.value
82−
83− const getTxMetadata = [
84− validWeb3.eth.getTransactionCount(addr),
85− validWeb3.eth.net.getId(),
86− validWeb3.eth.getGasPrice()
87− ];
88−
89− Promise.all(getTxMetadata).then(r => {
90− const txMetadata = {
91− nonce: r[0],
92− chainId: r[1],
93− gasPrice: fromWei(r[2], 'gwei'),
94− };
95−
96− this.setState({...txMetadata})
97−
98− })
99− }
100− });
10139
40+ this.handleAddressInput = this.handleAddressInput.bind(this)
41+ this.createUnsignedTxn = this.createUnsignedTxn.bind(this)
42+ this.statelessRef = React.createRef();
10243 }
10344
104−
105−
10645 handleAddressInput(receivingAddress) {
10746 this.setState({ receivingAddress })
108− this.handleClearTxn()
47+ this.statelessRef.current.clearTxn()
10948 }
11049
111−
112−
11350 handleConfirmAvailability() {
11451 this.confirmPointAvailability().then(r => {
11552 this.setState({ isAvailable: r })
11653 })
11754 }
11855
119−
120−
121− handleCreateUnsignedTxn() {
122− const txn = this.createUnsignedTxn()
123− this.setState({ txn })
124− }
125−
126−
127− handleSetUserApproval(){
128− const {state} = this
129− this.setState({ userApproval: !state.userApproval })
130− }
131−
132−
133−
134− handleSetTxn(txn){
135− this.setState({ txn })
136− }
137−
138−
139−
140− handleSetStx(stx){
141− this.setState({
142− stx,
143− userApproval: false,
144− })
145− }
146−
147−
148−
149− handleSetNonce(nonce){
150− this.setState({ nonce })
151− this.handleClearStx()
152− }
153−
154−
155−
156− handleSetChainId(chainId){
157− this.setState({ chainId })
158− this.handleClearStx()
159− }
160−
161−
162−
163− handleSetGasPrice(gasPrice){
164− this.setState({ gasPrice })
165− this.handleClearStx()
166− }
167−
168−
169−
170− handleSetGasLimit(gasLimit){
171− this.setState({ gasLimit })
172− this.handleClearStx()
173− }
174−
175−
176−
177− handleClearStx() {
178− this.setState({
179− userApproval: false,
180− stx: Maybe.Nothing(),
181− })
182− }
183−
184−
185−
186− handleClearTxn() {
187− this.setState({
188− userApproval: false,
189− txn: Maybe.Nothing(),
190− stx: Maybe.Nothing(),
191− })
192− }
193−
194−
195−
196− handleClearTransaction() {
197− this.setState({
198− userApproval: false,
199− txn: Maybe.Nothing(),
200− stx: Maybe.Nothing(),
201− })
202− }
203−
204−
205−
206− handleSubmit(){
207− const { props, state } = this
208− sendSignedTransaction(props.web3.value, state.stx)
209− .then(sent => {
210− props.setTxnHashCursor(sent)
211− props.popRoute()
212− props.pushRoute(ROUTE_NAMES.SENT_TRANSACTION)
213− })
214− .catch(err => {
215− this.setState({ txError: err.map(val => val.merge()) })
216− })
217− }
218−
219−
220−
22156 createUnsignedTxn() {
22257 const { state, props } = this
22358
@@ -244,19 +79,12 @@ class Transfer extends React.Component {
24479 return Maybe.Just(txn)
24580 }
24681
247−
248−
24982 render() {
25083 const { props, state } = this
25184
25285 const validAddress = isValidAddress(state.receivingAddress)
253−
25486 const canGenerate = validAddress === true
25587
256− const canSign = Maybe.Just.hasInstance(state.txn)
257− const canApprove = Maybe.Just.hasInstance(state.stx)
258− const canSend = Maybe.Just.hasInstance(state.stx) && state.userApproval === true
259−
26088 const esvisible =
26189 props.networkType === NETWORK_NAMES.ROPSTEN ||
26290 props.networkType === NETWORK_NAMES.MAINNET
@@ -310,46 +138,15 @@ class Transfer extends React.Component {
310138 walletType={props.walletType}
311139 walletHdPath={props.walletHdPath}
312140 networkType={props.networkType}
313− // Tx
314− txn={state.txn}
315− stx={state.stx}
316− // Tx details
317− nonce={state.nonce}
318− gasPrice={state.gasPrice}
319− chainId={state.chainId}
320− gasLimit={state.gasLimit}
321− showGasDetails={state.showGasDetails}
322− toggleGasDetails={this.toggleGasDetails}
141+ setTxnHashCursor={props.setTxnHashCursor}
142+ popRoute={props.popRoute}
143+ pushRoute={props.pushRoute}
323144 // Checks
324145 userApproval={state.userApproval}
325146 canGenerate={ canGenerate }
326− canSign={ canSign }
327− canApprove={ canApprove }
328− canSend={ canSend }
329147 // Methods
330− createUnsignedTxn={this.handleCreateUnsignedTxn}
331− setUserApproval={this.handleSetUserApproval}
332− setTxn={this.handleSetTxn}
333− setStx={this.handleSetStx}
334− setNonce={this.handleSetNonce}
335− setChainId={this.handleSetChainId}
336− setGasPrice={this.handleSetGasPrice}
337− setGasLimit={this.handleSetGasLimit}
338− handleSubmit={this.handleSubmit} />
339−
340− {
341− Maybe.Nothing.hasInstance(state.txError)
342− ? ''
343− : <Warning className={'mt-8'}>
344− <H3 style={{marginTop: 0, paddingTop: 0}}>
345− {
346− 'There was an error sending your transaction.'
347− }
348− </H3>
349− { state.txError.value }
350− </Warning>
351− }
352−
148+ createUnsignedTxn={this.createUnsignedTxn}
149+ ref={this.statelessRef} />
353150 </Col>
354151 </Row>
355152 )