aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/components/send
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app/components/send')
-rw-r--r--ui/app/components/send/account-list-item.js2
-rw-r--r--ui/app/components/send/currency-display.js73
-rw-r--r--ui/app/components/send/from-dropdown.js1
-rw-r--r--ui/app/components/send/send-constants.js1
-rw-r--r--ui/app/components/send/send-utils.js42
-rw-r--r--ui/app/components/send/send-v2-container.js7
-rw-r--r--ui/app/components/send/to-autocomplete.js3
7 files changed, 81 insertions, 48 deletions
diff --git a/ui/app/components/send/account-list-item.js b/ui/app/components/send/account-list-item.js
index 2378a4671..1ad3f69c1 100644
--- a/ui/app/components/send/account-list-item.js
+++ b/ui/app/components/send/account-list-item.js
@@ -22,6 +22,7 @@ module.exports = connect(mapStateToProps)(AccountListItem)
AccountListItem.prototype.render = function () {
const {
+ className,
account,
handleClick,
icon = null,
@@ -34,6 +35,7 @@ AccountListItem.prototype.render = function () {
const { name, address, balance } = account || {}
return h('div.account-list-item', {
+ className,
onClick: () => handleClick({ name, address, balance }),
}, [
diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 45986e371..819fee0a0 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -1,6 +1,7 @@
const Component = require('react').Component
const h = require('react-hyperscript')
const inherits = require('util').inherits
+const CurrencyInput = require('../currency-input')
const { conversionUtil, multiplyCurrencies } = require('../../conversion-util')
module.exports = CurrencyDisplay
@@ -8,15 +9,6 @@ module.exports = CurrencyDisplay
inherits(CurrencyDisplay, Component)
function CurrencyDisplay () {
Component.call(this)
-
- this.state = {
- value: null,
- }
-}
-
-function isValidInput (text) {
- const re = /^([1-9]\d*|0)(\.|\.\d*)?$/
- return re.test(text)
}
function toHexWei (value) {
@@ -39,6 +31,28 @@ CurrencyDisplay.prototype.getAmount = function (value) {
: toHexWei(value)
}
+CurrencyDisplay.prototype.getValueToRender = function () {
+ const { selectedToken, conversionRate, value } = this.props
+
+ const { decimals, symbol } = selectedToken || {}
+ const multiplier = Math.pow(10, Number(decimals || 0))
+
+ return selectedToken
+ ? conversionUtil(value, {
+ fromNumericBase: 'hex',
+ toCurrency: symbol,
+ conversionRate: multiplier,
+ invertConversionRate: true,
+ })
+ : conversionUtil(value, {
+ fromNumericBase: 'hex',
+ toNumericBase: 'dec',
+ fromDenomination: 'WEI',
+ numberOfDecimals: 6,
+ conversionRate,
+ })
+}
+
CurrencyDisplay.prototype.render = function () {
const {
className = 'currency-display',
@@ -49,64 +63,41 @@ CurrencyDisplay.prototype.render = function () {
convertedCurrency,
readOnly = false,
inError = false,
- value: initValue,
handleChange,
- validate,
} = this.props
- const { value } = this.state
- const initValueToRender = conversionUtil(initValue, {
- fromNumericBase: 'hex',
- toNumericBase: 'dec',
- fromDenomination: 'WEI',
- numberOfDecimals: 6,
- conversionRate,
- })
+ const valueToRender = this.getValueToRender()
- const convertedValue = conversionUtil(value || initValueToRender, {
+ let convertedValue = conversionUtil(valueToRender, {
fromNumericBase: 'dec',
fromCurrency: primaryCurrency,
toCurrency: convertedCurrency,
numberOfDecimals: 2,
conversionRate,
})
-
- const inputSizeMultiplier = readOnly ? 1 : 1.2
+ convertedValue = Number(convertedValue).toFixed(2)
return h('div', {
className,
style: {
borderColor: inError ? 'red' : null,
},
+ onClick: () => this.currencyInput.focus(),
}, [
h('div.currency-display__primary-row', [
h('div.currency-display__input-wrapper', [
- h('input', {
+ h(CurrencyInput, {
className: primaryBalanceClassName,
- value: `${value || initValueToRender}`,
+ value: `${valueToRender}`,
placeholder: '0',
- size: (value || initValueToRender).length * inputSizeMultiplier,
readOnly,
- onChange: (event) => {
- let newValue = event.target.value
-
- if (newValue === '') {
- newValue = '0'
- } else if (newValue.match(/^0[1-9]$/)) {
- newValue = newValue.match(/[1-9]/)[0]
- }
-
- if (newValue && !isValidInput(newValue)) {
- event.preventDefault()
- } else {
- validate(this.getAmount(newValue))
- this.setState({ value: newValue })
- }
+ onInputChange: newValue => {
+ handleChange(this.getAmount(newValue))
},
- onBlur: event => !readOnly && handleChange(this.getAmount(event.target.value)),
+ inputRef: input => { this.currencyInput = input },
}),
h('span.currency-display__currency-symbol', primaryCurrency),
diff --git a/ui/app/components/send/from-dropdown.js b/ui/app/components/send/from-dropdown.js
index bcae5ede8..0686fbe73 100644
--- a/ui/app/components/send/from-dropdown.js
+++ b/ui/app/components/send/from-dropdown.js
@@ -35,6 +35,7 @@ FromDropdown.prototype.renderDropdown = function () {
h('div.send-v2__from-dropdown__list', {}, [
...accounts.map(account => h(AccountListItem, {
+ className: 'account-list-item__dropdown',
account,
handleClick: () => {
onSelect(account)
diff --git a/ui/app/components/send/send-constants.js b/ui/app/components/send/send-constants.js
index 0a4f85bc9..a961ffcd8 100644
--- a/ui/app/components/send/send-constants.js
+++ b/ui/app/components/send/send-constants.js
@@ -11,6 +11,7 @@ const MIN_GAS_PRICE_GWEI = ethUtil.addHexPrefix(conversionUtil(MIN_GAS_PRICE_HEX
toDenomination: 'GWEI',
fromNumericBase: 'hex',
toNumericBase: 'hex',
+ numberOfDecimals: 1,
}))
const MIN_GAS_TOTAL = multiplyCurrencies(MIN_GAS_LIMIT_HEX, MIN_GAS_PRICE_HEX, {
diff --git a/ui/app/components/send/send-utils.js b/ui/app/components/send/send-utils.js
index 6ec04a223..d8211930d 100644
--- a/ui/app/components/send/send-utils.js
+++ b/ui/app/components/send/send-utils.js
@@ -1,11 +1,17 @@
-const { addCurrencies, conversionGreaterThan } = require('../../conversion-util')
+const {
+ addCurrencies,
+ conversionUtil,
+ conversionGTE,
+} = require('../../conversion-util')
+const {
+ calcTokenAmount,
+} = require('../../token-util')
function isBalanceSufficient ({
- amount,
- gasTotal,
+ amount = '0x0',
+ gasTotal = '0x0',
balance,
primaryCurrency,
- selectedToken,
amountConversionRate,
conversionRate,
}) {
@@ -15,7 +21,7 @@ function isBalanceSufficient ({
toNumericBase: 'hex',
})
- const balanceIsSufficient = conversionGreaterThan(
+ const balanceIsSufficient = conversionGTE(
{
value: balance,
fromNumericBase: 'hex',
@@ -26,13 +32,37 @@ function isBalanceSufficient ({
value: totalAmount,
fromNumericBase: 'hex',
conversionRate: amountConversionRate,
- fromCurrency: selectedToken || primaryCurrency,
+ fromCurrency: primaryCurrency,
},
)
return balanceIsSufficient
}
+function isTokenBalanceSufficient ({
+ amount = '0x0',
+ tokenBalance,
+ decimals,
+}) {
+ const amountInDec = conversionUtil(amount, {
+ fromNumericBase: 'hex',
+ })
+
+ const tokenBalanceIsSufficient = conversionGTE(
+ {
+ value: tokenBalance,
+ fromNumericBase: 'dec',
+ },
+ {
+ value: calcTokenAmount(amountInDec, decimals),
+ fromNumericBase: 'dec',
+ },
+ )
+
+ return tokenBalanceIsSufficient
+}
+
module.exports = {
isBalanceSufficient,
+ isTokenBalanceSufficient,
}
diff --git a/ui/app/components/send/send-v2-container.js b/ui/app/components/send/send-v2-container.js
index 5a6e83ae6..4451a6113 100644
--- a/ui/app/components/send/send-v2-container.js
+++ b/ui/app/components/send/send-v2-container.js
@@ -13,6 +13,7 @@ const {
getSendFrom,
getCurrentCurrency,
getSelectedTokenToFiatRate,
+ getSelectedTokenContract,
} = require('../../selectors')
module.exports = connect(mapStateToProps, mapDispatchToProps)(SendEther)
@@ -48,6 +49,7 @@ function mapStateToProps (state) {
convertedCurrency: getCurrentCurrency(state),
data,
amountConversionRate: selectedToken ? tokenToFiatRate : conversionRate,
+ tokenContract: getSelectedTokenContract(state),
}
}
@@ -61,9 +63,13 @@ function mapDispatchToProps (dispatch) {
dispatch(actions.signTokenTx(tokenAddress, toAddress, amount, txData))
),
signTx: txParams => dispatch(actions.signTx(txParams)),
+ updateAndApproveTx: txParams => dispatch(actions.updateAndApproveTx(txParams)),
setSelectedAddress: address => dispatch(actions.setSelectedAddress(address)),
addToAddressBook: address => dispatch(actions.addToAddressBook(address)),
updateGasTotal: newTotal => dispatch(actions.updateGasTotal(newTotal)),
+ updateGasPrice: newGasPrice => dispatch(actions.updateGasPrice(newGasPrice)),
+ updateGasLimit: newGasLimit => dispatch(actions.updateGasLimit(newGasLimit)),
+ updateSendTokenBalance: tokenBalance => dispatch(actions.updateSendTokenBalance(tokenBalance)),
updateSendFrom: newFrom => dispatch(actions.updateSendFrom(newFrom)),
updateSendTo: newTo => dispatch(actions.updateSendTo(newTo)),
updateSendAmount: newAmount => dispatch(actions.updateSendAmount(newAmount)),
@@ -71,5 +77,6 @@ function mapDispatchToProps (dispatch) {
updateSendErrors: newError => dispatch(actions.updateSendErrors(newError)),
goHome: () => dispatch(actions.goHome()),
clearSend: () => dispatch(actions.clearSend()),
+ backToConfirmScreen: editingTransactionId => dispatch(actions.showConfTxPage({ id: editingTransactionId })),
}
}
diff --git a/ui/app/components/send/to-autocomplete.js b/ui/app/components/send/to-autocomplete.js
index df43fcc4a..e0cdd0a58 100644
--- a/ui/app/components/send/to-autocomplete.js
+++ b/ui/app/components/send/to-autocomplete.js
@@ -38,6 +38,7 @@ ToAutoComplete.prototype.renderDropdown = function () {
...accountsToRender.map(account => h(AccountListItem, {
account,
+ className: 'account-list-item__dropdown',
handleClick: () => {
onChange(account.address)
closeDropdown()
@@ -88,7 +89,7 @@ ToAutoComplete.prototype.render = function () {
inError,
} = this.props
- return h('div.to-autocomplete', {}, [
+ return h('div.send-v2__to-autocomplete', {}, [
h('input.send-v2__to-autocomplete__input', {
placeholder: 'Recipient Address',
generated by cgit v1.2.3 (git 2.25.1) at 2025-01-11 15:09:56 +0800