aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app')
-rw-r--r--ui/app/account-detail.js3
-rw-r--r--ui/app/actions.js3
-rw-r--r--ui/app/components/buy-button-subview.js11
-rw-r--r--ui/app/components/pending-tx-details.js4
-rw-r--r--ui/app/components/pending-tx.js23
-rw-r--r--ui/app/conf-tx.js27
-rw-r--r--ui/app/css/index.css26
-rw-r--r--ui/app/reducers/app.js4
8 files changed, 84 insertions, 17 deletions
diff --git a/ui/app/account-detail.js b/ui/app/account-detail.js
index 41d1ff2da..01c7e8781 100644
--- a/ui/app/account-detail.js
+++ b/ui/app/account-detail.js
@@ -279,10 +279,11 @@ AccountDetailScreen.prototype.requestAccountExport = function () {
AccountDetailScreen.prototype.buyButtonDeligator = function () {
var props = this.props
+ var selected = props.address || Object.keys(props.accounts)[0]
if (this.props.accountDetail.subview === 'buyForm') {
props.dispatch(actions.backToAccountDetail(props.address))
} else {
- props.dispatch(actions.buyEthView())
+ props.dispatch(actions.buyEthView(selected))
}
}
diff --git a/ui/app/actions.js b/ui/app/actions.js
index 289366db0..0cce9065e 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -479,9 +479,10 @@ function showAccountsPage () {
}
}
-function showConfTxPage () {
+function showConfTxPage (transForward = true) {
return {
type: actions.SHOW_CONF_TX_PAGE,
+ transForward: transForward,
}
}
diff --git a/ui/app/components/buy-button-subview.js b/ui/app/components/buy-button-subview.js
index c3e9e5d7b..7daf41206 100644
--- a/ui/app/components/buy-button-subview.js
+++ b/ui/app/components/buy-button-subview.js
@@ -16,6 +16,7 @@ function mapStateToProps (state) {
buyView: state.appState.buyView,
network: state.metamask.network,
provider: state.metamask.provider,
+ context: state.appState.currentView.context,
}
}
@@ -38,7 +39,7 @@ BuyButtonSubview.prototype.render = function () {
},
}, [
h('i.fa.fa-arrow-left.fa-lg.cursor-pointer.color-orange', {
- onClick: () => props.dispatch(actions.backToAccountDetail(props.selectedAccount)),
+ onClick: this.backButtonContext.bind(this),
style: {
position: 'absolute',
left: '10px',
@@ -121,3 +122,11 @@ BuyButtonSubview.prototype.formVersionSubview = function () {
BuyButtonSubview.prototype.navigateTo = function (url) {
extension.tabs.create({ url })
}
+
+BuyButtonSubview.prototype.backButtonContext = function () {
+ if (this.props.context === 'confTx') {
+ this.props.dispatch(actions.showConfTxPage(false))
+ } else {
+ this.props.dispatch(actions.goHome())
+ }
+}
diff --git a/ui/app/components/pending-tx-details.js b/ui/app/components/pending-tx-details.js
index 148b5c6df..d8e8524bf 100644
--- a/ui/app/components/pending-tx-details.js
+++ b/ui/app/components/pending-tx-details.js
@@ -4,12 +4,12 @@ const inherits = require('util').inherits
const MiniAccountPanel = require('./mini-account-panel')
const EthBalance = require('./eth-balance')
-const addressSummary = require('../util').addressSummary
+const util = require('../util')
+const addressSummary = util.addressSummary
const nameForAddress = require('../../lib/contract-namer')
const ethUtil = require('ethereumjs-util')
const BN = ethUtil.BN
-
module.exports = PendingTxDetails
inherits(PendingTxDetails, Component)
diff --git a/ui/app/components/pending-tx.js b/ui/app/components/pending-tx.js
index 1feedbbbc..4c27a8092 100644
--- a/ui/app/components/pending-tx.js
+++ b/ui/app/components/pending-tx.js
@@ -3,7 +3,6 @@ const h = require('react-hyperscript')
const inherits = require('util').inherits
const PendingTxDetails = require('./pending-tx-details')
-
module.exports = PendingTx
inherits(PendingTx, Component)
@@ -31,6 +30,15 @@ PendingTx.prototype.render = function () {
}
`),
+ state.insufficientBalance ?
+ h('span.error', {
+ style: {
+ marginLeft: 50,
+ fontSize: '0.9em',
+ },
+ }, 'Insufficient balance for transaction')
+ : null,
+
// send + cancel
h('.flex-row.flex-space-around.conf-buttons', {
style: {
@@ -39,17 +47,22 @@ PendingTx.prototype.render = function () {
margin: '14px 25px',
},
}, [
+
+ state.insufficientBalance ?
+ h('button.btn-green', {
+ onClick: state.buyEth,
+ }, 'Buy Ether')
+ : null,
+
h('button.confirm', {
+ disabled: state.insufficientBalance,
onClick: state.sendTransaction,
- style: { background: 'rgb(251,117,1)' },
}, 'Accept'),
- h('button.cancel', {
+ h('button.cancel.btn-red', {
onClick: state.cancelTransaction,
- style: { background: 'rgb(254,35,17)' },
}, 'Reject'),
]),
])
)
}
-
diff --git a/ui/app/conf-tx.js b/ui/app/conf-tx.js
index f02b6be78..f4ca52860 100644
--- a/ui/app/conf-tx.js
+++ b/ui/app/conf-tx.js
@@ -6,6 +6,8 @@ const connect = require('react-redux').connect
const actions = require('./actions')
const txHelper = require('../lib/tx-helper')
const isPopupOrNotification = require('../../app/scripts/lib/is-popup-or-notification')
+const ethUtil = require('ethereumjs-util')
+const BN = ethUtil.BN
const PendingTx = require('./components/pending-tx')
const PendingMsg = require('./components/pending-msg')
@@ -39,6 +41,7 @@ ConfirmTxScreen.prototype.render = function () {
var unconfTxList = txHelper(unconfTxs, unconfMsgs, network)
var index = state.index !== undefined ? state.index : 0
var txData = unconfTxList[index] || unconfTxList[0] || {}
+ var txParams = txData.txParams || {}
var isNotification = isPopupOrNotification() === 'notification'
return (
@@ -90,7 +93,9 @@ ConfirmTxScreen.prototype.render = function () {
selectedAddress: state.selectedAddress,
accounts: state.accounts,
identities: state.identities,
+ insufficientBalance: this.checkBalnceAgainstTx(txData),
// Actions
+ buyEth: this.buyEth.bind(this, txParams.from || state.selectedAddress),
sendTransaction: this.sendTransaction.bind(this, txData),
cancelTransaction: this.cancelTransaction.bind(this, txData),
signMessage: this.signMessage.bind(this, txData),
@@ -111,6 +116,28 @@ function currentTxView (opts) {
return h(PendingMsg, opts)
}
}
+ConfirmTxScreen.prototype.checkBalnceAgainstTx = function (txData) {
+ var state = this.props
+
+ var txParams = txData.txParams || {}
+ var address = txParams.from || state.selectedAddress
+ var account = state.accounts[address]
+ var balance = account ? account.balance : '0x0'
+
+ var gasCost = new BN(ethUtil.stripHexPrefix(txParams.gas || txData.estimatedGas), 16)
+ var gasPrice = new BN(ethUtil.stripHexPrefix(txParams.gasPrice || '0x4a817c800'), 16)
+ var txFee = gasCost.mul(gasPrice)
+ var txValue = new BN(ethUtil.stripHexPrefix(txParams.value || '0x0'), 16)
+ var maxCost = txValue.add(txFee)
+
+ var balanceBn = new BN(ethUtil.stripHexPrefix(balance), 16)
+ return maxCost.gt(balanceBn)
+}
+
+ConfirmTxScreen.prototype.buyEth = function (address, event) {
+ event.stopPropagation()
+ this.props.dispatch(actions.buyEthView(address))
+}
ConfirmTxScreen.prototype.sendTransaction = function (txData, event) {
event.stopPropagation()
diff --git a/ui/app/css/index.css b/ui/app/css/index.css
index ba90aa551..8543960fe 100644
--- a/ui/app/css/index.css
+++ b/ui/app/css/index.css
@@ -36,24 +36,40 @@ button {
font-family: 'Montserrat Bold';
outline: none;
cursor: pointer;
- box-shadow: 0px 3px 6px rgba(247, 134, 28, 0.36);
- /*margin: 10px;*/
padding: 8px 12px;
border: none;
- background: #F7861C;
color: white;
transform-origin: center center;
transition: transform 50ms ease-in;
+ /* default orange */
+ background: rgba(247, 134, 28, 1);
+ box-shadow: 0px 3px 6px rgba(247, 134, 28, 0.36);
+}
+
+button.btn-green {
+ background: rgba(106, 195, 96, 1);
+ box-shadow: 0px 3px 6px rgba(106, 195, 96, 0.36);
+}
+
+button.btn-red {
+ background: rgba(254, 35, 17, 1);
+ box-shadow: 0px 3px 6px rgba(254, 35, 17, 0.36);
+}
+
+button[disabled] {
+ cursor: not-allowed;
+ background: rgba(197, 197, 197, 1);
+ box-shadow: 0px 3px 6px rgba(197, 197, 197, 0.36);
}
button.spaced {
margin: 2px;
}
-button:hover {
+button:not([disabled]):hover {
transform: scale(1.1);
}
-button:active {
+button:not([disabled]):active {
transform: scale(0.95);
}
diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js
index 8eb6ec4d4..c2ac099a6 100644
--- a/ui/app/reducers/app.js
+++ b/ui/app/reducers/app.js
@@ -240,7 +240,7 @@ function reduceApp (state, action) {
name: 'confTx',
context: 0,
},
- transForward: true,
+ transForward: action.transForward,
warning: null,
})
@@ -408,7 +408,7 @@ function reduceApp (state, action) {
transForward: true,
currentView: {
name: 'buyEth',
- context: appState.currentView.context,
+ context: appState.currentView.name,
},
buyView: {
subview: 'buyForm',
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-16 13:27:24 +0800