Allow adding 0 balance tokens in old ui and editing custom token info in new (#3395)

* Shows tokens with 0 balance in old ui; goHome after adding tokens.

* Allow users to edit custom token info when not autofilled. (New UI add token screen).

old-ui/app/add-token.js

@@ -156,6 +156,9 @@ AddTokenScreen.prototype.render = function () {
 
               const { address, symbol, decimals } = this.state
               this.props.dispatch(actions.addToken(address.trim(), symbol.trim(), decimals))
+                .then(() => {
+                  this.props.dispatch(actions.goHome())
+                })
             },
           }, 'Add'),
         ]),

old-ui/app/components/token-list.js

@@ -194,10 +194,7 @@ TokenList.prototype.componentWillUpdate = function (nextProps) {
 }
 
 TokenList.prototype.updateBalances = function (tokens) {
-  const heldTokens = tokens.filter(token => {
+  this.setState({ tokens, isLoading: false })
-    return token.balance !== '0' && token.string !== '0.000'
-  })
-  this.setState({ tokens: heldTokens, isLoading: false })
 }
 
 TokenList.prototype.componentWillUnmount = function () {

ui/app/add-token.js

@@ -52,13 +52,16 @@ function AddTokenScreen () {
     isShowingConfirmation: false,
     customAddress: '',
     customSymbol: '',
-    customDecimals: 0,
+    customDecimals: null,
     searchQuery: '',
     isCollapsed: true,
     selectedTokens: {},
     errors: {},
+    autoFilled: false,
   }
   this.tokenAddressDidChange = this.tokenAddressDidChange.bind(this)
+  this.tokenSymbolDidChange = this.tokenSymbolDidChange.bind(this)
+  this.tokenDecimalsDidChange = this.tokenDecimalsDidChange.bind(this)
   this.onNext = this.onNext.bind(this)
   Component.call(this)
 }
@@ -103,6 +106,16 @@ AddTokenScreen.prototype.tokenAddressDidChange = function (e) {
   }
 }
 
+AddTokenScreen.prototype.tokenSymbolDidChange = function (e) {
+  const customSymbol = e.target.value.trim()
+  this.setState({ customSymbol })
+}
+
+AddTokenScreen.prototype.tokenDecimalsDidChange = function (e) {
+  const customDecimals = e.target.value.trim()
+  this.setState({ customDecimals })
+}
+
 AddTokenScreen.prototype.checkExistingAddresses = function (address) {
   if (!address) return false
   const tokensList = this.props.tokens
@@ -125,7 +138,7 @@ AddTokenScreen.prototype.validate = function () {
       errors.customAddress = 'Address is invalid. '
     }
 
-    const validDecimals = customDecimals >= 0 && customDecimals < 36
+    const validDecimals = customDecimals !== null && customDecimals >= 0 && customDecimals < 36
     if (!validDecimals) {
       errors.customDecimals = 'Decimals must be at least 0, and not over 36.'
     }
@@ -166,12 +179,13 @@ AddTokenScreen.prototype.attemptToAutoFillTokenParams = async function (address)
     this.setState({
       customSymbol: symbol,
       customDecimals: decimals.toString(),
+      autoFilled: true,
     })
   }
 }
 
 AddTokenScreen.prototype.renderCustomForm = function () {
-  const { customAddress, customSymbol, customDecimals, errors } = this.state
+  const { autoFilled, customAddress, customSymbol, customDecimals, errors } = this.state
 
   return !this.state.isCollapsed && (
     h('div.add-token__add-custom-form', [
@@ -196,8 +210,9 @@ AddTokenScreen.prototype.renderCustomForm = function () {
         h('div.add-token__add-custom-label', 'Token Symbol'),
         h('input.add-token__add-custom-input', {
           type: 'text',
+          onChange: this.tokenSymbolDidChange,
           value: customSymbol,
-          disabled: true,
+          disabled: autoFilled,
         }),
         h('div.add-token__add-custom-error-message', errors.customSymbol),
       ]),
@@ -209,8 +224,9 @@ AddTokenScreen.prototype.renderCustomForm = function () {
         h('div.add-token__add-custom-label', 'Decimals of Precision'),
         h('input.add-token__add-custom-input', {
           type: 'number',
+          onChange: this.tokenDecimalsDidChange,
           value: customDecimals,
-          disabled: true,
+          disabled: autoFilled,
         }),
         h('div.add-token__add-custom-error-message', errors.customDecimals),
       ]),