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

Merge pull request #5167 from MetaMask/fix-watcAsset-images

Browse Source 
Fix images for watched tokens
This commit is contained in:
Dan Finlay 2018-09-04 12:56:56 -07:00 committed by GitHub
commit 5043451356
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
16 changed files with 54 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
development/states/send-edit.json
View File

@ -22,6 +22,7 @@
"name": "Send Account 4"
}
},
"assetImages": {},
"unapprovedTxs": {},
"currentCurrency": "USD",
"conversionRate": 1200.88200327,

1
development/states/send-new-ui.json
View File

@ -61,6 +61,7 @@
"name": "Address Book Account 1"
}
],
"assetImages": {},
"tokens": [],
"transactions": {},
"selectedAddressTxList": [],

1
development/states/send.json
View File

@ -21,6 +21,7 @@
"name": "Account 4"
}
},
"assetImages": {},
"unapprovedTxs": {},
"currentCurrency": "USD",
"conversionRate": 16.88200327,

7
ui/app/components/balance-component.js
View File

@ -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),
}
}

3
ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js
View File

@ -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}
/>
)
}

4
ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-summary/confirm-page-container-summary.component.js
View File

@ -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

5
ui/app/components/confirm-page-container/confirm-page-container.component.js
View File

@ -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}
/>
)

3
ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.component.js
View File

@ -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}

4
ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.container.js
View File

@ -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,
}
}

4
ui/app/components/sender-to-recipient/sender-to-recipient.component.js
View File

@ -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>
)

3
ui/app/components/transaction-list-item/transaction-list-item.component.js
View File

@ -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}

5
ui/app/components/transaction-list/transaction-list.component.js
View File

@ -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}
/>
)
}

3
ui/app/components/transaction-list/transaction-list.container.js
View File

@ -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),
}
}

4
ui/app/components/transaction-view-balance/transaction-view-balance.component.js
View File

@ -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>

3
ui/app/components/transaction-view-balance/transaction-view-balance.container.js
View File

@ -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),
}
}

14
ui/app/selectors.js
View File

@ -14,6 +14,8 @@ const selectors = {
getSelectedAccount,
getSelectedToken,
getSelectedTokenExchangeRate,
getSelectedTokenAssetImage,
getAssetImages,
getTokenExchangeRate,
conversionRateSelector,
transactionsSelector,
@ -71,6 +73,18 @@ function getSelectedTokenExchangeRate (state) {
return contractExchangeRates[address] || 0
}
function getSelectedTokenAssetImage (state) {
const assetImages = state.metamask.assetImages || {}
const selectedToken = getSelectedToken(state) || {}
const { address } = selectedToken
return assetImages[address]
}
function getAssetImages (state) {
const assetImages = state.metamask.assetImages || {}
return assetImages
}
function getTokenExchangeRate (state, address) {
const contractExchangeRates = state.metamask.contractExchangeRates
return contractExchangeRates[address] || 0