Add warning when editing a known token with watchAsset API

app/_locales/en/messages.json

@@ -743,6 +743,9 @@
   "knownAddressRecipient": {
     "message": "Known contract address."
   },
+  "knownTokenWarning": {
+    "message": "This action will edit tokens that are already listed in your wallet, which can be used to phish you. Only approve if you are certain that you mean to change what these tokens represent."
+  },
   "invalidAddressRecipientNotEthNetwork": {
     "message": "Not ETH network, set to lowercase"
   },

ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.component.js

@@ -15,6 +15,7 @@ export default class ConfirmAddSuggestedToken extends Component {
     addToken: PropTypes.func,
     pendingTokens: PropTypes.object,
     removeSuggestedTokens: PropTypes.func,
+    tokens: PropTypes.array,
   }
 
   componentDidMount () {
@@ -32,9 +33,10 @@ export default class ConfirmAddSuggestedToken extends Component {
   }
 
   render () {
-    const { addToken, pendingTokens, removeSuggestedTokens, history } = this.props
+    const { addToken, pendingTokens, tokens, removeSuggestedTokens, history } = this.props
     const pendingTokenKey = Object.keys(pendingTokens)[0]
     const pendingToken = pendingTokens[pendingTokenKey]
+    const hasTokenDuplicates = this.checkTokenDuplicates(pendingTokens, tokens);
 
     return (
       <div className="page-container">
@@ -45,6 +47,11 @@ export default class ConfirmAddSuggestedToken extends Component {
           <div className="page-container__subtitle">
             { this.context.t('likeToAddTokens') }
           </div>
+          { hasTokenDuplicates ?
+              <div className="warning">
+                { this.context.t('knownTokenWarning') }
+              </div> : null
+          }
         </div>
         <div className="page-container__content">
           <div className="confirm-add-token">
@@ -118,4 +125,15 @@ export default class ConfirmAddSuggestedToken extends Component {
       </div>
     )
   }
+
+  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;
+  }
+
 }

ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.container.js

@@ -5,11 +5,12 @@ import { withRouter } from 'react-router-dom'
 import { addToken, removeSuggestedTokens } from '../../store/actions'
 
 const mapStateToProps = ({ metamask }) => {
-  const { pendingTokens, suggestedTokens } = metamask
+  const { pendingTokens, suggestedTokens, tokens } = metamask
   const params = { ...pendingTokens, ...suggestedTokens }
 
   return {
     pendingTokens: params,
+    tokens,
   }
 }