From 07cb6adc314e645cc0429c696afab9738673a729 Mon Sep 17 00:00:00 2001
From: Esteban MIno <efmino@uc.cl>
Date: Wed, 29 Aug 2018 23:13:25 -0300
Subject: fix images for watched tokens

---
 .../confirm-page-container-content.component.js                   | 3 +++
 .../confirm-page-container-summary.component.js                   | 4 +++-
 .../confirm-page-container/confirm-page-container.component.js    | 3 +++
 .../confirm-transaction-base.component.js                         | 3 +++
 .../confirm-transaction-base.container.js                         | 4 +++-
 .../transaction-view-balance.component.js                         | 4 +++-
 .../transaction-view-balance.container.js                         | 3 ++-
 ui/app/selectors.js                                               | 8 ++++++++
 8 files changed, 28 insertions(+), 4 deletions(-)

(limited to 'ui')

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..85b168060 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,6 +71,7 @@ export default class ConfirmPageContainer extends Component {
       onSubmit,
       identiconAddress,
       nonce,
+      assetImage,
       warning,
     } = this.props
 
@@ -101,6 +103,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/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),
   }
 }
 
diff --git a/ui/app/selectors.js b/ui/app/selectors.js
index 1d5f4d4cb..484705b1f 100644
--- a/ui/app/selectors.js
+++ b/ui/app/selectors.js
@@ -14,6 +14,7 @@ const selectors = {
   getSelectedAccount,
   getSelectedToken,
   getSelectedTokenExchangeRate,
+  getSelectedTokenAssetImage,
   getTokenExchangeRate,
   conversionRateSelector,
   transactionsSelector,
@@ -71,6 +72,13 @@ 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 getTokenExchangeRate (state, address) {
   const contractExchangeRates = state.metamask.contractExchangeRates
   return contractExchangeRates[address] || 0
-- 
cgit v1.2.3


From 208312b239355194de13989a3ede57e8d7393949 Mon Sep 17 00:00:00 2001
From: Esteban MIno <efmino@uc.cl>
Date: Thu, 30 Aug 2018 12:59:44 -0300
Subject: fix watched asset image rendering on confirm transaction header

---
 .../confirm-page-container/confirm-page-container.component.js        | 2 ++
 .../components/sender-to-recipient/sender-to-recipient.component.js   | 4 +++-
 2 files changed, 5 insertions(+), 1 deletion(-)

(limited to 'ui')

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 85b168060..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
@@ -74,6 +74,7 @@ export default class ConfirmPageContainer extends Component {
       assetImage,
       warning,
     } = this.props
+    const renderAssetImage = contentComponent || (!contentComponent && !identiconAddress)
 
     return (
       <div className="page-container">
@@ -86,6 +87,7 @@ export default class ConfirmPageContainer extends Component {
             senderAddress={fromAddress}
             recipientName={toName}
             recipientAddress={toAddress}
+            assetImage={renderAssetImage ? assetImage : undefined}
           />
         </ConfirmPageContainerHeader>
         {
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>
     )
-- 
cgit v1.2.3


From c8e5068537b6f0fa0f68752f246058d2c24cb4b8 Mon Sep 17 00:00:00 2001
From: Esteban MIno <efmino@uc.cl>
Date: Thu, 30 Aug 2018 13:51:57 -0300
Subject: fix watched tokens images showing in tx list

---
 .../transaction-list-item/transaction-list-item.component.js      | 3 +++
 ui/app/components/transaction-list/transaction-list.component.js  | 8 +++++---
 ui/app/components/transaction-list/transaction-list.container.js  | 3 ++-
 ui/app/selectors.js                                               | 6 ++++++
 4 files changed, 16 insertions(+), 4 deletions(-)

(limited to 'ui')

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..79d9d1445 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 () {
@@ -44,8 +45,8 @@ export default class TransactionList extends PureComponent {
 
   renderTransactions () {
     const { t } = this.context
-    const { pendingTransactions = [], completedTransactions = [] } = this.props
-
+    const { pendingTransactions = [], completedTransactions = [], assetImages } = this.props
+    console.log('REMDERING FROM TX LIST', assetImages)
     return (
       <div className="transaction-list__transactions">
         {
@@ -79,7 +80,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 +94,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/selectors.js b/ui/app/selectors.js
index 484705b1f..18d6709f7 100644
--- a/ui/app/selectors.js
+++ b/ui/app/selectors.js
@@ -15,6 +15,7 @@ const selectors = {
   getSelectedToken,
   getSelectedTokenExchangeRate,
   getSelectedTokenAssetImage,
+  getAssetImages,
   getTokenExchangeRate,
   conversionRateSelector,
   transactionsSelector,
@@ -79,6 +80,11 @@ function getSelectedTokenAssetImage (state) {
   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
-- 
cgit v1.2.3


From 63397047cf8ec1941dfebcec12b8d02dcb6508f2 Mon Sep 17 00:00:00 2001
From: Esteban MIno <efmino@uc.cl>
Date: Thu, 30 Aug 2018 15:09:59 -0300
Subject: fix integration test for asset images selectors

---
 ui/app/selectors.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'ui')

diff --git a/ui/app/selectors.js b/ui/app/selectors.js
index 18d6709f7..fb4517628 100644
--- a/ui/app/selectors.js
+++ b/ui/app/selectors.js
@@ -74,14 +74,14 @@ function getSelectedTokenExchangeRate (state) {
 }
 
 function getSelectedTokenAssetImage (state) {
-  const assetImages = state.metamask.assetImages
+  const assetImages = state.metamask.assetImages || {}
   const selectedToken = getSelectedToken(state) || {}
   const { address } = selectedToken
   return assetImages[address]
 }
 
 function getAssetImages (state) {
-  const assetImages = state.metamask.assetImages
+  const assetImages = state.metamask.assetImages || {}
   return assetImages
 }
 
-- 
cgit v1.2.3


From 165a966a2a0c1a6eb03b7eb53fd0824f4437200a Mon Sep 17 00:00:00 2001
From: Esteban MIno <efmino@uc.cl>
Date: Thu, 30 Aug 2018 17:19:10 -0300
Subject: balance components using selectors

---
 ui/app/components/balance-component.js                           | 7 ++++---
 ui/app/components/transaction-list/transaction-list.component.js | 3 +--
 2 files changed, 5 insertions(+), 5 deletions(-)

(limited to 'ui')

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/transaction-list/transaction-list.component.js b/ui/app/components/transaction-list/transaction-list.component.js
index 79d9d1445..c864fea3b 100644
--- a/ui/app/components/transaction-list/transaction-list.component.js
+++ b/ui/app/components/transaction-list/transaction-list.component.js
@@ -45,8 +45,7 @@ export default class TransactionList extends PureComponent {
 
   renderTransactions () {
     const { t } = this.context
-    const { pendingTransactions = [], completedTransactions = [], assetImages } = this.props
-    console.log('REMDERING FROM TX LIST', assetImages)
+    const { pendingTransactions = [], completedTransactions = [] } = this.props
     return (
       <div className="transaction-list__transactions">
         {
-- 
cgit v1.2.3