From 564f920ae0a1be1aa08905f1b4cf6d081e9a5a0b Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Wed, 22 Feb 2017 16:23:13 -0800 Subject: Add personal sign actions and template --- ui/app/actions.js | 22 ++++++++++++ ui/app/components/pending-personal-msg.js | 56 +++++++++++++++++++++++++++++++ ui/app/conf-tx.js | 41 +++++++++++----------- ui/lib/tx-helper.js | 13 ++++--- 4 files changed, 106 insertions(+), 26 deletions(-) create mode 100644 ui/app/components/pending-personal-msg.js (limited to 'ui') diff --git a/ui/app/actions.js b/ui/app/actions.js index 6552e7f5c..6060d4299 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -90,6 +90,8 @@ var actions = { PREVIOUS_TX: 'PREV_TX', signMsg: signMsg, cancelMsg: cancelMsg, + signPersonalMsg, + cancelPersonalMsg, sendTx: sendTx, signTx: signTx, cancelTx: cancelTx, @@ -359,6 +361,20 @@ function signMsg (msgData) { } } +function signPersonalMsg (msgData) { + return (dispatch) => { + dispatch(actions.showLoadingIndication()) + + if (global.METAMASK_DEBUG) console.log(`background.signMessage`) + background.signPersonalMessage(msgData, (err) => { + dispatch(actions.hideLoadingIndication()) + + if (err) return dispatch(actions.displayWarning(err.message)) + dispatch(actions.completedTx(msgData.metamaskId)) + }) + } +} + function signTx (txData) { return (dispatch) => { if (global.METAMASK_DEBUG) console.log(`background.setGasMultiplier`) @@ -408,6 +424,12 @@ function cancelMsg (msgData) { return actions.completedTx(msgData.id) } +function cancelPersonalMsg (msgData) { + if (global.METAMASK_DEBUG) console.log(`background.cancelMessage`) + background.cancelPersonalMessage(msgData.id) + return actions.completedTx(msgData.id) +} + function cancelTx (txData) { if (global.METAMASK_DEBUG) console.log(`background.cancelTransaction`) background.cancelTransaction(txData.id) diff --git a/ui/app/components/pending-personal-msg.js b/ui/app/components/pending-personal-msg.js new file mode 100644 index 000000000..b2cac164a --- /dev/null +++ b/ui/app/components/pending-personal-msg.js @@ -0,0 +1,56 @@ +const Component = require('react').Component +const h = require('react-hyperscript') +const inherits = require('util').inherits +const PendingTxDetails = require('./pending-msg-details') + +module.exports = PendingMsg + +inherits(PendingMsg, Component) +function PendingMsg () { + Component.call(this) +} + +PendingMsg.prototype.render = function () { + var state = this.props + var msgData = state.txData + + return ( + + h('div', { + key: msgData.id, + }, [ + + // header + h('h3', { + style: { + fontWeight: 'bold', + textAlign: 'center', + }, + }, 'Sign Message'), + + h('.error', { + style: { + margin: '10px', + }, + }, `Signing this message can have + dangerous side effects. Only sign messages from + sites you fully trust with your entire account. + This will be fixed in a future version.`), + + // message details + h(PendingTxDetails, state), + + // sign + cancel + h('.flex-row.flex-space-around', [ + h('button', { + onClick: state.cancelMessage, + }, 'Cancel'), + h('button', { + onClick: state.signMessage, + }, 'Sign'), + ]), + ]) + + ) +} + diff --git a/ui/app/conf-tx.js b/ui/app/conf-tx.js index 646dbb602..672ea54ae 100644 --- a/ui/app/conf-tx.js +++ b/ui/app/conf-tx.js @@ -12,6 +12,7 @@ const BN = ethUtil.BN const PendingTx = require('./components/pending-tx') const PendingMsg = require('./components/pending-msg') +const PendingPersonalMsg = require('./components/pending-personal-msg') module.exports = connect(mapStateToProps)(ConfirmTxScreen) @@ -22,6 +23,7 @@ function mapStateToProps (state) { selectedAddress: state.metamask.selectedAddress, unapprovedTxs: state.metamask.unapprovedTxs, unapprovedMsgs: state.metamask.unapprovedMsgs, + unapprovedPersonalMsgs: state.metamask.unapprovedPersonalMsgs, index: state.appState.currentView.context, warning: state.appState.warning, network: state.metamask.network, @@ -35,15 +37,12 @@ function ConfirmTxScreen () { } ConfirmTxScreen.prototype.render = function () { - var state = this.props + const props = this.props + const { network, provider, unapprovedTxs, + unapprovedMsgs, unapprovedPersonalMsgs } = props - var network = state.network - var provider = state.provider - var unapprovedTxs = state.unapprovedTxs - var unapprovedMsgs = state.unapprovedMsgs - - var unconfTxList = txHelper(unapprovedTxs, unapprovedMsgs, network) - var index = state.index !== undefined && unconfTxList[index] ? state.index : 0 + var unconfTxList = txHelper(unapprovedTxs, unapprovedMsgs, unapprovedPersonalMsgs, network) + var index = props.index !== undefined && unconfTxList[index] ? props.index : 0 var txData = unconfTxList[index] || {} var txParams = txData.params || {} var isNotification = isPopupOrNotification() === 'notification' @@ -75,20 +74,20 @@ ConfirmTxScreen.prototype.render = function () { }, [ h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', { 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', { 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, { className: 'css-transition-group', @@ -101,12 +100,12 @@ ConfirmTxScreen.prototype.render = function () { // Properties txData: txData, key: txData.id, - selectedAddress: state.selectedAddress, - accounts: state.accounts, - identities: state.identities, + selectedAddress: props.selectedAddress, + accounts: props.accounts, + identities: props.identities, insufficientBalance: this.checkBalanceAgainstTx(txData), // 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), cancelTransaction: this.cancelTransaction.bind(this, txData), signMessage: this.signMessage.bind(this, txData), @@ -135,9 +134,9 @@ function currentTxView (opts) { } ConfirmTxScreen.prototype.checkBalanceAgainstTx = function (txData) { if (!txData.txParams) return false - var state = this.props - var address = txData.txParams.from || state.selectedAddress - var account = state.accounts[address] + var props = this.props + var address = txData.txParams.from || props.selectedAddress + var account = props.accounts[address] var balance = account ? account.balance : '0x0' var maxCost = new BN(txData.maxCost, 16) diff --git a/ui/lib/tx-helper.js b/ui/lib/tx-helper.js index 7f64f9fbe..c8dc46c9d 100644 --- a/ui/lib/tx-helper.js +++ b/ui/lib/tx-helper.js @@ -1,13 +1,16 @@ const valuesFor = require('../app/util').valuesFor -module.exports = function (unapprovedTxs, unapprovedMsgs, network) { +module.exports = function (unapprovedTxs, unapprovedMsgs, personalMsgs, network) { log.debug('tx-helper called with params:') - log.debug({ unapprovedTxs, unapprovedMsgs, network }) + log.debug({ unapprovedTxs, unapprovedMsgs, personalMsgs, network }) - var txValues = network ? valuesFor(unapprovedTxs).filter(tx => tx.txParams.metamaskNetworkId === network) : valuesFor(unapprovedTxs) + const txValues = network ? valuesFor(unapprovedTxs).filter(tx => tx.txParams.metamaskNetworkId === network) : valuesFor(unapprovedTxs) log.debug(`tx helper found ${txValues.length} unapproved txs`) - var msgValues = valuesFor(unapprovedMsgs) + const msgValues = valuesFor(unapprovedMsgs) log.debug(`tx helper found ${msgValues.length} unsigned messages`) - var allValues = txValues.concat(msgValues) + let allValues = txValues.concat(msgValues) + const personalValues = valuesFor(personalMsgs) + allValues = allValues.concat(personalValues) + return allValues.sort(tx => tx.time) } -- cgit v1.2.3 From 7ec25526b70473247a69ab4a3a1302e50b06f12b Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 23 Feb 2017 11:18:49 -0800 Subject: Add alternate UI for pending personal_sign messages --- ui/app/components/pending-personal-msg.js | 9 --------- ui/app/conf-tx.js | 17 ++++++++++++----- 2 files changed, 12 insertions(+), 14 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-personal-msg.js b/ui/app/components/pending-personal-msg.js index b2cac164a..f4bde91dc 100644 --- a/ui/app/components/pending-personal-msg.js +++ b/ui/app/components/pending-personal-msg.js @@ -28,15 +28,6 @@ PendingMsg.prototype.render = function () { }, }, 'Sign Message'), - h('.error', { - style: { - margin: '10px', - }, - }, `Signing this message can have - dangerous side effects. Only sign messages from - sites you fully trust with your entire account. - This will be fixed in a future version.`), - // message details h(PendingTxDetails, state), diff --git a/ui/app/conf-tx.js b/ui/app/conf-tx.js index 672ea54ae..571ae85b6 100644 --- a/ui/app/conf-tx.js +++ b/ui/app/conf-tx.js @@ -118,18 +118,25 @@ ConfirmTxScreen.prototype.render = function () { } function currentTxView (opts) { + log.info('rendering current tx view') const { txData } = opts - const { txParams, msgParams } = txData + const { txParams, msgParams, type } = txData - log.info('rendering current tx view') if (txParams) { - // This is a pending transaction log.debug('txParams detected, rendering pending tx') return h(PendingTx, opts) + } else if (msgParams) { - // This is a pending message to sign log.debug('msgParams detected, rendering pending msg') - return h(PendingMsg, opts) + + 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) + } } } ConfirmTxScreen.prototype.checkBalanceAgainstTx = function (txData) { -- cgit v1.2.3 From 4697aca02c669b1787e72f0648b3043270867799 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 23 Feb 2017 14:23:45 -0800 Subject: Got personal_sign working Also fixed bug where signing would not close popup. --- ui/app/actions.js | 77 +++++++++++++---------- ui/app/app.js | 2 + ui/app/components/pending-personal-msg-details.js | 50 +++++++++++++++ ui/app/components/pending-personal-msg.js | 4 +- ui/app/conf-tx.js | 14 ++++- ui/app/reducers/app.js | 30 +++++---- ui/index.js | 3 +- ui/lib/tx-helper.js | 1 + 8 files changed, 133 insertions(+), 48 deletions(-) create mode 100644 ui/app/components/pending-personal-msg-details.js (limited to 'ui') diff --git a/ui/app/actions.js b/ui/app/actions.js index 6060d4299..12ee0367a 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -180,7 +180,7 @@ function tryUnlockMetamask (password) { return (dispatch) => { dispatch(actions.showLoadingIndication()) dispatch(actions.unlockInProgress()) - if (global.METAMASK_DEBUG) console.log(`background.submitPassword`) + log.debug(`background.submitPassword`) background.submitPassword(password, (err) => { dispatch(actions.hideLoadingIndication()) if (err) { @@ -208,7 +208,7 @@ function transitionBackward () { function confirmSeedWords () { return (dispatch) => { dispatch(actions.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.clearSeedWordCache`) + log.debug(`background.clearSeedWordCache`) background.clearSeedWordCache((err, account) => { dispatch(actions.hideLoadingIndication()) if (err) { @@ -224,7 +224,7 @@ function confirmSeedWords () { function createNewVaultAndRestore (password, seed) { return (dispatch) => { dispatch(actions.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.createNewVaultAndRestore`) + log.debug(`background.createNewVaultAndRestore`) background.createNewVaultAndRestore(password, seed, (err) => { dispatch(actions.hideLoadingIndication()) if (err) return dispatch(actions.displayWarning(err.message)) @@ -236,12 +236,12 @@ function createNewVaultAndRestore (password, seed) { function createNewVaultAndKeychain (password) { return (dispatch) => { dispatch(actions.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.createNewVaultAndKeychain`) + log.debug(`background.createNewVaultAndKeychain`) background.createNewVaultAndKeychain(password, (err) => { if (err) { return dispatch(actions.displayWarning(err.message)) } - if (global.METAMASK_DEBUG) console.log(`background.placeSeedWords`) + log.debug(`background.placeSeedWords`) background.placeSeedWords((err) => { if (err) { return dispatch(actions.displayWarning(err.message)) @@ -262,10 +262,10 @@ function revealSeedConfirmation () { function requestRevealSeed (password) { return (dispatch) => { dispatch(actions.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.submitPassword`) + log.debug(`background.submitPassword`) background.submitPassword(password, (err) => { if (err) return dispatch(actions.displayWarning(err.message)) - if (global.METAMASK_DEBUG) console.log(`background.placeSeedWords`) + log.debug(`background.placeSeedWords`) background.placeSeedWords((err) => { if (err) return dispatch(actions.displayWarning(err.message)) dispatch(actions.hideLoadingIndication()) @@ -277,7 +277,7 @@ function requestRevealSeed (password) { function addNewKeyring (type, opts) { return (dispatch) => { dispatch(actions.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.addNewKeyring`) + log.debug(`background.addNewKeyring`) background.addNewKeyring(type, opts, (err) => { dispatch(actions.hideLoadingIndication()) if (err) return dispatch(actions.displayWarning(err.message)) @@ -289,11 +289,11 @@ function addNewKeyring (type, opts) { function importNewAccount (strategy, args) { return (dispatch) => { dispatch(actions.showLoadingIndication('This may take a while, be patient.')) - if (global.METAMASK_DEBUG) console.log(`background.importAccountWithStrategy`) + log.debug(`background.importAccountWithStrategy`) background.importAccountWithStrategy(strategy, args, (err) => { dispatch(actions.hideLoadingIndication()) if (err) return dispatch(actions.displayWarning(err.message)) - if (global.METAMASK_DEBUG) console.log(`background.getState`) + log.debug(`background.getState`) background.getState((err, newState) => { if (err) { return dispatch(actions.displayWarning(err.message)) @@ -315,7 +315,7 @@ function navigateToNewAccountScreen() { } function addNewAccount () { - if (global.METAMASK_DEBUG) console.log(`background.addNewAccount`) + log.debug(`background.addNewAccount`) return callBackgroundThenUpdate(background.addNewAccount) } @@ -328,7 +328,7 @@ function showInfoPage () { function setCurrentFiat (currencyCode) { return (dispatch) => { dispatch(this.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.setCurrentFiat`) + log.debug(`background.setCurrentFiat`) background.setCurrentCurrency(currencyCode, (err, data) => { dispatch(this.hideLoadingIndication()) if (err) { @@ -348,28 +348,38 @@ function setCurrentFiat (currencyCode) { } function signMsg (msgData) { + log.debug('action - signMsg') return (dispatch) => { dispatch(actions.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.signMessage`) - background.signMessage(msgData, (err) => { + log.debug(`actions calling background.signMessage`) + background.signMessage(msgData, (err, newState) => { + log.debug('signMessage called back') + dispatch(actions.updateMetamaskState(newState)) dispatch(actions.hideLoadingIndication()) + if (err) log.error(err) if (err) return dispatch(actions.displayWarning(err.message)) + dispatch(actions.completedTx(msgData.metamaskId)) }) } } function signPersonalMsg (msgData) { + log.debug('action - signPersonalMsg') return (dispatch) => { dispatch(actions.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.signMessage`) - background.signPersonalMessage(msgData, (err) => { + log.debug(`actions calling background.signPersonalMessage`) + background.signPersonalMessage(msgData, (err, newState) => { + log.debug('signPersonalMessage called back') + dispatch(actions.updateMetamaskState(newState)) dispatch(actions.hideLoadingIndication()) + if (err) log.error(err) if (err) return dispatch(actions.displayWarning(err.message)) + dispatch(actions.completedTx(msgData.metamaskId)) }) } @@ -377,7 +387,7 @@ function signPersonalMsg (msgData) { function signTx (txData) { return (dispatch) => { - if (global.METAMASK_DEBUG) console.log(`background.setGasMultiplier`) + log.debug(`background.setGasMultiplier`) background.setGasMultiplier(txData.gasMultiplier, (err) => { if (err) return dispatch(actions.displayWarning(err.message)) web3.eth.sendTransaction(txData, (err, data) => { @@ -392,8 +402,9 @@ function signTx (txData) { } function sendTx (txData) { + log.info('actions: sendTx') return (dispatch) => { - if (global.METAMASK_DEBUG) console.log(`background.approveTransaction`) + log.debug(`actions calling background.approveTransaction`) background.approveTransaction(txData.id, (err) => { if (err) { dispatch(actions.txError(err)) @@ -419,19 +430,19 @@ function txError (err) { } function cancelMsg (msgData) { - if (global.METAMASK_DEBUG) console.log(`background.cancelMessage`) + log.debug(`background.cancelMessage`) background.cancelMessage(msgData.id) return actions.completedTx(msgData.id) } function cancelPersonalMsg (msgData) { - if (global.METAMASK_DEBUG) console.log(`background.cancelMessage`) + log.debug(`background.cancelMessage`) background.cancelPersonalMessage(msgData.id) return actions.completedTx(msgData.id) } function cancelTx (txData) { - if (global.METAMASK_DEBUG) console.log(`background.cancelTransaction`) + log.debug(`background.cancelTransaction`) background.cancelTransaction(txData.id) return actions.completedTx(txData.id) } @@ -527,14 +538,14 @@ function updateMetamaskState (newState) { } function lockMetamask () { - if (global.METAMASK_DEBUG) console.log(`background.setLocked`) + log.debug(`background.setLocked`) return callBackgroundThenUpdate(background.setLocked) } function showAccountDetail (address) { return (dispatch) => { dispatch(actions.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.setSelectedAddress`) + log.debug(`background.setSelectedAddress`) background.setSelectedAddress(address, (err) => { dispatch(actions.hideLoadingIndication()) if (err) { @@ -607,7 +618,7 @@ function goBackToInitView () { function markNoticeRead (notice) { return (dispatch) => { dispatch(this.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.markNoticeRead`) + log.debug(`background.markNoticeRead`) background.markNoticeRead(notice, (err, notice) => { dispatch(this.hideLoadingIndication()) if (err) { @@ -639,7 +650,7 @@ function clearNotices () { } function markAccountsFound() { - if (global.METAMASK_DEBUG) console.log(`background.markAccountsFound`) + log.debug(`background.markAccountsFound`) return callBackgroundThenUpdate(background.markAccountsFound) } @@ -648,7 +659,7 @@ function markAccountsFound() { // function setRpcTarget (newRpc) { - if (global.METAMASK_DEBUG) console.log(`background.setRpcTarget`) + log.debug(`background.setRpcTarget`) background.setRpcTarget(newRpc) return { type: actions.SET_RPC_TARGET, @@ -657,7 +668,7 @@ function setRpcTarget (newRpc) { } function setProviderType (type) { - if (global.METAMASK_DEBUG) console.log(`background.setProviderType`) + log.debug(`background.setProviderType`) background.setProviderType(type) return { type: actions.SET_PROVIDER_TYPE, @@ -666,7 +677,7 @@ function setProviderType (type) { } function useEtherscanProvider () { - if (global.METAMASK_DEBUG) console.log(`background.useEtherscanProvider`) + log.debug(`background.useEtherscanProvider`) background.useEtherscanProvider() return { type: actions.USE_ETHERSCAN_PROVIDER, @@ -723,7 +734,7 @@ function exportAccount (address) { return function (dispatch) { dispatch(self.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.exportAccount`) + log.debug(`background.exportAccount`) background.exportAccount(address, function (err, result) { dispatch(self.hideLoadingIndication()) @@ -747,7 +758,7 @@ function showPrivateKey (key) { function saveAccountLabel (account, label) { return (dispatch) => { dispatch(actions.showLoadingIndication()) - if (global.METAMASK_DEBUG) console.log(`background.saveAccountLabel`) + log.debug(`background.saveAccountLabel`) background.saveAccountLabel(account, label, (err) => { dispatch(actions.hideLoadingIndication()) if (err) { @@ -769,7 +780,7 @@ function showSendPage () { function buyEth (address, amount) { return (dispatch) => { - if (global.METAMASK_DEBUG) console.log(`background.buyEth`) + log.debug(`background.buyEth`) background.buyEth(address, amount) dispatch({ type: actions.BUY_ETH, @@ -849,7 +860,7 @@ function coinShiftRquest (data, marketData) { if (response.error) return dispatch(actions.displayWarning(response.error)) var message = ` Deposit your ${response.depositType} to the address bellow:` - if (global.METAMASK_DEBUG) console.log(`background.createShapeShiftTx`) + log.debug(`background.createShapeShiftTx`) background.createShapeShiftTx(response.deposit, response.depositType) dispatch(actions.showQrView(response.deposit, [message].concat(marketData))) }) @@ -929,7 +940,7 @@ function callBackgroundThenUpdate (method, ...args) { } function forceUpdateMetamaskState(dispatch){ - if (global.METAMASK_DEBUG) console.log(`background.getState`) + log.debug(`background.getState`) background.getState((err, newState) => { if (err) { return dispatch(actions.displayWarning(err.message)) diff --git a/ui/app/app.js b/ui/app/app.js index 6e249b09e..63fab5db8 100644 --- a/ui/app/app.js +++ b/ui/app/app.js @@ -64,6 +64,7 @@ function mapStateToProps (state) { App.prototype.render = function () { var props = this.props const { isLoading, loadingMessage, transForward } = props + log.debug('Main ui render function') return ( @@ -347,6 +348,7 @@ App.prototype.renderBackButton = function (style, justArrow = false) { } App.prototype.renderPrimary = function () { + log.debug('rendering primary') var props = this.props // notices diff --git a/ui/app/components/pending-personal-msg-details.js b/ui/app/components/pending-personal-msg-details.js new file mode 100644 index 000000000..16308d121 --- /dev/null +++ b/ui/app/components/pending-personal-msg-details.js @@ -0,0 +1,50 @@ +const Component = require('react').Component +const h = require('react-hyperscript') +const inherits = require('util').inherits + +const AccountPanel = require('./account-panel') + +module.exports = PendingMsgDetails + +inherits(PendingMsgDetails, Component) +function PendingMsgDetails () { + Component.call(this) +} + +PendingMsgDetails.prototype.render = function () { + var state = this.props + var msgData = state.txData + + var msgParams = msgData.msgParams || {} + var address = msgParams.from || state.selectedAddress + var identity = state.identities[address] || { address: address } + var account = state.accounts[address] || { address: address } + + return ( + h('div', { + key: msgData.id, + style: { + margin: '10px 20px', + }, + }, [ + + // account that will sign + h(AccountPanel, { + showFullAddress: true, + identity: identity, + account: account, + imageifyIdenticons: state.imageifyIdenticons, + }), + + // message data + h('.tx-data.flex-column.flex-justify-center.flex-grow.select-none', [ + h('.flex-row.flex-space-between', [ + h('label.font-small', 'MESSAGE'), + h('span.font-small', msgParams.data), + ]), + ]), + + ]) + ) +} + diff --git a/ui/app/components/pending-personal-msg.js b/ui/app/components/pending-personal-msg.js index f4bde91dc..d48dd5ecc 100644 --- a/ui/app/components/pending-personal-msg.js +++ b/ui/app/components/pending-personal-msg.js @@ -1,7 +1,7 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const PendingTxDetails = require('./pending-msg-details') +const PendingTxDetails = require('./pending-personal-msg-details') module.exports = PendingMsg @@ -37,7 +37,7 @@ PendingMsg.prototype.render = function () { onClick: state.cancelMessage, }, 'Cancel'), h('button', { - onClick: state.signMessage, + onClick: state.signPersonalMessage, }, 'Sign'), ]), ]) diff --git a/ui/app/conf-tx.js b/ui/app/conf-tx.js index 571ae85b6..a2e5ee94c 100644 --- a/ui/app/conf-tx.js +++ b/ui/app/conf-tx.js @@ -109,6 +109,7 @@ ConfirmTxScreen.prototype.render = function () { sendTransaction: this.sendTransaction.bind(this, txData), cancelTransaction: this.cancelTransaction.bind(this, txData), signMessage: this.signMessage.bind(this, txData), + signPersonalMessage: this.signPersonalMessage.bind(this, txData), cancelMessage: this.cancelMessage.bind(this, txData), }), @@ -167,13 +168,24 @@ ConfirmTxScreen.prototype.cancelTransaction = function (txData, event) { } ConfirmTxScreen.prototype.signMessage = function (msgData, event) { + log.info('conf-tx.js: signing message') var params = msgData.msgParams + var type = msgData.type params.metamaskId = msgData.id event.stopPropagation() this.props.dispatch(actions.signMsg(params)) } +ConfirmTxScreen.prototype.signPersonalMessage = function (msgData, event) { + log.info('conf-tx.js: signing personal message') + var params = msgData.msgParams + params.metamaskId = msgData.id + event.stopPropagation() + this.props.dispatch(actions.signPersonalMsg(params)) +} + ConfirmTxScreen.prototype.cancelMessage = function (msgData, event) { + log.info('canceling message') event.stopPropagation() this.props.dispatch(actions.cancelMsg(msgData)) } @@ -185,7 +197,7 @@ ConfirmTxScreen.prototype.goHome = function (event) { function warningIfExists (warning) { if (warning && - // Do not display user rejections on this screen: + // Do not display user rejections on this screen: warning.indexOf('User denied transaction signature') === -1) { return h('.error', { style: { diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js index de6536c2e..6d92764f1 100644 --- a/ui/app/reducers/app.js +++ b/ui/app/reducers/app.js @@ -6,6 +6,7 @@ const notification = require('../../../app/scripts/lib/notifications') module.exports = reduceApp function reduceApp (state, action) { + log.debug('App Reducer got ' + action.type) // clone and defaults const selectedAddress = state.metamask.selectedAddress const pendingTxs = hasPendingTxs(state) @@ -289,32 +290,36 @@ function reduceApp (state, action) { case actions.SHOW_CONF_TX_PAGE: return extend(appState, { currentView: { - name: 'confTx', + name: pendingTxs ? 'confTx' : 'account-detail', context: 0, }, transForward: action.transForward, warning: null, + isLoading: false, }) case actions.SHOW_CONF_MSG_PAGE: return extend(appState, { currentView: { - name: 'confTx', + name: pendingTxs ? 'confTx' : 'account-detail', context: 0, }, transForward: true, warning: null, + isLoading: false, }) case actions.COMPLETED_TX: - var unapprovedTxs = state.metamask.unapprovedTxs - var unapprovedMsgs = state.metamask.unapprovedMsgs - var network = state.metamask.network + log.debug('reducing COMPLETED_TX') + var { unapprovedTxs, unapprovedMsgs, + unapprovedPersonalMsgs, network } = state.metamask - var unconfTxList = txHelper(unapprovedTxs, unapprovedMsgs, network) - .filter(tx => tx !== tx.id) + var unconfTxList = txHelper(unapprovedTxs, unapprovedMsgs, unapprovedPersonalMsgs, network) + .filter(tx => tx !== tx.id) + log.debug(`actions - COMPLETED_TX with ${unconfTxList.length} txs`) if (unconfTxList && unconfTxList.length > 0) { + log.debug('reducer detected txs - rendering confTx view') return extend(appState, { transForward: false, currentView: { @@ -324,6 +329,7 @@ function reduceApp (state, action) { warning: null, }) } else { + log.debug('attempting to close popup') notification.closePopup() return extend(appState, { @@ -572,10 +578,12 @@ function reduceApp (state, action) { } function hasPendingTxs (state) { - var unapprovedTxs = state.metamask.unapprovedTxs - var unapprovedMsgs = state.metamask.unapprovedMsgs - var network = state.metamask.network - var unconfTxList = txHelper(unapprovedTxs, unapprovedMsgs, network) + var { unapprovedTxs, unapprovedMsgs, + unapprovedPersonalMsgs, network } = state.metamask + + var unconfTxList = txHelper(unapprovedTxs, unapprovedMsgs, unapprovedPersonalMsgs, network) + var has = unconfTxList.length > 0 + log.debug('checking if state has pending txs, concluded ' + has) return unconfTxList.length > 0 } diff --git a/ui/index.js b/ui/index.js index 844e6c417..6b65f12d4 100644 --- a/ui/index.js +++ b/ui/index.js @@ -6,9 +6,10 @@ const configureStore = require('./app/store') const txHelper = require('./lib/tx-helper') module.exports = launchApp +let debugMode = window.METAMASK_DEBUG const log = require('loglevel') window.log = log -log.setLevel('warn') +log.setLevel(debugMode ? 'debug' : 'warn') function launchApp (opts) { var accountManager = opts.accountManager diff --git a/ui/lib/tx-helper.js b/ui/lib/tx-helper.js index c8dc46c9d..2eefdff68 100644 --- a/ui/lib/tx-helper.js +++ b/ui/lib/tx-helper.js @@ -10,6 +10,7 @@ module.exports = function (unapprovedTxs, unapprovedMsgs, personalMsgs, network) log.debug(`tx helper found ${msgValues.length} unsigned messages`) let allValues = txValues.concat(msgValues) const personalValues = valuesFor(personalMsgs) + log.debug(`tx helper found ${personalValues.length} unsigned personal messages`) allValues = allValues.concat(personalValues) return allValues.sort(tx => tx.time) -- cgit v1.2.3 From 1d1d296a1eec2fc66927dd80bf0f1bbd1a6841cf Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 23 Feb 2017 14:40:18 -0800 Subject: Make personal sign view look nice --- ui/app/components/pending-personal-msg-details.js | 21 ++++++++++++++++----- 1 file changed, 16 insertions(+), 5 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-personal-msg-details.js b/ui/app/components/pending-personal-msg-details.js index 16308d121..ffd11ca0b 100644 --- a/ui/app/components/pending-personal-msg-details.js +++ b/ui/app/components/pending-personal-msg-details.js @@ -20,6 +20,8 @@ PendingMsgDetails.prototype.render = function () { var identity = state.identities[address] || { address: address } var account = state.accounts[address] || { address: address } + var { data } = msgParams + return ( h('div', { key: msgData.id, @@ -37,11 +39,20 @@ PendingMsgDetails.prototype.render = function () { }), // message data - h('.tx-data.flex-column.flex-justify-center.flex-grow.select-none', [ - h('.flex-row.flex-space-between', [ - h('label.font-small', 'MESSAGE'), - h('span.font-small', msgParams.data), - ]), + h('div', [ + h('label.font-small', { style: { display: 'block' } }, 'MESSAGE'), + h('textarea.font-small', { + readOnly: true, + style: { + width: '315px', + maxHeight: '210px', + resize: 'none', + border: 'none', + background: 'white', + padding: '3px', + }, + defaultValue: data, + }), ]), ]) -- cgit v1.2.3 From 961a83769bd46334f5ecf72d00a32730d19866c3 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 23 Feb 2017 16:00:43 -0800 Subject: Fix cancel msg signing behavior. --- ui/app/actions.js | 8 ++++---- ui/app/components/pending-personal-msg.js | 2 +- ui/app/conf-tx.js | 8 +++++++- ui/app/reducers/app.js | 15 ++++++++------- 4 files changed, 20 insertions(+), 13 deletions(-) (limited to 'ui') diff --git a/ui/app/actions.js b/ui/app/actions.js index 12ee0367a..89a4fadfa 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -418,7 +418,7 @@ function sendTx (txData) { function completedTx (id) { return { type: actions.COMPLETED_TX, - id, + value: id, } } @@ -436,9 +436,9 @@ function cancelMsg (msgData) { } function cancelPersonalMsg (msgData) { - log.debug(`background.cancelMessage`) - background.cancelPersonalMessage(msgData.id) - return actions.completedTx(msgData.id) + const id = msgData.id + background.cancelPersonalMessage(id) + return actions.completedTx(id) } function cancelTx (txData) { diff --git a/ui/app/components/pending-personal-msg.js b/ui/app/components/pending-personal-msg.js index d48dd5ecc..4542adb28 100644 --- a/ui/app/components/pending-personal-msg.js +++ b/ui/app/components/pending-personal-msg.js @@ -34,7 +34,7 @@ PendingMsg.prototype.render = function () { // sign + cancel h('.flex-row.flex-space-around', [ h('button', { - onClick: state.cancelMessage, + onClick: state.cancelPersonalMessage, }, 'Cancel'), h('button', { onClick: state.signPersonalMessage, diff --git a/ui/app/conf-tx.js b/ui/app/conf-tx.js index a2e5ee94c..2df6c5384 100644 --- a/ui/app/conf-tx.js +++ b/ui/app/conf-tx.js @@ -111,6 +111,7 @@ ConfirmTxScreen.prototype.render = function () { signMessage: this.signMessage.bind(this, txData), signPersonalMessage: this.signPersonalMessage.bind(this, txData), cancelMessage: this.cancelMessage.bind(this, txData), + cancelPersonalMessage: this.cancelPersonalMessage.bind(this, txData), }), ]), @@ -170,7 +171,6 @@ ConfirmTxScreen.prototype.cancelTransaction = function (txData, event) { ConfirmTxScreen.prototype.signMessage = function (msgData, event) { log.info('conf-tx.js: signing message') var params = msgData.msgParams - var type = msgData.type params.metamaskId = msgData.id event.stopPropagation() this.props.dispatch(actions.signMsg(params)) @@ -190,6 +190,12 @@ ConfirmTxScreen.prototype.cancelMessage = function (msgData, event) { this.props.dispatch(actions.cancelMsg(msgData)) } +ConfirmTxScreen.prototype.cancelPersonalMessage = function (msgData, event) { + log.info('canceling personal message') + event.stopPropagation() + this.props.dispatch(actions.cancelPersonalMsg(msgData)) +} + ConfirmTxScreen.prototype.goHome = function (event) { event.stopPropagation() this.props.dispatch(actions.goHome()) diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js index 6d92764f1..136326301 100644 --- a/ui/app/reducers/app.js +++ b/ui/app/reducers/app.js @@ -9,12 +9,13 @@ function reduceApp (state, action) { log.debug('App Reducer got ' + action.type) // clone and defaults const selectedAddress = state.metamask.selectedAddress - const pendingTxs = hasPendingTxs(state) + let pendingTxs = hasPendingTxs(state) let name = 'accounts' if (selectedAddress) { name = 'accountDetail' } if (pendingTxs) { + log.debug('pending txs detected, defaulting to conf-tx view.') name = 'confTx' } @@ -310,15 +311,16 @@ function reduceApp (state, action) { }) case actions.COMPLETED_TX: - log.debug('reducing COMPLETED_TX') + log.debug('reducing COMPLETED_TX for tx ' + action.value) var { unapprovedTxs, unapprovedMsgs, unapprovedPersonalMsgs, network } = state.metamask var unconfTxList = txHelper(unapprovedTxs, unapprovedMsgs, unapprovedPersonalMsgs, network) - .filter(tx => tx !== tx.id) - log.debug(`actions - COMPLETED_TX with ${unconfTxList.length} txs`) + .filter(tx => tx.id !== action.value ) - if (unconfTxList && unconfTxList.length > 0) { + pendingTxs = unconfTxList.length > 0 + + if (pendingTxs) { log.debug('reducer detected txs - rendering confTx view') return extend(appState, { transForward: false, @@ -583,8 +585,7 @@ function hasPendingTxs (state) { var unconfTxList = txHelper(unapprovedTxs, unapprovedMsgs, unapprovedPersonalMsgs, network) var has = unconfTxList.length > 0 - log.debug('checking if state has pending txs, concluded ' + has) - return unconfTxList.length > 0 + return has } function indexForPending (state, txId) { -- cgit v1.2.3 From 42c2c3df3791e5c3f6cd744393c723c7e32e2403 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 23 Feb 2017 17:45:37 -0800 Subject: Improve pending tx blue dot style --- ui/app/components/transaction-list-item-icon.js | 6 +----- ui/app/css/index.css | 7 +++---- 2 files changed, 4 insertions(+), 9 deletions(-) (limited to 'ui') diff --git a/ui/app/components/transaction-list-item-icon.js b/ui/app/components/transaction-list-item-icon.js index 90b4ec094..ca2781451 100644 --- a/ui/app/components/transaction-list-item-icon.js +++ b/ui/app/components/transaction-list-item-icon.js @@ -15,11 +15,7 @@ TransactionIcon.prototype.render = function () { const { transaction, txParams, isMsg } = this.props switch (transaction.status) { case 'unapproved': - return h( !isMsg ? '.unapproved-tx-icon' : 'i.fa.fa-certificate.fa-lg', { - style: { - width: '24px', - }, - }) + return h( !isMsg ? '.unapproved-tx-icon' : 'i.fa.fa-certificate.fa-lg') case 'rejected': return h('i.fa.fa-exclamation-triangle.fa-lg.warning', { diff --git a/ui/app/css/index.css b/ui/app/css/index.css index 4b9b5b67d..8c6ff29d3 100644 --- a/ui/app/css/index.css +++ b/ui/app/css/index.css @@ -410,11 +410,10 @@ input.large-input { } .unapproved-tx-icon { - height: 24px; - background: #4dffff; - border: solid; + height: 16px; + width: 16px; + background: rgb(47, 174, 244); border-color: #AEAEAE; - border-width: 0.5px; border-radius: 13px; } -- cgit v1.2.3