mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 01:39:44 +01:00
Merge branch 'master' into tx-viz
This commit is contained in:
commit
dcda841f4d
@ -127,14 +127,14 @@
|
||||
"no-whitespace-before-property": 2,
|
||||
"no-with": 2,
|
||||
"one-var": [2, { "initialized": "never" }],
|
||||
"operator-linebreak": [2, "after", { "overrides": { "?": "before", ":": "before" } }],
|
||||
"operator-linebreak": [1, "after", { "overrides": { "?": "before", ":": "before" } }],
|
||||
"padded-blocks": [1, "never"],
|
||||
"quotes": [2, "single", "avoid-escape"],
|
||||
"semi": [2, "never"],
|
||||
"semi-spacing": [2, { "before": false, "after": true }],
|
||||
"space-before-blocks": [1, "always"],
|
||||
"space-before-function-paren": [1, "always"],
|
||||
"space-in-parens": [2, "never"],
|
||||
"space-in-parens": [1, "never"],
|
||||
"space-infix-ops": 2,
|
||||
"space-unary-ops": [2, { "words": true, "nonwords": false }],
|
||||
"spaced-comment": [2, "always", { "markers": ["global", "globals", "eslint", "eslint-disable", "*package", "!", ","] }],
|
||||
|
@ -1,6 +1,7 @@
|
||||
# Changelog
|
||||
|
||||
## Current Master
|
||||
- Show "Buy Ether" button and warning on tx confirmation when sender balance is insufficient
|
||||
|
||||
- Add a link to the transaction in history that goes to https://metamask.github.io/eth-tx-viz
|
||||
too help visualize transactions and to where they are going.
|
||||
|
@ -334,7 +334,7 @@ module.exports = class MetamaskController {
|
||||
var url = `https://buy.coinbase.com/?code=9ec56d01-7e81-5017-930c-513daa27bb6a&amount=${amount}&address=${address}&crypto_currency=ETH`
|
||||
|
||||
if (network === '2') {
|
||||
url = 'https://testfaucet.metamask.io/'
|
||||
url = 'https://faucet.metamask.io/'
|
||||
}
|
||||
|
||||
extension.tabs.create({
|
||||
|
@ -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))
|
||||
}
|
||||
}
|
||||
|
@ -479,9 +479,10 @@ function showAccountsPage () {
|
||||
}
|
||||
}
|
||||
|
||||
function showConfTxPage () {
|
||||
function showConfTxPage (transForward = true) {
|
||||
return {
|
||||
type: actions.SHOW_CONF_TX_PAGE,
|
||||
transForward: transForward,
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -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())
|
||||
}
|
||||
}
|
||||
|
@ -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)
|
||||
|
@ -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'),
|
||||
]),
|
||||
])
|
||||
)
|
||||
}
|
||||
|
||||
|
@ -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()
|
||||
|
@ -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);
|
||||
}
|
||||
|
||||
|
@ -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',
|
||||
|
Loading…
Reference in New Issue
Block a user