import React, { Component } from 'react' import PropTypes from 'prop-types' import Button from '../../components/ui/button' import Identicon from '../../components/ui/identicon' import TokenBalance from '../../components/ui/token-balance' import { getEnvironmentType } from '../../../../app/scripts/lib/util' import { ENVIRONMENT_TYPE_NOTIFICATION } from '../../../../app/scripts/lib/enums' export default class ConfirmAddSuggestedToken extends Component { static contextTypes = { t: PropTypes.func, trackEvent: PropTypes.func, } static propTypes = { history: PropTypes.object, addToken: PropTypes.func, mostRecentOverviewPage: PropTypes.string.isRequired, pendingTokens: PropTypes.object, removeSuggestedTokens: PropTypes.func, tokens: PropTypes.array, } componentDidMount() { this._checkPendingTokens() } componentDidUpdate() { this._checkPendingTokens() } _checkPendingTokens() { const { mostRecentOverviewPage, pendingTokens = {}, history } = this.props if (Object.keys(pendingTokens).length > 0) { return } if (getEnvironmentType() === ENVIRONMENT_TYPE_NOTIFICATION) { global.platform.closeCurrentWindow() } else { history.push(mostRecentOverviewPage) } } getTokenName(name, symbol) { return typeof name === 'undefined' ? symbol : `${name} (${symbol})` } render() { const { addToken, pendingTokens, tokens, removeSuggestedTokens, history, mostRecentOverviewPage, } = this.props const pendingTokenKey = Object.keys(pendingTokens)[0] const pendingToken = pendingTokens[pendingTokenKey] const hasTokenDuplicates = this.checkTokenDuplicates(pendingTokens, tokens) const reusesName = this.checkNameReuse(pendingTokens, tokens) return (
{this.context.t('addSuggestedTokens')}
{this.context.t('likeToAddTokens')}
{hasTokenDuplicates ? (
{this.context.t('knownTokenWarning')}
) : null} {reusesName ? (
{this.context.t('reusedTokenNameWarning')}
) : null}
{this.context.t('token')}
{this.context.t('balance')}
{Object.entries(pendingTokens).map(([address, token]) => { const { name, symbol, image } = token return (
{this.getTokenName(name, symbol)}
) })}
) } checkTokenDuplicates(pendingTokens, tokens) { const pending = Object.keys(pendingTokens) const existing = tokens.map((token) => token.address) const dupes = pending.filter((proposed) => { return existing.includes(proposed) }) return dupes.length > 0 } /** * Returns true if any pendingTokens both: * - Share a symbol with an existing `tokens` member. * - Does not share an address with that same `tokens` member. * This should be flagged as possibly deceptive or confusing. */ checkNameReuse(pendingTokens, tokens) { const duplicates = Object.keys(pendingTokens) .map((addr) => pendingTokens[addr]) .filter((token) => { const dupes = tokens .filter((old) => old.symbol === token.symbol) .filter((old) => old.address !== token.address) return dupes.length > 0 }) return duplicates.length > 0 } }