2016-04-13 15:28:44 -07:00
|
|
|
const inherits = require('util').inherits
|
|
|
|
const Component = require('react').Component
|
|
|
|
const h = require('react-hyperscript')
|
|
|
|
const connect = require('react-redux').connect
|
|
|
|
const actions = require('./actions')
|
2017-01-04 14:30:14 -08:00
|
|
|
const NetworkIndicator = require('./components/network')
|
2016-05-03 14:32:22 -07:00
|
|
|
const txHelper = require('../lib/tx-helper')
|
2017-07-20 12:54:08 -07:00
|
|
|
const isPopupOrNotification = require('../../app/scripts/lib/is-popup-or-notification')
|
2016-05-03 14:32:22 -07:00
|
|
|
|
2016-06-24 12:48:52 -07:00
|
|
|
const PendingTx = require('./components/pending-tx')
|
2016-05-03 14:32:22 -07:00
|
|
|
const PendingMsg = require('./components/pending-msg')
|
2017-02-22 16:23:13 -08:00
|
|
|
const PendingPersonalMsg = require('./components/pending-personal-msg')
|
2017-02-28 12:00:07 -08:00
|
|
|
const Loading = require('./components/loading')
|
2016-04-13 15:28:44 -07:00
|
|
|
|
|
|
|
module.exports = connect(mapStateToProps)(ConfirmTxScreen)
|
|
|
|
|
2016-06-21 13:18:32 -07:00
|
|
|
function mapStateToProps (state) {
|
2016-04-13 15:28:44 -07:00
|
|
|
return {
|
|
|
|
identities: state.metamask.identities,
|
|
|
|
accounts: state.metamask.accounts,
|
2017-01-30 15:08:31 -08:00
|
|
|
selectedAddress: state.metamask.selectedAddress,
|
2017-01-27 16:11:59 -08:00
|
|
|
unapprovedTxs: state.metamask.unapprovedTxs,
|
|
|
|
unapprovedMsgs: state.metamask.unapprovedMsgs,
|
2017-02-22 16:23:13 -08:00
|
|
|
unapprovedPersonalMsgs: state.metamask.unapprovedPersonalMsgs,
|
2016-04-13 15:28:44 -07:00
|
|
|
index: state.appState.currentView.context,
|
2016-05-03 14:32:22 -07:00
|
|
|
warning: state.appState.warning,
|
2016-09-08 12:56:04 -07:00
|
|
|
network: state.metamask.network,
|
2017-01-04 14:30:14 -08:00
|
|
|
provider: state.metamask.provider,
|
2017-05-12 12:41:31 -07:00
|
|
|
conversionRate: state.metamask.conversionRate,
|
2017-05-16 11:34:53 -07:00
|
|
|
currentCurrency: state.metamask.currentCurrency,
|
2017-06-02 15:18:14 -07:00
|
|
|
blockGasLimit: state.metamask.currentBlockGasLimit,
|
2016-04-13 15:28:44 -07:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
inherits(ConfirmTxScreen, Component)
|
2016-06-21 13:18:32 -07:00
|
|
|
function ConfirmTxScreen () {
|
2016-04-13 15:28:44 -07:00
|
|
|
Component.call(this)
|
|
|
|
}
|
|
|
|
|
2016-06-21 13:18:32 -07:00
|
|
|
ConfirmTxScreen.prototype.render = function () {
|
2017-02-22 16:23:13 -08:00
|
|
|
const props = this.props
|
2017-05-16 11:34:53 -07:00
|
|
|
const { network, provider, unapprovedTxs, currentCurrency,
|
2017-06-02 15:18:14 -07:00
|
|
|
unapprovedMsgs, unapprovedPersonalMsgs, conversionRate, blockGasLimit } = props
|
2017-01-16 23:59:25 -08:00
|
|
|
|
2017-02-22 16:23:13 -08:00
|
|
|
var unconfTxList = txHelper(unapprovedTxs, unapprovedMsgs, unapprovedPersonalMsgs, network)
|
2017-03-24 12:50:39 -07:00
|
|
|
|
|
|
|
var txData = unconfTxList[props.index] || {}
|
2017-01-16 23:59:25 -08:00
|
|
|
var txParams = txData.params || {}
|
2016-08-22 17:29:47 -07:00
|
|
|
var isNotification = isPopupOrNotification() === 'notification'
|
2017-02-20 23:33:21 -08:00
|
|
|
|
2017-06-05 11:40:20 -07:00
|
|
|
|
2017-02-20 23:33:21 -08:00
|
|
|
log.info(`rendering a combined ${unconfTxList.length} unconf msg & txs`)
|
2017-02-28 22:12:31 -08:00
|
|
|
if (unconfTxList.length === 0) return h(Loading, { isLoading: true })
|
2017-01-14 22:59:05 -08:00
|
|
|
|
2016-04-13 15:28:44 -07:00
|
|
|
return (
|
|
|
|
|
2016-07-07 12:27:34 -07:00
|
|
|
h('.flex-column.flex-grow', [
|
2016-04-13 15:28:44 -07:00
|
|
|
|
|
|
|
// subtitle and nav
|
|
|
|
h('.section-title.flex-row.flex-center', [
|
2016-08-16 17:32:54 -07:00
|
|
|
!isNotification ? h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
|
2016-05-03 14:32:22 -07:00
|
|
|
onClick: this.goHome.bind(this),
|
2016-08-16 17:32:54 -07:00
|
|
|
}) : null,
|
2017-01-05 08:31:54 -08:00
|
|
|
h('h2.page-subtitle', 'Confirm Transaction'),
|
2017-01-04 14:30:14 -08:00
|
|
|
isNotification ? h(NetworkIndicator, {
|
|
|
|
network: network,
|
|
|
|
provider: provider,
|
|
|
|
}) : null,
|
2016-04-13 15:28:44 -07:00
|
|
|
]),
|
|
|
|
|
|
|
|
h('h3', {
|
|
|
|
style: {
|
|
|
|
alignSelf: 'center',
|
|
|
|
display: unconfTxList.length > 1 ? 'block' : 'none',
|
|
|
|
},
|
|
|
|
}, [
|
|
|
|
h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
|
|
|
|
style: {
|
2017-02-17 12:08:54 -08:00
|
|
|
display: props.index === 0 ? 'none' : 'inline-block',
|
2016-04-13 15:28:44 -07:00
|
|
|
},
|
2017-02-17 12:08:54 -08:00
|
|
|
onClick: () => props.dispatch(actions.previousTx()),
|
2016-04-13 15:28:44 -07:00
|
|
|
}),
|
2017-02-17 12:08:54 -08:00
|
|
|
` ${props.index + 1} of ${unconfTxList.length} `,
|
2016-04-13 15:28:44 -07:00
|
|
|
h('i.fa.fa-arrow-right.fa-lg.cursor-pointer', {
|
|
|
|
style: {
|
2017-02-17 12:08:54 -08:00
|
|
|
display: props.index + 1 === unconfTxList.length ? 'none' : 'inline-block',
|
2016-04-13 15:28:44 -07:00
|
|
|
},
|
2017-02-17 12:08:54 -08:00
|
|
|
onClick: () => props.dispatch(actions.nextTx()),
|
2016-04-13 15:28:44 -07:00
|
|
|
}),
|
|
|
|
]),
|
|
|
|
|
2017-02-17 12:08:54 -08:00
|
|
|
warningIfExists(props.warning),
|
2016-05-03 14:32:22 -07:00
|
|
|
|
2017-07-25 18:22:31 -07:00
|
|
|
currentTxView({
|
|
|
|
// Properties
|
|
|
|
txData: txData,
|
|
|
|
key: txData.id,
|
|
|
|
selectedAddress: props.selectedAddress,
|
|
|
|
accounts: props.accounts,
|
|
|
|
identities: props.identities,
|
|
|
|
conversionRate,
|
|
|
|
currentCurrency,
|
|
|
|
blockGasLimit,
|
|
|
|
// Actions
|
|
|
|
buyEth: this.buyEth.bind(this, txParams.from || props.selectedAddress),
|
|
|
|
sendTransaction: this.sendTransaction.bind(this),
|
|
|
|
cancelTransaction: this.cancelTransaction.bind(this, txData),
|
|
|
|
signMessage: this.signMessage.bind(this, txData),
|
|
|
|
signPersonalMessage: this.signPersonalMessage.bind(this, txData),
|
|
|
|
cancelMessage: this.cancelMessage.bind(this, txData),
|
|
|
|
cancelPersonalMessage: this.cancelPersonalMessage.bind(this, txData),
|
|
|
|
}),
|
2016-05-03 14:32:22 -07:00
|
|
|
])
|
2016-04-13 15:28:44 -07:00
|
|
|
)
|
|
|
|
}
|
|
|
|
|
2016-05-03 14:32:22 -07:00
|
|
|
function currentTxView (opts) {
|
2017-02-23 11:18:49 -08:00
|
|
|
log.info('rendering current tx view')
|
2017-01-16 23:59:25 -08:00
|
|
|
const { txData } = opts
|
2017-02-23 11:18:49 -08:00
|
|
|
const { txParams, msgParams, type } = txData
|
2017-01-16 23:59:25 -08:00
|
|
|
|
|
|
|
if (txParams) {
|
2017-02-20 23:33:21 -08:00
|
|
|
log.debug('txParams detected, rendering pending tx')
|
2016-06-24 12:48:52 -07:00
|
|
|
return h(PendingTx, opts)
|
2017-01-16 23:59:25 -08:00
|
|
|
} else if (msgParams) {
|
2017-02-20 23:33:21 -08:00
|
|
|
log.debug('msgParams detected, rendering pending msg')
|
2017-02-23 11:18:49 -08:00
|
|
|
|
|
|
|
if (type === 'eth_sign') {
|
|
|
|
log.debug('rendering eth_sign message')
|
|
|
|
return h(PendingMsg, opts)
|
|
|
|
} else if (type === 'personal_sign') {
|
|
|
|
log.debug('rendering personal_sign message')
|
|
|
|
return h(PendingPersonalMsg, opts)
|
|
|
|
}
|
2016-05-03 14:32:22 -07:00
|
|
|
}
|
|
|
|
}
|
2017-02-17 12:08:54 -08:00
|
|
|
|
2016-09-15 14:31:45 -07:00
|
|
|
ConfirmTxScreen.prototype.buyEth = function (address, event) {
|
2017-04-24 03:35:45 -07:00
|
|
|
event.preventDefault()
|
2016-09-15 14:31:45 -07:00
|
|
|
this.props.dispatch(actions.buyEthView(address))
|
|
|
|
}
|
|
|
|
|
|
|
|
ConfirmTxScreen.prototype.sendTransaction = function (txData, event) {
|
2017-03-22 15:14:33 -07:00
|
|
|
this.stopPropagation(event)
|
2017-03-28 11:46:33 -07:00
|
|
|
this.props.dispatch(actions.updateAndApproveTx(txData))
|
2016-04-13 15:28:44 -07:00
|
|
|
}
|
|
|
|
|
2016-06-21 13:18:32 -07:00
|
|
|
ConfirmTxScreen.prototype.cancelTransaction = function (txData, event) {
|
2017-03-22 15:14:33 -07:00
|
|
|
this.stopPropagation(event)
|
2017-03-23 15:01:05 -07:00
|
|
|
event.preventDefault()
|
2016-04-13 15:28:44 -07:00
|
|
|
this.props.dispatch(actions.cancelTx(txData))
|
|
|
|
}
|
|
|
|
|
2016-06-21 13:18:32 -07:00
|
|
|
ConfirmTxScreen.prototype.signMessage = function (msgData, event) {
|
2017-02-23 14:23:45 -08:00
|
|
|
log.info('conf-tx.js: signing message')
|
2016-05-03 14:32:22 -07:00
|
|
|
var params = msgData.msgParams
|
|
|
|
params.metamaskId = msgData.id
|
2017-03-22 15:14:33 -07:00
|
|
|
this.stopPropagation(event)
|
2016-05-03 14:32:22 -07:00
|
|
|
this.props.dispatch(actions.signMsg(params))
|
|
|
|
}
|
|
|
|
|
2017-03-22 15:14:33 -07:00
|
|
|
ConfirmTxScreen.prototype.stopPropagation = function (event) {
|
|
|
|
if (event.stopPropagation) {
|
|
|
|
event.stopPropagation()
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2017-02-23 14:23:45 -08:00
|
|
|
ConfirmTxScreen.prototype.signPersonalMessage = function (msgData, event) {
|
|
|
|
log.info('conf-tx.js: signing personal message')
|
|
|
|
var params = msgData.msgParams
|
|
|
|
params.metamaskId = msgData.id
|
2017-03-22 15:14:33 -07:00
|
|
|
this.stopPropagation(event)
|
2017-02-23 14:23:45 -08:00
|
|
|
this.props.dispatch(actions.signPersonalMsg(params))
|
|
|
|
}
|
|
|
|
|
2016-06-21 13:18:32 -07:00
|
|
|
ConfirmTxScreen.prototype.cancelMessage = function (msgData, event) {
|
2017-02-23 14:23:45 -08:00
|
|
|
log.info('canceling message')
|
2017-03-22 15:14:33 -07:00
|
|
|
this.stopPropagation(event)
|
2016-05-03 14:32:22 -07:00
|
|
|
this.props.dispatch(actions.cancelMsg(msgData))
|
|
|
|
}
|
|
|
|
|
2017-02-23 16:00:43 -08:00
|
|
|
ConfirmTxScreen.prototype.cancelPersonalMessage = function (msgData, event) {
|
|
|
|
log.info('canceling personal message')
|
2017-03-22 15:14:33 -07:00
|
|
|
this.stopPropagation(event)
|
2017-02-23 16:00:43 -08:00
|
|
|
this.props.dispatch(actions.cancelPersonalMsg(msgData))
|
|
|
|
}
|
|
|
|
|
2016-06-21 13:18:32 -07:00
|
|
|
ConfirmTxScreen.prototype.goHome = function (event) {
|
2017-03-22 15:14:33 -07:00
|
|
|
this.stopPropagation(event)
|
2016-05-03 14:32:22 -07:00
|
|
|
this.props.dispatch(actions.goHome())
|
|
|
|
}
|
|
|
|
|
2016-06-21 13:18:32 -07:00
|
|
|
function warningIfExists (warning) {
|
2016-09-14 14:34:54 -07:00
|
|
|
if (warning &&
|
2017-02-23 14:23:45 -08:00
|
|
|
// Do not display user rejections on this screen:
|
2016-09-14 14:34:54 -07:00
|
|
|
warning.indexOf('User denied transaction signature') === -1) {
|
2016-11-10 22:13:30 -08:00
|
|
|
return h('.error', {
|
|
|
|
style: {
|
|
|
|
margin: 'auto',
|
2016-11-10 22:20:58 -08:00
|
|
|
},
|
|
|
|
}, warning)
|
2016-05-03 14:32:22 -07:00
|
|
|
}
|
2016-04-13 15:28:44 -07:00
|
|
|
}
|