aboutsummaryrefslogtreecommitdiffstats
path: root/ui
diff options
context:
space:
mode:
Diffstat (limited to 'ui')
-rw-r--r--ui/app/components/input-number.js14
-rw-r--r--ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.component.js14
-rw-r--r--ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.container.js2
-rw-r--r--ui/app/components/pages/confirm-transaction-switch/confirm-transaction-switch.component.js26
-rw-r--r--ui/app/components/pages/confirm-transaction-switch/confirm-transaction-switch.util.js8
-rw-r--r--ui/app/components/pages/confirm-transaction/confirm-transaction.component.js8
-rw-r--r--ui/app/ducks/confirm-transaction.duck.js59
-rw-r--r--ui/app/helpers/confirm-transaction/util.js15
8 files changed, 112 insertions, 34 deletions
diff --git a/ui/app/components/input-number.js b/ui/app/components/input-number.js
index 01f751b69..59c6842ef 100644
--- a/ui/app/components/input-number.js
+++ b/ui/app/components/input-number.js
@@ -2,8 +2,10 @@ const Component = require('react').Component
const h = require('react-hyperscript')
const inherits = require('util').inherits
const {
+ addCurrencies,
conversionGTE,
conversionLTE,
+ subtractCurrencies,
} = require('../conversion-util')
module.exports = InputNumber
@@ -49,11 +51,7 @@ InputNumber.prototype.setValue = function (newValue) {
}
InputNumber.prototype.render = function () {
-<<<<<<< HEAD
const { unitLabel, step = 1, placeholder, value } = this.props
-=======
- const { unitLabel, step = 1, placeholder, value = 0, min = -1, max = Infinity } = this.props
->>>>>>> Refactor and redesign confirm transaction views
return h('div.customize-gas-input-wrapper', {}, [
h('input', {
@@ -69,19 +67,11 @@ InputNumber.prototype.render = function () {
h('span.gas-tooltip-input-detail', {}, [unitLabel]),
h('div.gas-tooltip-input-arrows', {}, [
h('i.fa.fa-angle-up', {
-<<<<<<< HEAD
onClick: () => this.setValue(addCurrencies(value, step, { toNumericBase: 'dec' })),
}),
h('i.fa.fa-angle-down', {
style: { cursor: 'pointer' },
onClick: () => this.setValue(subtractCurrencies(value, step, { toNumericBase: 'dec' })),
-=======
- onClick: () => this.setValue(Math.min(+value + step, max)),
- }),
- h('i.fa.fa-angle-down', {
- style: { cursor: 'pointer' },
- onClick: () => this.setValue(Math.max(+value - step, min)),
->>>>>>> Refactor and redesign confirm transaction views
}),
]),
])
diff --git a/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.component.js b/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.component.js
index dfbbd0177..1a399a464 100644
--- a/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.component.js
+++ b/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.component.js
@@ -18,6 +18,7 @@ export default class ConfirmTransactionBase extends Component {
// Redux props
txData: PropTypes.object,
tokenData: PropTypes.object,
+ methodData: PropTypes.object,
tokenProps: PropTypes.object,
isTxReprice: PropTypes.bool,
nonce: PropTypes.string,
@@ -245,7 +246,7 @@ export default class ConfirmTransactionBase extends Component {
data,
} = {},
} = {},
- tokenData: {
+ methodData: {
name,
params,
} = {},
@@ -266,7 +267,12 @@ export default class ConfirmTransactionBase extends Component {
</span>
</div>
<div className="confirm-page-container-content__data-box">
- { JSON.stringify(params, null, 2) }
+ <div className="confirm-page-container-content__data-field-label">
+ { `${t('parameters')}:` }
+ </div>
+ <div>
+ <pre>{ JSON.stringify(params, null, 2) }</pre>
+ </div>
</div>
<div className="confirm-page-container-content__data-box-label">
{`${t('hexData')}:`}
@@ -318,7 +324,7 @@ export default class ConfirmTransactionBase extends Component {
fromAddress,
toName,
toAddress,
- tokenData,
+ methodData,
ethTransactionAmount,
fiatTransactionAmount,
valid: propsValid,
@@ -336,7 +342,7 @@ export default class ConfirmTransactionBase extends Component {
warning,
} = this.props
- const { name } = tokenData
+ const { name } = methodData
const fiatConvertedAmount = formatCurrency(fiatTransactionAmount, currentCurrency)
const { valid, errorMessage } = this.getError()
diff --git a/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.container.js b/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.container.js
index 19c39aed9..4f1fb86c1 100644
--- a/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.container.js
+++ b/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.container.js
@@ -21,6 +21,7 @@ const mapStateToProps = (state, props) => {
fiatTransactionTotal,
hexGasTotal,
tokenData,
+ methodData,
txData,
tokenProps,
nonce,
@@ -60,6 +61,7 @@ const mapStateToProps = (state, props) => {
hexGasTotal,
txData,
tokenData,
+ methodData,
tokenProps,
isTxReprice,
currentCurrency,
diff --git a/ui/app/components/pages/confirm-transaction-switch/confirm-transaction-switch.component.js b/ui/app/components/pages/confirm-transaction-switch/confirm-transaction-switch.component.js
index 9ec0fc623..db28d0bad 100644
--- a/ui/app/components/pages/confirm-transaction-switch/confirm-transaction-switch.component.js
+++ b/ui/app/components/pages/confirm-transaction-switch/confirm-transaction-switch.component.js
@@ -11,7 +11,7 @@ import {
CONFIRM_TOKEN_METHOD_PATH,
SIGNATURE_REQUEST_PATH,
} from '../../../routes'
-import { isConfirmDeployContract, getTokenData } from './confirm-transaction-switch.util'
+import { isConfirmDeployContract } from './confirm-transaction-switch.util'
import { TOKEN_METHOD_TRANSFER, TOKEN_METHOD_APPROVE } from './confirm-transaction-switch.constants'
export default class ConfirmTransactionSwitch extends Component {
@@ -19,19 +19,29 @@ export default class ConfirmTransactionSwitch extends Component {
confirmTransaction: PropTypes.object,
}
- redirectToTransaction (txData) {
- const { id, txParams: { data } } = txData
+ redirectToTransaction () {
+ const {
+ confirmTransaction: {
+ txData,
+ methodData: { name },
+ fetchingMethodData,
+ },
+ } = this.props
+ const { id } = txData
if (isConfirmDeployContract(txData)) {
const pathname = `${CONFIRM_TRANSACTION_ROUTE}/${id}${CONFIRM_DEPLOY_CONTRACT_PATH}`
return <Redirect to={{ pathname }} />
}
- if (data) {
- const tokenData = getTokenData(data)
- const { name: tokenMethodName } = tokenData || {}
+ if (fetchingMethodData) {
+ return <Loading />
+ }
+
+ if (name) {
+ const methodName = name.toLowerCase()
- switch (tokenMethodName) {
+ switch (methodName.toLowerCase()) {
case TOKEN_METHOD_TRANSFER: {
const pathname = `${CONFIRM_TRANSACTION_ROUTE}/${id}${CONFIRM_SEND_TOKEN_PATH}`
return <Redirect to={{ pathname }} />
@@ -55,7 +65,7 @@ export default class ConfirmTransactionSwitch extends Component {
const { confirmTransaction: { txData } } = this.props
if (txData.txParams) {
- return this.redirectToTransaction(txData)
+ return this.redirectToTransaction()
} else if (txData.msgParams) {
const pathname = `${CONFIRM_TRANSACTION_ROUTE}/${txData.id}${SIGNATURE_REQUEST_PATH}`
return <Redirect to={{ pathname }} />
diff --git a/ui/app/components/pages/confirm-transaction-switch/confirm-transaction-switch.util.js b/ui/app/components/pages/confirm-transaction-switch/confirm-transaction-switch.util.js
index dd1dec6ae..536aa5212 100644
--- a/ui/app/components/pages/confirm-transaction-switch/confirm-transaction-switch.util.js
+++ b/ui/app/components/pages/confirm-transaction-switch/confirm-transaction-switch.util.js
@@ -1,12 +1,4 @@
-import abi from 'human-standard-token-abi'
-import abiDecoder from 'abi-decoder'
-abiDecoder.addABI(abi)
-
export function isConfirmDeployContract (txData = {}) {
const { txParams = {} } = txData
return !txParams.to
}
-
-export function getTokenData (data = {}) {
- return abiDecoder.decodeMethod(data)
-}
diff --git a/ui/app/components/pages/confirm-transaction/confirm-transaction.component.js b/ui/app/components/pages/confirm-transaction/confirm-transaction.component.js
index d4581e8ed..219f5b49a 100644
--- a/ui/app/components/pages/confirm-transaction/confirm-transaction.component.js
+++ b/ui/app/components/pages/confirm-transaction/confirm-transaction.component.js
@@ -85,8 +85,12 @@ export default class ConfirmTransaction extends Component {
}
} else if (unconfirmedTransactions.length) {
const totalUnconfirmed = unconfirmedTransactions.length
- const transactionId = unconfirmedTransactions[totalUnconfirmed - 1].id
- setTransactionToConfirm(transactionId)
+ const transaction = unconfirmedTransactions[totalUnconfirmed - 1]
+ const { id: transactionId, loadingDefaults } = transaction
+
+ if (!loadingDefaults) {
+ setTransactionToConfirm(transactionId)
+ }
}
}
diff --git a/ui/app/ducks/confirm-transaction.duck.js b/ui/app/ducks/confirm-transaction.duck.js
index cb3582ec3..be0888dc1 100644
--- a/ui/app/ducks/confirm-transaction.duck.js
+++ b/ui/app/ducks/confirm-transaction.duck.js
@@ -6,6 +6,7 @@ import {
import {
getTokenData,
+ getMethodData,
getTransactionAmount,
getTransactionFee,
getHexGasTotal,
@@ -25,6 +26,8 @@ const UPDATE_TX_DATA = createActionType('UPDATE_TX_DATA')
const CLEAR_TX_DATA = createActionType('CLEAR_TX_DATA')
const UPDATE_TOKEN_DATA = createActionType('UPDATE_TOKEN_DATA')
const CLEAR_TOKEN_DATA = createActionType('CLEAR_TOKEN_DATA')
+const UPDATE_METHOD_DATA = createActionType('UPDATE_METHOD_DATA')
+const CLEAR_METHOD_DATA = createActionType('CLEAR_METHOD_DATA')
const CLEAR_CONFIRM_TRANSACTION = createActionType('CLEAR_CONFIRM_TRANSACTION')
const UPDATE_TRANSACTION_AMOUNTS = createActionType('UPDATE_TRANSACTION_AMOUNTS')
const UPDATE_TRANSACTION_FEES = createActionType('UPDATE_TRANSACTION_FEES')
@@ -32,11 +35,14 @@ const UPDATE_TRANSACTION_TOTALS = createActionType('UPDATE_TRANSACTION_TOTALS')
const UPDATE_HEX_GAS_TOTAL = createActionType('UPDATE_HEX_GAS_TOTAL')
const UPDATE_TOKEN_PROPS = createActionType('UPDATE_TOKEN_PROPS')
const UPDATE_NONCE = createActionType('UPDATE_NONCE')
+const FETCH_METHOD_DATA_START = createActionType('FETCH_METHOD_DATA_START')
+const FETCH_METHOD_DATA_END = createActionType('FETCH_METHOD_DATA_END')
// Initial state
const initState = {
txData: {},
tokenData: {},
+ methodData: {},
tokenProps: {
tokenDecimals: '',
tokenSymbol: '',
@@ -49,6 +55,7 @@ const initState = {
ethTransactionTotal: '',
hexGasTotal: '',
nonce: '',
+ fetchingMethodData: false,
}
// Reducer
@@ -78,6 +85,18 @@ export default function reducer ({ confirmTransaction: confirmState = initState
...confirmState,
tokenData: {},
}
+ case UPDATE_METHOD_DATA:
+ return {
+ ...confirmState,
+ methodData: {
+ ...action.payload,
+ },
+ }
+ case CLEAR_METHOD_DATA:
+ return {
+ ...confirmState,
+ methodData: {},
+ }
case UPDATE_TRANSACTION_AMOUNTS:
const { fiatTransactionAmount, ethTransactionAmount } = action.payload
return {
@@ -119,6 +138,16 @@ export default function reducer ({ confirmTransaction: confirmState = initState
...confirmState,
nonce: action.payload,
}
+ case FETCH_METHOD_DATA_START:
+ return {
+ ...confirmState,
+ fetchingMethodData: true,
+ }
+ case FETCH_METHOD_DATA_END:
+ return {
+ ...confirmState,
+ fetchingMethodData: false,
+ }
case CLEAR_CONFIRM_TRANSACTION:
return initState
default:
@@ -153,6 +182,19 @@ export function clearTokenData () {
}
}
+export function updateMethodData (methodData) {
+ return {
+ type: UPDATE_METHOD_DATA,
+ payload: methodData,
+ }
+}
+
+export function clearMethodData () {
+ return {
+ type: CLEAR_METHOD_DATA,
+ }
+}
+
export function updateTransactionAmounts (amounts) {
return {
type: UPDATE_TRANSACTION_AMOUNTS,
@@ -195,6 +237,12 @@ export function updateNonce (nonce) {
}
}
+export function setFetchingMethodData (isFetching) {
+ return {
+ type: isFetching ? FETCH_METHOD_DATA_START : FETCH_METHOD_DATA_END,
+ }
+}
+
export function updateGasAndCalculate ({ gasLimit, gasPrice }) {
return (dispatch, getState) => {
const { confirmTransaction: { txData } } = getState()
@@ -294,6 +342,17 @@ export function setTransactionToConfirm (transactionId) {
if (txParams.data) {
const { tokens: existingTokens } = state
const { data, to: tokenAddress } = txParams
+
+ try {
+ dispatch(setFetchingMethodData(true))
+ const methodData = await getMethodData(data)
+ dispatch(updateMethodData(methodData))
+ dispatch(setFetchingMethodData(false))
+ } catch (error) {
+ dispatch(updateMethodData({}))
+ dispatch(setFetchingMethodData(false))
+ }
+
const tokenData = getTokenData(data)
dispatch(updateTokenData(tokenData))
diff --git a/ui/app/helpers/confirm-transaction/util.js b/ui/app/helpers/confirm-transaction/util.js
index fa748ca46..ad247a348 100644
--- a/ui/app/helpers/confirm-transaction/util.js
+++ b/ui/app/helpers/confirm-transaction/util.js
@@ -6,6 +6,9 @@ import ethUtil from 'ethereumjs-util'
abiDecoder.addABI(abi)
+import MethodRegistry from 'eth-method-registry'
+const registry = new MethodRegistry({ provider: global.ethereumProvider })
+
import {
conversionUtil,
addCurrencies,
@@ -17,6 +20,18 @@ export function getTokenData (data = {}) {
return abiDecoder.decodeMethod(data)
}
+export async function getMethodData (data = {}) {
+ const prefixedData = ethUtil.addHexPrefix(data)
+ const fourBytePrefix = prefixedData.slice(0, 10)
+ const sig = await registry.lookup(fourBytePrefix)
+ const parsedResult = registry.parse(sig)
+
+ return {
+ name: parsedResult.name,
+ params: parsedResult.args,
+ }
+}
+
export function increaseLastGasPrice (lastGasPrice) {
return ethUtil.addHexPrefix(multiplyCurrencies(lastGasPrice, 1.1, {
multiplicandBase: 16,