MetaMask · whymarrh · Jan 23, 2019 · Jan 21, 2019 · Jan 21, 2019 · Jan 21, 2019
@@ -104,6 +104,7 @@
       "amount": "0x0",
       "memo": "",
       "errors": {},
+      "warnings": {},      
       "maxModeOn": false,
       "editingTransactionId": null
     },

@@ -159,7 +159,8 @@
   "send": {
     "fromDropdownOpen": false,
     "toDropdownOpen": false,
-    "errors": {}
+    "errors": {},
+    "warnings": {}
   },
   "confirmTransaction": {
     "txData": {},

@@ -147,6 +147,7 @@
       "amount": "0x1bc16d674ec80000",
       "memo": "",
       "errors": {},
+      "warnings": {},
       "maxModeOn": false,
       "editingTransactionId": null
     },

@@ -105,6 +105,7 @@
       "amount": "0x0",
       "memo": "",
       "errors": {},
+      "warnings": {},
       "maxModeOn": false,
       "editingTransactionId": null
     },

@@ -280,7 +280,8 @@
   "send": {
     "fromDropdownOpen": false,
     "toDropdownOpen": false,
-    "errors": {}
+    "errors": {},
+    "warnings": {}
   },
   "confirmTransaction": {
     "txData": {

@@ -127,6 +127,7 @@
       "amount": "0x1bc16d674ec80000",
       "memo": "",
       "errors": {},
+      "warnings": {},
       "maxModeOn": false,
       "editingTransactionId": null
     },
@@ -160,7 +161,8 @@
   "send": {
     "fromDropdownOpen": false,
     "toDropdownOpen": false,
-    "errors": {}
+    "errors": {},
+    "warnings": {}
   },
   "confirmTransaction": {
     "txData": {},

@@ -106,6 +106,7 @@
       "amount": "0x0",
       "memo": "",
       "errors": {},
+      "warnings": {},
       "maxModeOn": false,
       "editingTransactionId": null
     },
@@ -140,6 +141,7 @@
     "fromDropdownOpen": false,
     "toDropdownOpen": false,
     "errors": {},
+    "warnings": {},
     "gasButtonGroupShown": true
   },
   "confirmTransaction": {

@@ -132,7 +132,8 @@
   "send": {
     "fromDropdownOpen": false,
     "toDropdownOpen": false,
-    "errors": {}
+    "errors": {},
+    "warnings": {}
   },
   "gas": {
     "customData": {

@@ -189,6 +189,7 @@ var actions = {
   UPDATE_SEND_AMOUNT: 'UPDATE_SEND_AMOUNT',
   UPDATE_SEND_MEMO: 'UPDATE_SEND_MEMO',
   UPDATE_SEND_ERRORS: 'UPDATE_SEND_ERRORS',
+  UPDATE_SEND_WARNINGS: 'UPDATE_SEND_WARNINGS',
   UPDATE_MAX_MODE: 'UPDATE_MAX_MODE',
   UPDATE_SEND: 'UPDATE_SEND',
   CLEAR_SEND: 'CLEAR_SEND',
@@ -209,6 +210,7 @@ var actions = {
   setMaxModeTo,
   updateSend,
   updateSendErrors,
+  updateSendWarnings,
   clearSend,
   setSelectedAddress,
   gasLoadingStarted,
@@ -1001,6 +1003,13 @@ function updateSendErrors (errorObject) {
   }
 }
 
+function updateSendWarnings (warningObject) {
+  return {
+    type: actions.UPDATE_SEND_WARNINGS,
+    value: warningObject,
+  }
+}
+
 function setSendTokenBalance (tokenBalance) {
   return {
     type: actions.UPDATE_SEND_TOKEN_BALANCE,

@@ -128,7 +128,7 @@ EnsInput.prototype.componentDidUpdate = function (prevProps, prevState) {
   }
   if (prevState && ensResolution && this.props.onChange &&
       ensResolution !== prevState.ensResolution) {
-    this.props.onChange({ toAddress: ensResolution, nickname, toError: state.toError })
+    this.props.onChange({ toAddress: ensResolution, nickname, toError: state.toError, toWarning: state.toWarning })
   }
 }
 

@@ -0,0 +1 @@
+export { default } from './send-row-warning-message.container'
@@ -0,0 +1,27 @@
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
+
+export default class SendRowWarningMessage extends Component {
+
+  static propTypes = {
+    warnings: PropTypes.object,
+    warningType: PropTypes.string,
+  };
+
+  static contextTypes = {
+    t: PropTypes.func,
+  };
+
+  render () {
+    const { warnings, warningType } = this.props
+
+    const warningMessage = warningType in warnings && warnings[warningType]
+
+    return (
+        warningMessage
+        ? <div className="send-v2__warning">{this.context.t(warningMessage)}</div>
+        : null
+    )
+  }
+
+}
@@ -0,0 +1,12 @@
+import { connect } from 'react-redux'
+import { getSendWarnings } from '../../../send.selectors'
+import SendRowWarningMessage from './send-row-warning-message.component'
+
+export default connect(mapStateToProps)(SendRowWarningMessage)
+
+function mapStateToProps (state, ownProps) {
+  return {
+    warnings: getSendWarnings(state),
+    warningType: ownProps.warningType,
+  }
+}
@@ -0,0 +1,28 @@
+import React from 'react'
+import assert from 'assert'
+import { shallow } from 'enzyme'
+import SendRowWarningMessage from '../send-row-warning-message.component.js'
+
+describe('SendRowWarningMessage Component', function () {
+  let wrapper
+
+  beforeEach(() => {
+    wrapper = shallow(<SendRowWarningMessage
+      warnings={{ warning1: 'abc', warning2: 'def' }}
+      warningType={'warning3'}
+    />, { context: { t: str => str + '_t' } })
+  })
+
+  describe('render', () => {
+    it('should render null if the passed warnings do not contain a warning of warningType', () => {
+      assert.equal(wrapper.find('.send-v2__warning').length, 0)
+      assert.equal(wrapper.html(), null)
+    })
+
+    it('should render a warning message if the passed warnings contain a warning of warningType', () => {
+      wrapper.setProps({ warnings: { warning1: 'abc', warning2: 'def', warning3: 'xyz' } })
+      assert.equal(wrapper.find('.send-v2__warning').length, 1)
+      assert.equal(wrapper.find('.send-v2__warning').text(), 'xyz_t')
+    })
+  })
+})
@@ -0,0 +1,28 @@
+import assert from 'assert'
+import proxyquire from 'proxyquire'
+
+let mapStateToProps
+
+proxyquire('../send-row-warning-message.container.js', {
+  'react-redux': {
+    connect: (ms, md) => {
+      mapStateToProps = ms
+      return () => ({})
+    },
+  },
+  '../../../send.selectors': { getSendWarnings: (s) => `mockWarnings:${s}` },
+})
+
+describe('send-row-warning-message container', () => {
+
+  describe('mapStateToProps()', () => {
+
+    it('should map the correct properties to props', () => {
+      assert.deepEqual(mapStateToProps('mockState', { warningType: 'someType' }), {
+        warnings: 'mockWarnings:mockState',
+        warningType: 'someType' })
+    })
+
+  })
+
+})
@@ -1,6 +1,7 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 import SendRowErrorMessage from './send-row-error-message/'
+import SendRowWarningMessage from './send-row-warning-message/'
 
 export default class SendRowWrapper extends Component {
 
@@ -9,6 +10,8 @@ export default class SendRowWrapper extends Component {
     errorType: PropTypes.string,
     label: PropTypes.string,
     showError: PropTypes.bool,
+    showWarning: PropTypes.bool,
+    warningType: PropTypes.string,
   };
 
   static contextTypes = {
@@ -21,8 +24,9 @@ export default class SendRowWrapper extends Component {
       errorType = '',
       label,
       showError = false,
+      showWarning = false,
+      warningType = '',
     } = this.props
-
     const formField = Array.isArray(children) ? children[1] || children[0] : children
     const customLabelContent = children.length > 1 ? children[0] : null
 
@@ -31,6 +35,7 @@ export default class SendRowWrapper extends Component {
         <div className="send-v2__form-label">
           {label}
           {showError && <SendRowErrorMessage errorType={errorType}/>}
+          {!showError && showWarning && <SendRowWarningMessage warningType={warningType} />}
           {customLabelContent}
         </div>
         <div className="send-v2__form-field">

@@ -2,14 +2,15 @@ import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 import SendRowWrapper from '../send-row-wrapper/'
 import EnsInput from '../../../ens-input'
-import { getToErrorObject } from './send-to-row.utils.js'
+import { getToErrorObject, getToWarningObject } from './send-to-row.utils.js'
 
 export default class SendToRow extends Component {
 
   static propTypes = {
     closeToDropdown: PropTypes.func,
     hasHexData: PropTypes.bool.isRequired,
     inError: PropTypes.bool,
+    inWarning: PropTypes.bool,
     network: PropTypes.string,
     openToDropdown: PropTypes.func,
     selectedToken: PropTypes.object,
@@ -20,18 +21,21 @@ export default class SendToRow extends Component {
     updateGas: PropTypes.func,
     updateSendTo: PropTypes.func,
     updateSendToError: PropTypes.func,
+    updateSendToWarning: PropTypes.func,
     scanQrCode: PropTypes.func,
   }
 
   static contextTypes = {
     t: PropTypes.func,
   }
 
-  handleToChange (to, nickname = '', toError) {
-    const { hasHexData, updateSendTo, updateSendToError, updateGas, tokens, selectedToken } = this.props
-    const toErrorObject = getToErrorObject(to, toError, hasHexData, tokens, selectedToken)
+  handleToChange (to, nickname = '', toError, toWarning) {
+    const { hasHexData, updateSendTo, updateSendToError, updateGas, tokens, selectedToken, updateSendToWarning } = this.props
+    const toErrorObject = getToErrorObject(to, toError, hasHexData)
+    const toWarningObject = getToWarningObject(to, toWarning, tokens, selectedToken)
     updateSendTo(to, nickname)
     updateSendToError(toErrorObject)
+    updateSendToWarning(toWarningObject)
     if (toErrorObject.to === null) {
       updateGas({ to })
     }
@@ -41,6 +45,7 @@ export default class SendToRow extends Component {
     const {
       closeToDropdown,
       inError,
+      inWarning,
       network,
       openToDropdown,
       to,
@@ -53,7 +58,9 @@ export default class SendToRow extends Component {
         errorType={'to'}
         label={`${this.context.t('to')}: `}
         showError={inError}
-      >
+        showWarning={inWarning}
+        warningType={'to'}
+        >
         <EnsInput
           scanQrCode={_ => this.props.scanQrCode()}
           accounts={toAccounts}
@@ -62,7 +69,7 @@ export default class SendToRow extends Component {
           inError={inError}
           name={'address'}
           network={network}
-          onChange={({ toAddress, nickname, toError }) => this.handleToChange(toAddress, nickname, toError)}
+          onChange={({ toAddress, nickname, toError, toWarning }) => this.handleToChange(toAddress, nickname, toError, toWarning)}
           openDropdown={() => openToDropdown()}
           placeholder={this.context.t('recipientAddress')}
           to={to}

@@ -10,12 +10,14 @@ import {
     getToDropdownOpen,
     getTokens,
     sendToIsInError,
+    sendToIsInWarning,
 } from './send-to-row.selectors.js'
 import {
     updateSendTo,
 } from '../../../../actions'
 import {
   updateSendErrors,
+  updateSendWarnings,
   openToDropdown,
   closeToDropdown,
 } from '../../../../ducks/send.duck'
@@ -27,6 +29,7 @@ function mapStateToProps (state) {
   return {
     hasHexData: Boolean(getSendHexData(state)),
     inError: sendToIsInError(state),
+    inWarning: sendToIsInWarning(state),
     network: getCurrentNetwork(state),
     selectedToken: getSelectedToken(state),
     to: getSendTo(state),
@@ -44,5 +47,8 @@ function mapDispatchToProps (dispatch) {
     updateSendToError: (toErrorObject) => {
         dispatch(updateSendErrors(toErrorObject))
     },
+    updateSendToWarning: (toWarningObject) => {
+      dispatch(updateSendWarnings(toWarningObject))
+  },
   }
 }
@@ -2,6 +2,7 @@ const selectors = {
   getToDropdownOpen,
   getTokens,
   sendToIsInError,
+  sendToIsInWarning,
 }
 
 module.exports = selectors
@@ -14,6 +15,10 @@ function sendToIsInError (state) {
     return Boolean(state.send.errors.to)
 }
 
+function sendToIsInWarning (state) {
+  return Boolean(state.send.warnings.to)
+}
+
 function getTokens (state) {
   return state.metamask.tokens
 }
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export { default } from './send-row-warning-message.container'