m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-22 17:33:23 +01:00
Code

Get currency from state in account details, send and confirm screens.

Browse Source
This commit is contained in:
Dan 2017-10-18 23:39:26 -02:30
parent 59015cccef
commit 332c7441b6
14 changed files with 89 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
ui/app/app.js
View File

@ -76,6 +76,7 @@ function mapStateToProps (state) {
lastUnreadNotice: state.metamask.lastUnreadNotice,
lostAccounts: state.metamask.lostAccounts,
frequentRpcList: state.metamask.frequentRpcList || [],
currentCurrency: state.metamask.currentCurrency,
// state needed to get account dropdown temporarily rendering from app bar
identities,
@ -96,7 +97,9 @@ function mapDispatchToProps (dispatch, ownProps) {
}
App.prototype.componentWillMount = function () {
if (!this.props.currentCurrency) {
this.props.setCurrentCurrencyToUSD()
}
}
App.prototype.render = function () {

28
ui/app/components/pending-tx/confirm-deploy-contract.js
View File

@ -21,10 +21,12 @@ function mapStateToProps (state) {
const {
conversionRate,
identities,
currentCurrency,
} = state.metamask
const accounts = state.metamask.accounts
const selectedAddress = state.metamask.selectedAddress || Object.keys(accounts)[0]
return {
currentCurrency,
conversionRate,
identities,
selectedAddress,
@ -124,15 +126,15 @@ ConfirmDeployContract.prototype.getData = function () {
}
ConfirmDeployContract.prototype.getAmount = function () {
const { conversionRate } = this.props
const { conversionRate, currentCurrency } = this.props
const txMeta = this.gatherTxMeta()
const txParams = txMeta.txParams || {}
const USD = conversionUtil(txParams.value, {
const FIAT = conversionUtil(txParams.value, {
fromNumericBase: 'hex',
toNumericBase: 'dec',
fromCurrency: 'ETH',
toCurrency: 'USD',
toCurrency: currentCurrency,
numberOfDecimals: 2,
fromDenomination: 'WEI',
conversionRate,
@ -148,14 +150,14 @@ ConfirmDeployContract.prototype.getAmount = function () {
})
return {
fiat: Number(USD),
fiat: Number(FIAT),
token: Number(ETH),
}
}
ConfirmDeployContract.prototype.getGasFee = function () {
const { conversionRate } = this.props
const { conversionRate, currentCurrency } = this.props
const txMeta = this.gatherTxMeta()
const txParams = txMeta.txParams || {}
@ -169,12 +171,12 @@ ConfirmDeployContract.prototype.getGasFee = function () {
const txFeeBn = gasBn.mul(gasPriceBn)
const USD = conversionUtil(txFeeBn, {
const FIAT = conversionUtil(txFeeBn, {
fromNumericBase: 'BN',
toNumericBase: 'dec',
fromDenomination: 'WEI',
fromCurrency: 'ETH',
toCurrency: 'USD',
toCurrency: currentCurrency,
numberOfDecimals: 2,
conversionRate,
})
@ -189,7 +191,7 @@ ConfirmDeployContract.prototype.getGasFee = function () {
})
return {
fiat: Number(USD),
fiat: Number(FIAT),
eth: Number(ETH),
}
}
@ -200,7 +202,7 @@ ConfirmDeployContract.prototype.renderGasFee = function () {
h('section.flex-row.flex-center.confirm-screen-row', [
h('span.confirm-screen-label.confirm-screen-section-column', [ 'Gas Fee' ]),
h('div.confirm-screen-section-column', [
h('div.confirm-screen-row-info', `$${fiatGas} USD`),
h('div.confirm-screen-row-info', `${fiatGas} FIAT`),
h(
'div.confirm-screen-row-detail',
@ -212,6 +214,7 @@ ConfirmDeployContract.prototype.renderGasFee = function () {
}
ConfirmDeployContract.prototype.renderHeroAmount = function () {
const { currentCurrency } = this.props
const { fiat: fiatAmount } = this.getAmount()
const txMeta = this.gatherTxMeta()
const txParams = txMeta.txParams || {}
@ -219,8 +222,8 @@ ConfirmDeployContract.prototype.renderHeroAmount = function () {
return (
h('div.confirm-send-token__hero-amount-wrapper', [
h('h3.flex-center.confirm-screen-send-amount', `$${fiatAmount}`),
h('h3.flex-center.confirm-screen-send-amount-currency', 'USD'),
h('h3.flex-center.confirm-screen-send-amount', `${fiatAmount}`),
h('h3.flex-center.confirm-screen-send-amount-currency', currentCurrency.toUpperCase()),
h('div.flex-center.confirm-memo-wrapper', [
h('h3.confirm-screen-send-memo', memo),
]),
@ -229,6 +232,7 @@ ConfirmDeployContract.prototype.renderHeroAmount = function () {
}
ConfirmDeployContract.prototype.renderTotalPlusGas = function () {
const { currentCurrency } = this.props
const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
const { fiat: fiatGas, eth: ethGas } = this.getGasFee()
@ -240,7 +244,7 @@ ConfirmDeployContract.prototype.renderTotalPlusGas = function () {
]),
h('div.confirm-screen-section-column', [
h('div.confirm-screen-row-info', `$${fiatAmount + fiatGas} USD`),
h('div.confirm-screen-row-info', `${fiatAmount + fiatGas} ${currentCurrency.toUpperCase()}`),
h('div.confirm-screen-row-detail', `${tokenAmount + ethGas} ETH`),
]),
])

48
ui/app/components/pending-tx/confirm-send-ether.js
View File

@ -20,6 +20,7 @@ function mapStateToProps (state) {
const {
conversionRate,
identities,
currentCurrency,
} = state.metamask
const accounts = state.metamask.accounts
const selectedAddress = state.metamask.selectedAddress || Object.keys(accounts)[0]
@ -27,6 +28,7 @@ function mapStateToProps (state) {
conversionRate,
identities,
selectedAddress,
currentCurrency,
}
}
@ -45,15 +47,15 @@ function ConfirmSendEther () {
}
ConfirmSendEther.prototype.getAmount = function () {
const { conversionRate } = this.props
const { conversionRate, currentCurrency } = this.props
const txMeta = this.gatherTxMeta()
const txParams = txMeta.txParams || {}
console.log(txParams)
const USD = conversionUtil(txParams.value, {
console.log(`conversionRate, currentCurrency`, conversionRate, currentCurrency);
const FIAT = conversionUtil(txParams.value, {
fromNumericBase: 'hex',
toNumericBase: 'dec',
fromCurrency: 'ETH',
toCurrency: 'USD',
toCurrency: currentCurrency,
numberOfDecimals: 2,
fromDenomination: 'WEI',
conversionRate,
@ -69,14 +71,14 @@ ConfirmSendEther.prototype.getAmount = function () {
})
return {
USD,
FIAT,
ETH,
}
}
ConfirmSendEther.prototype.getGasFee = function () {
const { conversionRate } = this.props
const { conversionRate, currentCurrency } = this.props
const txMeta = this.gatherTxMeta()
const txParams = txMeta.txParams || {}
@ -96,12 +98,12 @@ ConfirmSendEther.prototype.getGasFee = function () {
const txFeeBn = gasBn.mul(gasPriceBn)
const USD = conversionUtil(txFeeBn, {
const FIAT = conversionUtil(txFeeBn, {
fromNumericBase: 'BN',
toNumericBase: 'dec',
fromDenomination: 'WEI',
fromCurrency: 'ETH',
toCurrency: 'USD',
toCurrency: currentCurrency,
numberOfDecimals: 2,
conversionRate,
})
@ -116,7 +118,7 @@ ConfirmSendEther.prototype.getGasFee = function () {
})
return {
USD,
FIAT,
ETH,
}
}
@ -125,10 +127,10 @@ ConfirmSendEther.prototype.getData = function () {
const { identities } = this.props
const txMeta = this.gatherTxMeta()
const txParams = txMeta.txParams || {}
const { USD: gasFeeInUSD, ETH: gasFeeInETH } = this.getGasFee()
const { USD: amountInUSD, ETH: amountInETH } = this.getAmount()
const { FIAT: gasFeeInFIAT, ETH: gasFeeInETH } = this.getGasFee()
const { FIAT: amountInFIAT, ETH: amountInETH } = this.getAmount()
const totalInUSD = addCurrencies(gasFeeInUSD, amountInUSD, {
const totalInFIAT = addCurrencies(gasFeeInFIAT, amountInFIAT, {
toNumericBase: 'dec',
numberOfDecimals: 2,
})
@ -147,17 +149,17 @@ ConfirmSendEther.prototype.getData = function () {
name: identities[txParams.to] ? identities[txParams.to].name : 'New Recipient',
},
memo: txParams.memo || '',
gasFeeInUSD,
gasFeeInFIAT,
gasFeeInETH,
amountInUSD,
amountInFIAT,
amountInETH,
totalInUSD,
totalInFIAT,
totalInETH,
}
}
ConfirmSendEther.prototype.render = function () {
const { backToAccountDetail, selectedAddress } = this.props
const { backToAccountDetail, selectedAddress, currentCurrency } = this.props
const txMeta = this.gatherTxMeta()
const txParams = txMeta.txParams || {}
@ -171,10 +173,10 @@ ConfirmSendEther.prototype.render = function () {
name: toName,
},
memo,
gasFeeInUSD,
gasFeeInFIAT,
gasFeeInETH,
amountInUSD,
totalInUSD,
amountInFIAT,
totalInFIAT,
totalInETH,
} = this.getData()
@ -239,8 +241,8 @@ ConfirmSendEther.prototype.render = function () {
// `You're sending to Recipient ...${toAddress.slice(toAddress.length - 4)}`,
// ]),
h('h3.flex-center.confirm-screen-send-amount', [`$${amountInUSD}`]),
h('h3.flex-center.confirm-screen-send-amount-currency', [ 'USD' ]),
h('h3.flex-center.confirm-screen-send-amount', [`$${amountInFIAT}`]),
h('h3.flex-center.confirm-screen-send-amount-currency', [ currentCurrency.toUpperCase() ]),
h('div.flex-center.confirm-memo-wrapper', [
h('h3.confirm-screen-send-memo', [ memo ? `"${memo}"` : '' ]),
]),
@ -265,7 +267,7 @@ ConfirmSendEther.prototype.render = function () {
h('section.flex-row.flex-center.confirm-screen-row', [
h('span.confirm-screen-label.confirm-screen-section-column', [ 'Gas Fee' ]),
h('div.confirm-screen-section-column', [
h('div.confirm-screen-row-info', `$${gasFeeInUSD} USD`),
h('div.confirm-screen-row-info', `${gasFeeInFIAT} ${currentCurrency.toUpperCase()}`),
h('div.confirm-screen-row-detail', `${gasFeeInETH} ETH`),
]),
@ -279,7 +281,7 @@ ConfirmSendEther.prototype.render = function () {
]),
h('div.confirm-screen-section-column', [
h('div.confirm-screen-row-info', `$${totalInUSD} USD`),
h('div.confirm-screen-row-info', `${totalInFIAT} ${currentCurrency.toUpperCase()}`),
h('div.confirm-screen-row-detail', `${totalInETH} ETH`),
]),
]),

24
ui/app/components/pending-tx/confirm-send-token.js
View File

@ -81,7 +81,7 @@ ConfirmSendToken.prototype.getAmount = function () {
}
ConfirmSendToken.prototype.getGasFee = function () {
const { conversionRate, tokenExchangeRate, token } = this.props
const { conversionRate, tokenExchangeRate, token, currentCurrency } = this.props
const txMeta = this.gatherTxMeta()
const txParams = txMeta.txParams || {}
const { decimals } = token
@ -96,12 +96,12 @@ ConfirmSendToken.prototype.getGasFee = function () {
const txFeeBn = gasBn.mul(gasPriceBn)
const USD = conversionUtil(txFeeBn, {
const FIAT = conversionUtil(txFeeBn, {
fromNumericBase: 'BN',
toNumericBase: 'dec',
fromDenomination: 'WEI',
fromCurrency: 'ETH',
toCurrency: 'USD',
toCurrency: currentCurrency,
numberOfDecimals: 2,
conversionRate,
})
@ -116,7 +116,7 @@ ConfirmSendToken.prototype.getGasFee = function () {
})
return {
fiat: +Number(USD).toFixed(2),
fiat: +Number(FIAT).toFixed(2),
eth: ETH,
token: tokenExchangeRate
? +(ETH * tokenExchangeRate).toFixed(decimals)
@ -145,7 +145,7 @@ ConfirmSendToken.prototype.getData = function () {
}
ConfirmSendToken.prototype.renderHeroAmount = function () {
const { token: { symbol } } = this.props
const { token: { symbol }, currentCurrency } = this.props
const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
const txMeta = this.gatherTxMeta()
const txParams = txMeta.txParams || {}
@ -154,8 +154,8 @@ ConfirmSendToken.prototype.renderHeroAmount = function () {
return fiatAmount
? (
h('div.confirm-send-token__hero-amount-wrapper', [
h('h3.flex-center.confirm-screen-send-amount', `$${fiatAmount}`),
h('h3.flex-center.confirm-screen-send-amount-currency', 'USD'),
h('h3.flex-center.confirm-screen-send-amount', `${fiatAmount}`),
h('h3.flex-center.confirm-screen-send-amount-currency', currentCurrency),
h('div.flex-center.confirm-memo-wrapper', [
h('h3.confirm-screen-send-memo', [ memo ? `"${memo}"` : '' ]),
]),
@ -173,14 +173,14 @@ ConfirmSendToken.prototype.renderHeroAmount = function () {
}
ConfirmSendToken.prototype.renderGasFee = function () {
const { token: { symbol } } = this.props
const { token: { symbol }, currentCurrency } = this.props
const { fiat: fiatGas, token: tokenGas, eth: ethGas } = this.getGasFee()
return (
h('section.flex-row.flex-center.confirm-screen-row', [
h('span.confirm-screen-label.confirm-screen-section-column', [ 'Gas Fee' ]),
h('div.confirm-screen-section-column', [
h('div.confirm-screen-row-info', `$${fiatGas} USD`),
h('div.confirm-screen-row-info', `${fiatGas} ${currentCurrency}`),
h(
'div.confirm-screen-row-detail',
@ -192,7 +192,7 @@ ConfirmSendToken.prototype.renderGasFee = function () {
}
ConfirmSendToken.prototype.renderTotalPlusGas = function () {
const { token: { symbol } } = this.props
const { token: { symbol }, currentCurrency } = this.props
const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
const { fiat: fiatGas, token: tokenGas } = this.getGasFee()
@ -205,7 +205,7 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
]),
h('div.confirm-screen-section-column', [
h('div.confirm-screen-row-info', `$${fiatAmount + fiatGas} USD`),
h('div.confirm-screen-row-info', `${fiatAmount + fiatGas} ${currentCurrency}`),
h('div.confirm-screen-row-detail', `${tokenAmount + tokenGas} ${symbol}`),
]),
])
@ -219,7 +219,7 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
h('div.confirm-screen-section-column', [
h('div.confirm-screen-row-info', `${tokenAmount} ${symbol}`),
h('div.confirm-screen-row-detail', `+ ${fiatGas} USD Gas`),
h('div.confirm-screen-row-detail', `+ ${fiatGas} ${currentCurrency} Gas`),
]),
])
)

3
ui/app/components/pending-tx/index.js
View File

@ -36,7 +36,6 @@ function mapStateToProps (state) {
function mapDispatchToProps (dispatch) {
return {
setCurrentCurrencyToUSD: () => dispatch(actions.setCurrentCurrency('usd')),
backToAccountDetail: address => dispatch(actions.backToAccountDetail(address)),
cancelTransaction: ({ id }) => dispatch(actions.cancelTx({ id })),
}
@ -58,8 +57,6 @@ PendingTx.prototype.componentWillMount = async function () {
const txMeta = this.gatherTxMeta()
const txParams = txMeta.txParams || {}
this.props.setCurrentCurrencyToUSD()
if (!txParams.to) {
return this.setState({
transactionType: TX_TYPES.DEPLOY_CONTRACT,

9
ui/app/components/send/account-list-item.js
View File

@ -4,7 +4,7 @@ const inherits = require('util').inherits
const connect = require('react-redux').connect
const Identicon = require('../identicon')
const CurrencyDisplay = require('./currency-display')
const { conversionRateSelector } = require('../../selectors')
const { conversionRateSelector, getCurrentCurrency } = require('../../selectors')
inherits(AccountListItem, Component)
function AccountListItem () {
@ -13,7 +13,8 @@ function AccountListItem () {
function mapStateToProps(state) {
return {
conversionRate: conversionRateSelector(state)
conversionRate: conversionRateSelector(state),
currentCurrency: getCurrentCurrency(state),
}
}
@ -25,6 +26,7 @@ AccountListItem.prototype.render = function () {
handleClick,
icon = null,
conversionRate,
currentCurrency,
} = this.props
const { name, address, balance } = account
@ -52,10 +54,9 @@ AccountListItem.prototype.render = function () {
h(CurrencyDisplay, {
primaryCurrency: 'ETH',
convertedCurrency: 'USD',
convertedCurrency: currentCurrency,
value: balance,
conversionRate,
convertedPrefix: '$',
readOnly: true,
className: 'account-list-item__account-balances',
primaryBalanceClassName: 'account-list-item__account-primary-balance',

2
ui/app/components/send/currency-display.js
View File

@ -118,7 +118,7 @@ CurrencyDisplay.prototype.render = function () {
h('div', {
className: convertedBalanceClassName,
}, `${convertedPrefix}${convertedValue} ${convertedCurrency}`),
}, `${convertedValue} ${convertedCurrency.toUpperCase()}`),
])

4
ui/app/components/send/gas-fee-display-v2.js
View File

@ -15,6 +15,8 @@ GasFeeDisplay.prototype.render = function () {
conversionRate,
gasTotal,
onClick,
primaryCurrency = 'ETH',
convertedCurrency,
} = this.props
return h('div.send-v2__gas-fee-display', [
@ -22,7 +24,7 @@ GasFeeDisplay.prototype.render = function () {
gasTotal
? h(CurrencyDisplay, {
primaryCurrency: 'ETH',
convertedCurrency: 'USD',
convertedCurrency,
value: gasTotal,
conversionRate,
convertedPrefix: '$',

8
ui/app/components/send/send-v2-container.js
View File

@ -16,6 +16,7 @@ const {
getGasLimit,
getAddressBook,
getSendFrom,
getCurrentCurrency,
} = require('../../selectors')
module.exports = connect(mapStateToProps, mapDispatchToProps)(SendEther)
@ -30,7 +31,7 @@ function mapStateToProps (state) {
let data;
let primaryCurrency;
let tokenToUSDRate;
let tokenToFiatRate;
if (selectedToken) {
data = Array.prototype.map.call(
abi.rawEncode(['address', 'uint256'], [selectedAddress, '0x0']),
@ -39,7 +40,7 @@ function mapStateToProps (state) {
primaryCurrency = selectedToken.symbol
tokenToUSDRate = multiplyCurrencies(
tokenToFiatRate = multiplyCurrencies(
conversionRate,
selectedTokenExchangeRate,
{ toNumericBase: 'dec' }
@ -54,8 +55,9 @@ function mapStateToProps (state) {
conversionRate,
selectedToken,
primaryCurrency,
convertedCurrency: getCurrentCurrency(state),
data,
amountConversionRate: selectedToken ? tokenToUSDRate : conversionRate,
amountConversionRate: selectedToken ? tokenToFiatRate : conversionRate,
}
}

10
ui/app/components/tx-list-item.js
View File

@ -11,11 +11,14 @@ const Identicon = require('./identicon')
const { conversionUtil } = require('../conversion-util')
const { getCurrentCurrency } = require('../selectors')
module.exports = connect(mapStateToProps)(TxListItem)
function mapStateToProps (state) {
return {
tokens: state.metamask.tokens,
currentCurrency: getCurrentCurrency(state),
}
}
@ -49,17 +52,18 @@ TxListItem.prototype.getSendEtherTotal = function () {
transactionAmount,
conversionRate,
address,
currentCurrency,
} = this.props
if (!address) {
return {}
}
const totalInUSD = conversionUtil(transactionAmount, {
const totalInFiat = conversionUtil(transactionAmount, {
fromNumericBase: 'hex',
toNumericBase: 'dec',
fromCurrency: 'ETH',
toCurrency: 'USD',
toCurrency: currentCurrency,
fromDenomination: 'WEI',
numberOfDecimals: 2,
conversionRate,
@ -76,7 +80,7 @@ TxListItem.prototype.getSendEtherTotal = function () {
return {
total: `${totalInETH} ETH`,
fiatTotal: `$${totalInUSD} USD`,
fiatTotal: `${totalInFiat} ${currentCurrency.toUpperCase()}`,
}
}

1
ui/app/config.js
View File

@ -170,6 +170,7 @@ function currentConversionInformation (metamaskState, state) {
},
defaultValue: currentCurrency,
}, infuraCurrencies.map((currency) => {
console.log(`currency`, currency);
return h('option', {key: currency.quote.code, value: currency.quote.code}, `${currency.quote.code.toUpperCase()} - ${currency.quote.name}`)
})
),

2
ui/app/conversion-util.js
View File

@ -36,7 +36,7 @@ const BIG_NUMBER_GWEI_MULTIPLIER = new BigNumber('1000000000')
// Individual Setters
const convert = R.invoker(1, 'times')
const round = R.invoker(2, 'toFormat')(R.__, BigNumber.ROUND_DOWN)
const round = R.invoker(2, 'round')(R.__, BigNumber.ROUND_DOWN)
const invertConversionRate = conversionRate => () => new BigNumber(1.0).div(conversionRate)
// Setter Maps

5
ui/app/selectors.js
View File

@ -14,6 +14,7 @@ const selectors = {
getGasLimit,
getAddressBook,
getSendFrom,
getCurrentCurrency,
}
module.exports = selectors
@ -112,3 +113,7 @@ function getGasLimit (state) {
function getSendFrom (state) {
return state.metamask.send.from
}
function getCurrentCurrency (state) {
return state.metamask.currentCurrency
}

6
ui/app/send-v2.js
View File

@ -277,6 +277,7 @@ SendTransactionScreen.prototype.renderAmountRow = function () {
const {
selectedToken,
primaryCurrency = 'ETH',
convertedCurrency,
amountConversionRate,
errors,
} = this.props
@ -294,10 +295,9 @@ SendTransactionScreen.prototype.renderAmountRow = function () {
h(CurrencyDisplay, {
inError: Boolean(errors.amount),
primaryCurrency,
convertedCurrency: 'USD',
convertedCurrency,
value: amount,
conversionRate: amountConversionRate,
convertedPrefix: '$',
handleChange: this.handleAmountChange,
validate: this.validateAmount,
}),
@ -309,6 +309,7 @@ SendTransactionScreen.prototype.renderAmountRow = function () {
SendTransactionScreen.prototype.renderGasRow = function () {
const {
conversionRate,
convertedCurrency,
showCustomizeGasModal,
gasTotal = MIN_GAS_TOTAL,
} = this.props
@ -322,6 +323,7 @@ SendTransactionScreen.prototype.renderGasRow = function () {
h(GasFeeDisplay, {
gasTotal,
conversionRate,
convertedCurrency,
onClick: showCustomizeGasModal,
}),