58ac642 · bridge · git.iko.soy

git.iko.soy/bridge

Add transaction status indicator to SentTransaction

commit58ac6426a090b61dc32da4535bf785287b74e7b7 authorpkova <pyry.kovanen@gmail.com> dateMon 8 Apr 2019, 22:48 (8 years ago) parentbf5e9bb

11 files changed+51−11

compare with master

unifiedsplit

src/bridge/Bridge.js+13−2 src/bridge/components/StatelessTransaction.js+1−1 src/bridge/lib/txn.js+5−1 src/bridge/views/AcceptTransfer.js+1 src/bridge/views/CancelTransfer.js+1 src/bridge/views/CreateGalaxy.js+1 src/bridge/views/IssueChild.js+1 src/bridge/views/SentTransaction.js+25−7 src/bridge/views/SetKeys.js+1 src/bridge/views/SetProxy.js+1 src/bridge/views/Transfer.js+1

src/bridge/Bridge.js+13−2

@@ -80,7 +80,8 @@ class Bridge extends React.Component {

8080 pointCursor: Maybe.Nothing(),

8181 pointCache: {},

8282 // txn

83− txnHashCursor: Maybe.Nothing()

83+ txnHashCursor: Maybe.Nothing(),

84+ txnConfirmations: {}

8485 }

8586

8687 this.pushRoute = this.pushRoute.bind(this)

@@ -95,6 +96,7 @@ class Bridge extends React.Component {

9596 this.setAuthMnemonic = this.setAuthMnemonic.bind(this)

9697 this.setPointCursor = this.setPointCursor.bind(this)

9798 this.setTxnHashCursor = this.setTxnHashCursor.bind(this)

99+ this.setTxnConfirmations = this.setTxnConfirmations.bind(this)

98100 this.setNetworkSeedCache = this.setNetworkSeedCache.bind(this)

99101 this.addToPointCache = this.addToPointCache.bind(this)

100102 }

@@ -234,6 +236,12 @@ class Bridge extends React.Component {

234236 this.setState({ txnHashCursor })

235237 }

236238

239+ setTxnConfirmations(txnHash, txnConfirmations) {

240+ this.setState((prevState, _) =>

241+ ({txnConfirmations: { ...prevState.txnConfirmations,

242+ [txnHash]: txnConfirmations}}))

243+ }

244+

