@@ -71,6 +88,7 @@ export default class ConfirmAddToken extends Component {
className="confirm-add-token__token-icon"
diameter={48}
address={address}
+ network={network}
/>
{ this.getTokenName(name, symbol) }
diff --git a/old-ui/app/components/confirm-add-token/confirm-add-token.container.js b/old-ui/app/components/confirm-add-token/confirm-add-token.container.js
index 11462e948124..dc1d8bbbaedc 100644
--- a/old-ui/app/components/confirm-add-token/confirm-add-token.container.js
+++ b/old-ui/app/components/confirm-add-token/confirm-add-token.container.js
@@ -4,9 +4,10 @@ import ConfirmAddToken from './confirm-add-token.component'
const { addTokens, clearPendingTokens, goHome, showAddTokenPage } = require('../../../../ui/app/actions')
const mapStateToProps = ({ metamask }) => {
- const { pendingTokens } = metamask
+ const { pendingTokens, network } = metamask
return {
pendingTokens,
+ network,
}
}
diff --git a/old-ui/app/components/identicon.js b/old-ui/app/components/identicon.js
index cb7376147648..54a7b698eabd 100644
--- a/old-ui/app/components/identicon.js
+++ b/old-ui/app/components/identicon.js
@@ -37,7 +37,7 @@ IdenticonComponent.prototype.render = function () {
IdenticonComponent.prototype.componentDidMount = function () {
var props = this.props
- const { address } = props
+ const { address, network } = props
if (!address) return
@@ -46,14 +46,14 @@ IdenticonComponent.prototype.componentDidMount = function () {
var diameter = props.diameter || this.defaultDiameter
if (!isNode) {
- var img = iconFactory.iconForAddress(address, diameter)
+ var img = iconFactory.iconForAddress(address, diameter, network)
container.appendChild(img)
}
}
IdenticonComponent.prototype.componentDidUpdate = function () {
var props = this.props
- const { address } = props
+ const { address, network } = props
if (!address) return
@@ -67,7 +67,7 @@ IdenticonComponent.prototype.componentDidUpdate = function () {
var diameter = props.diameter || this.defaultDiameter
if (!isNode) {
- var img = iconFactory.iconForAddress(address, diameter)
+ var img = iconFactory.iconForAddress(address, diameter, network)
container.appendChild(img)
}
}
diff --git a/old-ui/app/components/token-list.js b/old-ui/app/components/token-list.js
index 9ee1c6e70c25..30a902ca2688 100644
--- a/old-ui/app/components/token-list.js
+++ b/old-ui/app/components/token-list.js
@@ -3,9 +3,38 @@ const h = require('react-hyperscript')
const inherits = require('util').inherits
const TokenTracker = require('eth-token-watcher')
const TokenCell = require('./token-cell.js')
+const connect = require('react-redux').connect
+const selectors = require('../../../ui/app/selectors')
const log = require('loglevel')
-module.exports = TokenList
+function mapStateToProps (state) {
+ return {
+ network: state.metamask.network,
+ tokens: state.metamask.tokens,
+ userAddress: selectors.getSelectedAddress(state),
+ }
+}
+
+const defaultTokens = []
+
+const contractsETH = require('eth-contract-metadata')
+const contractsPOA = require('poa-contract-metadata')
+for (const address in contractsETH) {
+ const contract = contractsETH[address]
+ if (contract.erc20) {
+ contract.address = address
+ defaultTokens.push(contract)
+ }
+}
+for (const address in contractsPOA) {
+ const contract = contractsPOA[address]
+ if (contract.erc20) {
+ contract.address = address
+ defaultTokens.push(contract)
+ }
+}
+
+module.exports = connect(mapStateToProps)(TokenList)
inherits(TokenList, Component)
function TokenList () {
@@ -153,7 +182,7 @@ TokenList.prototype.componentDidMount = function () {
this.createFreshTokenTracker()
}
-TokenList.prototype.createFreshTokenTracker = function (userAddress) {
+TokenList.prototype.createFreshTokenTracker = function () {
if (this.tracker) {
// Clean up old trackers when refreshing:
this.tracker.stop()
@@ -162,8 +191,10 @@ TokenList.prototype.createFreshTokenTracker = function (userAddress) {
}
if (!global.ethereumProvider) return
+ const { userAddress } = this.props
+
this.tracker = new TokenTracker({
- userAddress: userAddress || this.props.userAddress,
+ userAddress,
provider: global.ethereumProvider,
tokens: this.props.tokens,
pollingInterval: 8000,
@@ -188,26 +219,42 @@ TokenList.prototype.createFreshTokenTracker = function (userAddress) {
})
}
-TokenList.prototype.componentWillUpdate = function (nextProps) {
- if (nextProps.network === 'loading') return
- const oldNet = this.props.network
- const newNet = nextProps.network
+TokenList.prototype.componentDidUpdate = function (nextProps) {
+ const {
+ network: oldNet,
+ userAddress: oldAddress,
+ tokens,
+ } = this.props
+ const {
+ network: newNet,
+ userAddress: newAddress,
+ tokens: newTokens,
+ } = nextProps
- const oldAddress = this.props.userAddress
- const newAddress = nextProps.userAddress
+ const isLoading = newNet === 'loading'
+ const missingInfo = !oldNet || !newNet || !oldAddress || !newAddress
+ const sameUserAndNetwork = oldAddress === newAddress && oldNet === newNet
+ const shouldUpdateTokens = isLoading || missingInfo || sameUserAndNetwork
- if (oldNet && newNet && (newNet !== oldNet || newAddress !== oldAddress)) {
- this.setState({ isLoading: true })
- this.createFreshTokenTracker(newAddress)
- }
+ const oldTokensLength = tokens ? tokens.length : 0
+ const tokensLengthUnchanged = oldTokensLength === newTokens.length
+
+ if (tokensLengthUnchanged && shouldUpdateTokens) return
+
+ this.setState({ isLoading: true })
+ this.createFreshTokenTracker()
}
TokenList.prototype.updateBalances = function (tokens) {
- this.setState({ tokens, error: null, isLoading: false })
+ if (!this.tracker.running) {
+ return
+ }
+ this.setState({ tokens, isLoading: false })
}
TokenList.prototype.componentWillUnmount = function () {
if (!this.tracker) return
this.tracker.stop()
+ this.tracker.removeListener('update', this.balanceUpdater)
+ this.tracker.removeListener('error', this.showError)
}
-
diff --git a/old-ui/lib/icon-factory.js b/old-ui/lib/icon-factory.js
index 12533ca448ec..ecebc8b03dc8 100644
--- a/old-ui/lib/icon-factory.js
+++ b/old-ui/lib/icon-factory.js
@@ -1,26 +1,28 @@
var iconFactory
const isValidAddress = require('ethereumjs-util').isValidAddress
const toChecksumAddress = require('ethereumjs-util').toChecksumAddress
-const contractMap = require('eth-contract-metadata')
+const contractMapETH = require('eth-contract-metadata')
+const contractMapPOA = require('poa-contract-metadata')
const colors = require('../../colors')
-module.exports = function (jazzicon) {
+module.exports = function (rockicon) {
if (!iconFactory) {
- iconFactory = new IconFactory(jazzicon)
+ iconFactory = new IconFactory(rockicon)
}
return iconFactory
}
-function IconFactory (jazzicon) {
- jazzicon.setColorsPalette(colors)
- this.jazzicon = jazzicon
+function IconFactory (rockicon) {
+ rockicon.setColorsPalette(colors)
+ this.rockicon = rockicon
this.cache = {}
}
-IconFactory.prototype.iconForAddress = function (address, diameter) {
+IconFactory.prototype.iconForAddress = function (address, diameter, network) {
+ const networkID = parseInt(network)
const addr = toChecksumAddress(address)
- if (iconExistsFor(addr)) {
- return imageElFor(addr)
+ if (iconExistsFor(addr, networkID)) {
+ return imageElFor(addr, networkID)
}
return this.generateIdenticonSvg(address, diameter)
@@ -39,20 +41,24 @@ IconFactory.prototype.generateIdenticonSvg = function (address, diameter) {
// creates a new identicon
IconFactory.prototype.generateNewIdenticon = function (address, diameter) {
var numericRepresentation = jsNumberForAddress(address)
- var identicon = this.jazzicon.generateIdenticon(diameter, numericRepresentation)
+ var identicon = this.rockicon.generateIdenticon(diameter, numericRepresentation)
return identicon
}
// util
-function iconExistsFor (address) {
+function iconExistsFor (address, networkID) {
+ const contractMap = networkID === 1 ? contractMapETH : contractMapPOA
return contractMap[address] && isValidAddress(address) && contractMap[address].logo
}
-function imageElFor (address) {
+function imageElFor (address, networkID) {
+ const contractMap = networkID === 1 ? contractMapETH : contractMapPOA
+ console.log(contractMap)
const contract = contractMap[address]
const fileName = contract.logo
- const path = `images/contract/${fileName}`
+ const imagesFolder = networkID === 1 ? 'images/contract' : 'images/contractPOA'
+ const path = `${imagesFolder}/${fileName}`
const img = document.createElement('img')
img.src = path
img.style.width = '75%'
diff --git a/package-lock.json b/package-lock.json
index 830aff1a2cee..3588fbb206ff 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -23820,6 +23820,10 @@
"integrity": "sha1-HMfCEjA6yr50Jj7DrHgAlYAkLZM=",
"dev": true
},
+ "poa-contract-metadata": {
+ "version": "github:poanetwork/poa-contract-metadata#daee2eab58db1cb2aad50cd58c45374f614f029e",
+ "from": "github:poanetwork/poa-contract-metadata#master"
+ },
"pojo-migrator": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/pojo-migrator/-/pojo-migrator-2.1.0.tgz",
diff --git a/package.json b/package.json
index e9383019dbe0..aae6564a552c 100644
--- a/package.json
+++ b/package.json
@@ -161,6 +161,7 @@
"percentile": "^1.2.0",
"pify": "^3.0.0",
"ping-pong-stream": "^1.0.0",
+ "poa-contract-metadata": "github:poanetwork/poa-contract-metadata#master",
"pojo-migrator": "^2.1.0",
"polyfill-crypto.getrandomvalues": "^1.0.0",
"post-message-stream": "^3.0.0",
@@ -318,7 +319,7 @@
"watchify": "^3.11.0"
},
"engines": {
- "node": "8.11.4",
- "npm": "^6.1.0"
+ "node": "8.12.0",
+ "npm": "^6.4.1"
}
}
diff --git a/ui/lib/icon-factory.js b/ui/lib/icon-factory.js
index a1170bf4d0a1..3b015eb32b09 100644
--- a/ui/lib/icon-factory.js
+++ b/ui/lib/icon-factory.js
@@ -64,4 +64,3 @@ function jsNumberForAddress (address) {
var seed = parseInt(addr, 16)
return seed
}
-