1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00

Change state to props, add modifiable fields.

This commit is contained in:
Kevin Serrano 2017-02-17 12:08:54 -08:00
parent fc77a36a55
commit 89af0ef408
No known key found for this signature in database
GPG Key ID: 7CC862A58D2889B4
2 changed files with 54 additions and 28 deletions

View File

@ -2,6 +2,8 @@ const Component = require('react').Component
const h = require('react-hyperscript') const h = require('react-hyperscript')
const inherits = require('util').inherits const inherits = require('util').inherits
const PendingTxDetails = require('./pending-tx-details') const PendingTxDetails = require('./pending-tx-details')
const BN = require('ethereumjs-util').BN
const ethUtil = require('ethereumjs-util')
module.exports = PendingTx module.exports = PendingTx
@ -11,8 +13,12 @@ function PendingTx () {
} }
PendingTx.prototype.render = function () { PendingTx.prototype.render = function () {
var state = this.props var props = this.props
var txData = state.txData var state = this.state || {}
var txData = props.txData
var txParams = txData.txParams
var gasValue = state.gas || txParams.gas
var decimalGas = decimalize(gasValue)
return ( return (
@ -21,7 +27,7 @@ PendingTx.prototype.render = function () {
}, [ }, [
// tx info // tx info
h(PendingTxDetails, state), h(PendingTxDetails, props),
h('style', ` h('style', `
.conf-buttons button { .conf-buttons button {
@ -39,7 +45,7 @@ PendingTx.prototype.render = function () {
}, 'Transaction Error. Exception thrown in contract code.') }, 'Transaction Error. Exception thrown in contract code.')
: null, : null,
state.insufficientBalance ? props.insufficientBalance ?
h('span.error', { h('span.error', {
style: { style: {
marginLeft: 50, marginLeft: 50,
@ -57,21 +63,39 @@ PendingTx.prototype.render = function () {
}, },
}, [ }, [
state.insufficientBalance ? props.insufficientBalance ?
h('button.btn-green', { h('button.btn-green', {
onClick: state.buyEth, onClick: props.buyEth,
}, 'Buy Ether') }, 'Buy Ether')
: null, : null,
h('button.confirm', { h('button.confirm', {
disabled: state.insufficientBalance, disabled: props.insufficientBalance,
onClick: state.sendTransaction, onClick: props.sendTransaction,
}, 'Accept'), }, 'Accept'),
h('button.cancel.btn-red', { h('button.cancel.btn-red', {
onClick: state.cancelTransaction, onClick: props.cancelTransaction,
}, 'Reject'), }, 'Reject'),
]), ]),
h('input', {
value: decimalGas,
onChange: (event) => {
const hexString = hexify(event.target.value)
this.setState({ gas: hexString })
}
}),
]) ])
) )
} }
function decimalize (input) {
const strippedInput = ethUtil.stripHexPrefix(input)
const inputBN = new BN(strippedInput, 'hex')
return inputBN.toString(10)
}
function hexify (decimalString) {
const hexBN = new BN(decimalString, 10)
return '0x' + hexBN.toString('hex')
}

View File

@ -35,15 +35,16 @@ function ConfirmTxScreen () {
} }
ConfirmTxScreen.prototype.render = function () { ConfirmTxScreen.prototype.render = function () {
var state = this.props var props = this.props
var state = this.state || {}
var network = state.network var network = props.network
var provider = state.provider var provider = props.provider
var unapprovedTxs = state.unapprovedTxs var unapprovedTxs = props.unapprovedTxs
var unapprovedMsgs = state.unapprovedMsgs var unapprovedMsgs = props.unapprovedMsgs
var unconfTxList = txHelper(unapprovedTxs, unapprovedMsgs, network) var unconfTxList = txHelper(unapprovedTxs, unapprovedMsgs, network)
var index = state.index !== undefined && unconfTxList[index] ? state.index : 0 var index = props.index !== undefined && unconfTxList[index] ? props.index : 0
var txData = unconfTxList[index] || {} var txData = unconfTxList[index] || {}
var txParams = txData.params || {} var txParams = txData.params || {}
var isNotification = isPopupOrNotification() === 'notification' var isNotification = isPopupOrNotification() === 'notification'
@ -73,20 +74,20 @@ ConfirmTxScreen.prototype.render = function () {
}, [ }, [
h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', { h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
style: { style: {
display: state.index === 0 ? 'none' : 'inline-block', display: props.index === 0 ? 'none' : 'inline-block',
}, },
onClick: () => state.dispatch(actions.previousTx()), onClick: () => props.dispatch(actions.previousTx()),
}), }),
` ${state.index + 1} of ${unconfTxList.length} `, ` ${props.index + 1} of ${unconfTxList.length} `,
h('i.fa.fa-arrow-right.fa-lg.cursor-pointer', { h('i.fa.fa-arrow-right.fa-lg.cursor-pointer', {
style: { style: {
display: state.index + 1 === unconfTxList.length ? 'none' : 'inline-block', display: props.index + 1 === unconfTxList.length ? 'none' : 'inline-block',
}, },
onClick: () => state.dispatch(actions.nextTx()), onClick: () => props.dispatch(actions.nextTx()),
}), }),
]), ]),
warningIfExists(state.warning), warningIfExists(props.warning),
h(ReactCSSTransitionGroup, { h(ReactCSSTransitionGroup, {
className: 'css-transition-group', className: 'css-transition-group',
@ -99,12 +100,12 @@ ConfirmTxScreen.prototype.render = function () {
// Properties // Properties
txData: txData, txData: txData,
key: txData.id, key: txData.id,
selectedAddress: state.selectedAddress, selectedAddress: props.selectedAddress,
accounts: state.accounts, accounts: props.accounts,
identities: state.identities, identities: props.identities,
insufficientBalance: this.checkBalanceAgainstTx(txData), insufficientBalance: this.checkBalanceAgainstTx(txData),
// Actions // Actions
buyEth: this.buyEth.bind(this, txParams.from || state.selectedAddress), buyEth: this.buyEth.bind(this, txParams.from || props.selectedAddress),
sendTransaction: this.sendTransaction.bind(this, txData), sendTransaction: this.sendTransaction.bind(this, txData),
cancelTransaction: this.cancelTransaction.bind(this, txData), cancelTransaction: this.cancelTransaction.bind(this, txData),
signMessage: this.signMessage.bind(this, txData), signMessage: this.signMessage.bind(this, txData),
@ -128,11 +129,12 @@ function currentTxView (opts) {
return h(PendingMsg, opts) return h(PendingMsg, opts)
} }
} }
ConfirmTxScreen.prototype.checkBalanceAgainstTx = function (txData) { ConfirmTxScreen.prototype.checkBalanceAgainstTx = function (txData) {
if (!txData.txParams) return false if (!txData.txParams) return false
var state = this.props var props = this.props
var address = txData.txParams.from || state.selectedAddress var address = txData.txParams.from || props.selectedAddress
var account = state.accounts[address] var account = props.accounts[address]
var balance = account ? account.balance : '0x0' var balance = account ? account.balance : '0x0'
var maxCost = new BN(txData.maxCost, 16) var maxCost = new BN(txData.maxCost, 16)