diff options
author | Dan Finlay <542863+danfinlay@users.noreply.github.com> | 2018-09-05 03:56:56 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2018-09-05 03:56:56 +0800 |
commit | 50434513569ad44fbd01a7e124b5f499b4d6f2e2 (patch) | |
tree | 8cd6147073660343e8aa0cc05c4902134c7983b9 /ui/app/components | |
parent | 86bb96aaaf106f1fa16fa93e749772524b5132b2 (diff) | |
parent | 879e10d44accbe9122e8b8514641b4fb2b986ad7 (diff) | |
download | tangerine-wallet-browser-50434513569ad44fbd01a7e124b5f499b4d6f2e2.tar.gz tangerine-wallet-browser-50434513569ad44fbd01a7e124b5f499b4d6f2e2.tar.zst tangerine-wallet-browser-50434513569ad44fbd01a7e124b5f499b4d6f2e2.zip |
Merge pull request #5167 from MetaMask/fix-watcAsset-images
Fix images for watched tokens
Diffstat (limited to 'ui/app/components')
12 files changed, 37 insertions, 11 deletions
diff --git a/ui/app/components/balance-component.js b/ui/app/components/balance-component.js index 753a27b06..d63d78c9f 100644 --- a/ui/app/components/balance-component.js +++ b/ui/app/components/balance-component.js @@ -5,6 +5,7 @@ const inherits = require('util').inherits const TokenBalance = require('./token-balance') const Identicon = require('./identicon') import CurrencyDisplay from './currency-display' +const { getAssetImages, conversionRateSelector, getCurrentCurrency} = require('../selectors') const { formatBalance, generateBalanceObject } = require('../util') @@ -19,9 +20,9 @@ function mapStateToProps (state) { return { account, network, - conversionRate: state.metamask.conversionRate, - currentCurrency: state.metamask.currentCurrency, - assetImages: state.metamask.assetImages, + conversionRate: conversionRateSelector(state), + currentCurrency: getCurrentCurrency(state), + assetImages: getAssetImages(state), } } diff --git a/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js b/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js index 08923af88..de9aa6eb7 100644 --- a/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js +++ b/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js @@ -18,6 +18,7 @@ export default class ConfirmPageContainerContent extends Component { hideSubtitle: PropTypes.bool, identiconAddress: PropTypes.string, nonce: PropTypes.string, + assetImage: PropTypes.string, subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), summaryComponent: PropTypes.node, title: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), @@ -60,6 +61,7 @@ export default class ConfirmPageContainerContent extends Component { hideSubtitle, identiconAddress, nonce, + assetImage, summaryComponent, detailsComponent, dataComponent, @@ -85,6 +87,7 @@ export default class ConfirmPageContainerContent extends Component { hideSubtitle={hideSubtitle} identiconAddress={identiconAddress} nonce={nonce} + assetImage={assetImage} /> ) } diff --git a/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-summary/confirm-page-container-summary.component.js b/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-summary/confirm-page-container-summary.component.js index 3b1ee62c5..38b158fd3 100644 --- a/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-summary/confirm-page-container-summary.component.js +++ b/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-summary/confirm-page-container-summary.component.js @@ -4,7 +4,7 @@ import classnames from 'classnames' import Identicon from '../../../identicon' const ConfirmPageContainerSummary = props => { - const { action, title, subtitle, hideSubtitle, className, identiconAddress, nonce } = props + const { action, title, subtitle, hideSubtitle, className, identiconAddress, nonce, assetImage } = props return ( <div className={classnames('confirm-page-container-summary', className)}> @@ -27,6 +27,7 @@ const ConfirmPageContainerSummary = props => { className="confirm-page-container-summary__identicon" diameter={36} address={identiconAddress} + image={assetImage} /> ) } @@ -51,6 +52,7 @@ ConfirmPageContainerSummary.propTypes = { className: PropTypes.string, identiconAddress: PropTypes.string, nonce: PropTypes.string, + assetImage: PropTypes.string, } export default ConfirmPageContainerSummary diff --git a/ui/app/components/confirm-page-container/confirm-page-container.component.js b/ui/app/components/confirm-page-container/confirm-page-container.component.js index 24ff05353..b1582051e 100644 --- a/ui/app/components/confirm-page-container/confirm-page-container.component.js +++ b/ui/app/components/confirm-page-container/confirm-page-container.component.js @@ -38,6 +38,7 @@ export default class ConfirmPageContainer extends Component { detailsComponent: PropTypes.node, identiconAddress: PropTypes.string, nonce: PropTypes.string, + assetImage: PropTypes.string, summaryComponent: PropTypes.node, warning: PropTypes.string, // Footer @@ -70,8 +71,10 @@ export default class ConfirmPageContainer extends Component { onSubmit, identiconAddress, nonce, + assetImage, warning, } = this.props + const renderAssetImage = contentComponent || (!contentComponent && !identiconAddress) return ( <div className="page-container"> @@ -84,6 +87,7 @@ export default class ConfirmPageContainer extends Component { senderAddress={fromAddress} recipientName={toName} recipientAddress={toAddress} + assetImage={renderAssetImage ? assetImage : undefined} /> </ConfirmPageContainerHeader> { @@ -101,6 +105,7 @@ export default class ConfirmPageContainer extends Component { errorKey={errorKey} identiconAddress={identiconAddress} nonce={nonce} + assetImage={assetImage} warning={warning} /> ) 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 3216d01c3..56cfbccc8 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 @@ -38,6 +38,7 @@ export default class ConfirmTransactionBase extends Component { isTxReprice: PropTypes.bool, methodData: PropTypes.object, nonce: PropTypes.string, + assetImage: PropTypes.string, sendTransaction: PropTypes.func, showCustomizeGasModal: PropTypes.func, showTransactionConfirmedModal: PropTypes.func, @@ -310,6 +311,7 @@ export default class ConfirmTransactionBase extends Component { contentComponent, onEdit, nonce, + assetImage, warning, } = this.props const { submitting, submitError } = this.state @@ -334,6 +336,7 @@ export default class ConfirmTransactionBase extends Component { dataComponent={this.renderData()} contentComponent={contentComponent} nonce={nonce} + assetImage={assetImage} identiconAddress={identiconAddress} errorMessage={errorMessage || submitError} errorKey={propsErrorKey || errorKey} 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 0c0deff18..8f54c8040 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 @@ -52,8 +52,9 @@ const mapStateToProps = (state, props) => { accounts, selectedAddress, selectedAddressTxList, + assetImages, } = metamask - + const assetImage = assetImages[txParamsToAddress] const { balance } = accounts[selectedAddress] const { name: fromName } = identities[selectedAddress] const toAddress = propsToAddress || txParamsToAddress @@ -88,6 +89,7 @@ const mapStateToProps = (state, props) => { conversionRate, transactionStatus, nonce, + assetImage, } } diff --git a/ui/app/components/sender-to-recipient/sender-to-recipient.component.js b/ui/app/components/sender-to-recipient/sender-to-recipient.component.js index 5af4045f5..445a11d8a 100644 --- a/ui/app/components/sender-to-recipient/sender-to-recipient.component.js +++ b/ui/app/components/sender-to-recipient/sender-to-recipient.component.js @@ -20,6 +20,7 @@ export default class SenderToRecipient extends PureComponent { t: PropTypes.func, variant: PropTypes.oneOf([DEFAULT_VARIANT, CARDS_VARIANT]), addressOnly: PropTypes.bool, + assetImage: PropTypes.string, } static defaultProps = { @@ -66,13 +67,14 @@ export default class SenderToRecipient extends PureComponent { } renderRecipientIdenticon () { - const { recipientAddress } = this.props + const { recipientAddress, assetImage } = this.props return !this.props.addressOnly && ( <div className="sender-to-recipient__sender-icon"> <Identicon address={recipientAddress} diameter={24} + image={assetImage} /> </div> ) diff --git a/ui/app/components/transaction-list-item/transaction-list-item.component.js b/ui/app/components/transaction-list-item/transaction-list-item.component.js index d9e63d6e0..4fddd45ef 100644 --- a/ui/app/components/transaction-list-item/transaction-list-item.component.js +++ b/ui/app/components/transaction-list-item/transaction-list-item.component.js @@ -21,6 +21,7 @@ export default class TransactionListItem extends PureComponent { setSelectedToken: PropTypes.func, nonceAndDate: PropTypes.string, token: PropTypes.object, + assetImages: PropTypes.object, } handleClick = () => { @@ -100,6 +101,7 @@ export default class TransactionListItem extends PureComponent { methodData, showRetry, nonceAndDate, + assetImages, } = this.props const { txParams = {} } = transaction @@ -113,6 +115,7 @@ export default class TransactionListItem extends PureComponent { className="transaction-list-item__identicon" address={txParams.to} diameter={34} + image={assetImages[txParams.to]} /> <TransactionAction transaction={transaction} diff --git a/ui/app/components/transaction-list/transaction-list.component.js b/ui/app/components/transaction-list/transaction-list.component.js index e30476d8c..c864fea3b 100644 --- a/ui/app/components/transaction-list/transaction-list.component.js +++ b/ui/app/components/transaction-list/transaction-list.component.js @@ -21,6 +21,7 @@ export default class TransactionList extends PureComponent { transactionToRetry: PropTypes.object, selectedToken: PropTypes.object, updateNetworkNonce: PropTypes.func, + assetImages: PropTypes.object, } componentDidMount () { @@ -45,7 +46,6 @@ export default class TransactionList extends PureComponent { renderTransactions () { const { t } = this.context const { pendingTransactions = [], completedTransactions = [] } = this.props - return ( <div className="transaction-list__transactions"> { @@ -79,7 +79,7 @@ export default class TransactionList extends PureComponent { } renderTransaction (transaction, index) { - const { selectedToken } = this.props + const { selectedToken, assetImages } = this.props return transaction.key === TRANSACTION_TYPE_SHAPESHIFT ? ( @@ -93,6 +93,7 @@ export default class TransactionList extends PureComponent { key={transaction.id} showRetry={this.shouldShowRetry(transaction)} token={selectedToken} + assetImages={assetImages} /> ) } diff --git a/ui/app/components/transaction-list/transaction-list.container.js b/ui/app/components/transaction-list/transaction-list.container.js index 1ec1f9ccf..2e946c67d 100644 --- a/ui/app/components/transaction-list/transaction-list.container.js +++ b/ui/app/components/transaction-list/transaction-list.container.js @@ -7,7 +7,7 @@ import { submittedPendingTransactionsSelector, completedTransactionsSelector, } from '../../selectors/transactions' -import { getSelectedAddress } from '../../selectors' +import { getSelectedAddress, getAssetImages } from '../../selectors' import { selectedTokenSelector } from '../../selectors/tokens' import { getLatestSubmittedTxWithNonce } from '../../helpers/transactions.util' import { updateNetworkNonce } from '../../actions' @@ -23,6 +23,7 @@ const mapStateToProps = state => { transactionToRetry: getLatestSubmittedTxWithNonce(submittedPendingTransactions, networkNonce), selectedToken: selectedTokenSelector(state), selectedAddress: getSelectedAddress(state), + assetImages: getAssetImages(state), } } diff --git a/ui/app/components/transaction-view-balance/transaction-view-balance.component.js b/ui/app/components/transaction-view-balance/transaction-view-balance.component.js index bdc46f714..1b7a29c87 100644 --- a/ui/app/components/transaction-view-balance/transaction-view-balance.component.js +++ b/ui/app/components/transaction-view-balance/transaction-view-balance.component.js @@ -18,6 +18,7 @@ export default class TransactionViewBalance extends PureComponent { history: PropTypes.object, network: PropTypes.string, balance: PropTypes.string, + assetImage: PropTypes.string, } renderBalance () { @@ -75,7 +76,7 @@ export default class TransactionViewBalance extends PureComponent { } render () { - const { network, selectedToken } = this.props + const { network, selectedToken, assetImage } = this.props return ( <div className="transaction-view-balance"> @@ -84,6 +85,7 @@ export default class TransactionViewBalance extends PureComponent { diameter={50} address={selectedToken && selectedToken.address} network={network} + image={assetImage} /> { this.renderBalance() } </div> diff --git a/ui/app/components/transaction-view-balance/transaction-view-balance.container.js b/ui/app/components/transaction-view-balance/transaction-view-balance.container.js index 1d3432b15..30c5cab16 100644 --- a/ui/app/components/transaction-view-balance/transaction-view-balance.container.js +++ b/ui/app/components/transaction-view-balance/transaction-view-balance.container.js @@ -2,7 +2,7 @@ import { connect } from 'react-redux' import { withRouter } from 'react-router-dom' import { compose } from 'recompose' import TransactionViewBalance from './transaction-view-balance.component' -import { getSelectedToken, getSelectedAddress } from '../../selectors' +import { getSelectedToken, getSelectedAddress, getSelectedTokenAssetImage } from '../../selectors' import { showModal } from '../../actions' const mapStateToProps = state => { @@ -15,6 +15,7 @@ const mapStateToProps = state => { selectedToken: getSelectedToken(state), network, balance, + assetImage: getSelectedTokenAssetImage(state), } } |