diff --git a/package.json b/package.json
index cbbcd9bd..6abb539c 100644
--- a/package.json
+++ b/package.json
@@ -80,6 +80,7 @@
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-final-form": "^4.1.0",
+ "react-final-form-listeners": "^1.0.2",
"react-hot-loader": "4.8.4",
"react-infinite-scroll-component": "^4.5.2",
"react-redux": "7.0.2",
diff --git a/src/routes/safe/components/Balances/Tokens/screens/AddCustomToken/index.jsx b/src/routes/safe/components/Balances/Tokens/screens/AddCustomToken/index.jsx
index 6ea45555..72b93cf4 100644
--- a/src/routes/safe/components/Balances/Tokens/screens/AddCustomToken/index.jsx
+++ b/src/routes/safe/components/Balances/Tokens/screens/AddCustomToken/index.jsx
@@ -1,6 +1,7 @@
// @flow
import React, { useState } from 'react'
import { List } from 'immutable'
+import { OnChange } from 'react-final-form-listeners'
import { withStyles } from '@material-ui/core/styles'
import Block from '~/components/layout/Block'
import Paragraph from '~/components/layout/Paragraph'
@@ -13,12 +14,10 @@ import Checkbox from '~/components/forms/Checkbox'
import GnoForm from '~/components/forms/GnoForm'
import TextField from '~/components/forms/TextField'
import Hairline from '~/components/layout/Hairline'
-import {
- composeValidators, required, mustBeEthereumAddress, mustBeInteger,
-} from '~/components/forms/validator'
+import { composeValidators, required, mustBeEthereumAddress } from '~/components/forms/validator'
import { type TokenProps } from '~/logic/tokens/store/model/token'
import TokenPlaceholder from '~/routes/safe/components/Balances/assets/token_placeholder.svg'
-import { checkTokenExistence, INITIAL_FORM_STATE } from './validators'
+import { checkTokenExistenceAndSetFields, INITIAL_FORM_STATE } from './validators'
import { styles } from './style'
type Props = {
@@ -68,11 +67,22 @@ const AddCustomToken = (props: Props) => {
name="address"
component={TextField}
type="text"
- validate={composeValidators(required, mustBeEthereumAddress, checkTokenExistence(setFormValue))}
+ validate={composeValidators(
+ required,
+ mustBeEthereumAddress,
+ checkTokenExistenceAndSetFields(setFormValue),
+ )}
placeholder="Token contract address*"
text="Token contract address*"
className={classes.addressInput}
/>
+
+ {(value) => {
+ if (value === '') {
+ setFormValue(INITIAL_FORM_STATE)
+ }
+ }}
+
{
component={TextField}
disabled
type="text"
- validate={composeValidators(required, mustBeInteger)}
placeholder="Token decimals*"
text="Token decimals*"
className={classes.addressInput}
diff --git a/src/routes/safe/components/Balances/Tokens/screens/AddCustomToken/validators.js b/src/routes/safe/components/Balances/Tokens/screens/AddCustomToken/validators.js
index afbece17..bfcd65f9 100644
--- a/src/routes/safe/components/Balances/Tokens/screens/AddCustomToken/validators.js
+++ b/src/routes/safe/components/Balances/Tokens/screens/AddCustomToken/validators.js
@@ -20,11 +20,7 @@ export const simpleMemoize = (fn: Function) => {
}
}
-export const checkTokenExistence = (updateForm: ?Function) => simpleMemoize(async (tokenAddress: string) => {
- if (!tokenAddress && updateForm) {
- updateForm(INITIAL_FORM_STATE)
- }
-
+export const checkTokenExistenceAndSetFields = (updateForm: ?Function) => simpleMemoize(async (tokenAddress: string, anotherArgument, andAnotherone) => {
const relayToken = await fetchToken(tokenAddress)
if (!relayToken.data.count) {
diff --git a/yarn.lock b/yarn.lock
index 19fb50a1..812fc48d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1086,7 +1086,7 @@
dependencies:
regenerator-runtime "^0.12.0"
-"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.3.4", "@babel/runtime@^7.4.2", "@babel/runtime@^7.4.3":
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.1.5", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.3.4", "@babel/runtime@^7.4.2", "@babel/runtime@^7.4.3":
version "7.4.3"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.4.3.tgz#79888e452034223ad9609187a0ad1fe0d2ad4bdc"
integrity sha512-9lsJwJLxDh/T3Q3SZszfWOTkk3pHbkmH+3KY+zwIDmsNlxsumuhS2TH3NIpktU4kNvfzy+k3eLT7aTJSPTo0OA==
@@ -13092,6 +13092,13 @@ react-fast-compare@^2.0.2:
resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-2.0.4.tgz#e84b4d455b0fec113e0402c329352715196f81f9"
integrity sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==
+react-final-form-listeners@^1.0.2:
+ version "1.0.2"
+ resolved "https://registry.yarnpkg.com/react-final-form-listeners/-/react-final-form-listeners-1.0.2.tgz#b52da984300281cf1f69a6412e86df6249e2bf1c"
+ integrity sha512-AaUUHcXRhD3esC80yUfYPI8FJ3TUiMu0f4hk18QL8NMCWjokg6NWS32WkRJsH3bLWDoiy7+uNVOAAyO/XoupyA==
+ dependencies:
+ "@babel/runtime" "^7.1.5"
+
react-final-form@^4.1.0:
version "4.1.0"
resolved "https://registry.yarnpkg.com/react-final-form/-/react-final-form-4.1.0.tgz#4e1b513de164771b2b824f3fb9c0548014255971"