237245 render() {

238246 const {

239247 routeCrumbs,

@@ -248,6 +256,7 @@ class Bridge extends React.Component {

248256 pointCursor,

249257 pointCache,

250258 txnHashCursor,

259+ txnConfirmations,

251260 web3,

252261 contracts

253262 } = this.state

@@ -300,7 +309,9 @@ class Bridge extends React.Component {

300309 setNetworkSeedCache= { this.setNetworkSeedCache }

301310 // txn

302311 setTxnHashCursor={ this.setTxnHashCursor }

303− txnHashCursor={ txnHashCursor } />

312+ txnHashCursor={ txnHashCursor }

313+ setTxnConfirmations={ this.setTxnConfirmations }

314+ txnConfirmations={ txnConfirmations } />

304315

305316 <div className={'push'} />

306317

src/bridge/components/StatelessTransaction.js+1−1

@@ -85,7 +85,7 @@ class StatelessTransaction extends React.Component {

8585

8686 submit(){

8787 const { props, state } = this

88− sendSignedTransaction(props.web3.value, state.stx)

88+ sendSignedTransaction(props.web3.value, state.stx, props.setTxnConfirmations)

8989 .then(sent => {

9090 props.setTxnHashCursor(sent)

9191 props.popRoute()

src/bridge/lib/txn.js+5−1

@@ -137,7 +137,7 @@ const signTransaction = async config => {

137137 setStx(Just(stx))

138138}

139139

140−const sendSignedTransaction = (web3, stx) => {

140+const sendSignedTransaction = (web3, stx, confirmationCb) => {

141141 const txn = stx.matchWith({

142142 Just: (tx) => tx.value,

143143 Nothing: () => {

@@ -155,6 +155,10 @@ const sendSignedTransaction = (web3, stx) => {

155155 .on('receipt', txn => {

156156 resolve(Just(Ok(txn.transactionHash)))

157157 })

158+ .on('confirmation', (confirmationNum, txn) => {

159+ confirmationCb(txn.transactionHash, confirmationNum + 1)

160+ resolve(Just(Ok(txn.transactionHash)))

161+ })

158162 .on('error', err => {

159163 reject(Just(Error(err.message)))

160164 })

src/bridge/views/AcceptTransfer.js+1

@@ -126,6 +126,7 @@ class AcceptTransfer extends React.Component {

126126 walletHdPath={props.walletHdPath}

127127 networkType={props.networkType}

128128 setTxnHashCursor={props.setTxnHashCursor}

129+ setTxnConfirmations={props.setTxnConfirmations}

129130 popRoute={props.popRoute}

130131 pushRoute={props.pushRoute}

131132 // Other

src/bridge/views/CancelTransfer.js+1

@@ -87,6 +87,7 @@ class CancelTransfer extends React.Component {

8787 walletHdPath={props.walletHdPath}

8888 networkType={props.networkType}

8989 setTxnHashCursor={props.setTxnHashCursor}

90+ setTxnConfirmations={props.setTxnConfirmations}

9091 popRoute={props.popRoute}

9192 pushRoute={props.pushRoute}

9293 // Other

src/bridge/views/CreateGalaxy.js+1

@@ -212,6 +212,7 @@ class CreateGalaxy extends React.Component {

212212 walletHdPath={props.walletHdPath}

213213 networkType={props.networkType}

214214 setTxnHashCursor={props.setTxnHashCursor}

215+ setTxnConfirmations={props.setTxnConfirmations}

215216 popRoute={props.popRoute}

216217 pushRoute={props.pushRoute}

217218 // Other

src/bridge/views/IssueChild.js+1

@@ -303,6 +303,7 @@ class IssueChild extends React.Component {

303303 walletHdPath={props.walletHdPath}

304304 networkType={props.networkType}

305305 setTxnHashCursor={props.setTxnHashCursor}

306+ setTxnConfirmations={props.setTxnConfirmations}

306307 popRoute={props.popRoute}

307308 pushRoute={props.pushRoute}

308309 // Other

src/bridge/views/SentTransaction.js+25−7

@@ -1,3 +1,4 @@

1+import Maybe from 'folktale/maybe'

12import React from 'react'

23import { Row, Col, H1, H3, P, Warning, Anchor } from '../components/Base'

34import { Button } from '../components/Base'

@@ -6,14 +7,17 @@ import { ROUTE_NAMES } from '../lib/router'

67import { BRIDGE_ERROR, renderTxnError } from '../lib/error'

78import { NETWORK_NAMES } from '../lib/network'

10+

911const Success = (props) => {

1012

13+ const { networkType, hash, txnConfirmations } = props

14+

1115 const esvisible =

12− props.networkType === NETWORK_NAMES.ROPSTEN ||

13− props.networkType === NETWORK_NAMES.MAINNET

16+ networkType === NETWORK_NAMES.ROPSTEN ||

17+ networkType === NETWORK_NAMES.MAINNET

1418

1519 const esdomain =

16− props.networkType === NETWORK_NAMES.ROPSTEN

20+ networkType === NETWORK_NAMES.ROPSTEN

1721 ? "ropsten.etherscan.io"

1822 : "etherscan.io"

1923

@@ -29,10 +33,16 @@ const Success = (props) => {

2933 className={'mb-4 mt-1'}

3034 prop-size={'sm'}

3135 target={'_blank'}

32− href={`https://${esdomain}/tx/${props.hash}`}>

36+ href={`https://${esdomain}/tx/${hash}`}>

3337 {'View on Etherscan ↗'}

3438 </Anchor>

3539

40+ const confirmations = Maybe.fromNullable(txnConfirmations[hash]).getOrElse(0)

41+

42+ const requiredConfirmations = 1

43+

44+ const status = confirmations < requiredConfirmations ? 'Pending...' : `Confirmed x${confirmations}!`

45+

3646 return (

3747 <Row>

3848 <Col>

@@ -47,10 +57,17 @@ const Success = (props) => {

4757

4858 <H3>{ 'Transaction Hash' }</H3>

4959 <P>

50− { props.hash }

60+ { hash }

61+ </P>

62+

63+ <H3>{ 'Transaction Status' }</H3>

64+ <P>

65+ <div>{ status }</div>

66+ <div>{ esanchor }</div>

67+ </P>

68+ <P>

5169 </P>

5270

53− { esanchor }

5471

5572 </Col>

5673 </Row>

@@ -76,7 +93,7 @@ const Failure = (props) =>

7693 </Row>

7794

7895const SentTransaction = (props) => {

79− const { web3, txnHashCursor, networkType, popRoute, pushRoute } = props

96+ const { web3, txnHashCursor, networkType, popRoute, pushRoute, txnConfirmations} = props

8097 const { setPointCursor, pointCursor } = props

8198

8299 const promptKeyfile = props.routeData && props.routeData.promptKeyfile

@@ -97,6 +114,7 @@ const SentTransaction = (props) => {

97114 <Success

98115 hash={ hash.value }

99116 networkType={ networkType }

117+ txnConfirmations={ txnConfirmations }

100118 />

101119 })

102120

src/bridge/views/SetKeys.js+1

@@ -194,6 +194,7 @@ class SetKeys extends React.Component {

194194 walletHdPath={props.walletHdPath}

195195 networkType={props.networkType}

196196 setTxnHashCursor={props.setTxnHashCursor}

197+ setTxnConfirmations={props.setTxnConfirmations}

197198 popRoute={props.popRoute}

198199 pushRoute={props.pushRoute}

199200 // Tx

src/bridge/views/SetProxy.js+1

@@ -162,6 +162,7 @@ class SetProxy extends React.Component {

162162 walletHdPath={props.walletHdPath}

163163 networkType={props.networkType}

164164 setTxnHashCursor={props.setTxnHashCursor}

165+ setTxnConfirmations={props.setTxnConfirmations}

165166 popRoute={props.popRoute}

166167 pushRoute={props.pushRoute}

167168 // Other

src/bridge/views/Transfer.js+1

@@ -132,6 +132,7 @@ class Transfer extends React.Component {

132132 walletHdPath={props.walletHdPath}

133133 networkType={props.networkType}

134134 setTxnHashCursor={props.setTxnHashCursor}

135+ setTxnConfirmations={props.setTxnConfirmations}

135136 popRoute={props.popRoute}

136137 pushRoute={props.pushRoute}

137138 // Checks