Add AddressInput component in send custom tx

src/components/forms/validator.js

@@ -22,7 +22,7 @@ export const required = simpleMemoize((value: Field) => (value ? undefined : 'Re
 
 export const mustBeInteger = (value: string) => (!Number.isInteger(Number(value)) || value.includes('.') ? 'Must be an integer' : undefined)
 
-export const mustBeFloat = (value: number) => (Number.isNaN(Number(value)) ? 'Must be a number' : undefined)
+export const mustBeFloat = (value: number) => (value && Number.isNaN(Number(value)) ? 'Must be a number' : undefined)
 
 export const greaterThan = (min: number) => (value: string) => {
   if (Number.isNaN(Number(value)) || Number.parseFloat(value) > Number(min)) {

src/routes/safe/components/Balances/SendModal/screens/SendCustomTx/index.jsx

@@ -7,6 +7,7 @@ import IconButton from '@material-ui/core/IconButton'
 import Paragraph from '~/components/layout/Paragraph'
 import Row from '~/components/layout/Row'
 import GnoForm from '~/components/forms/GnoForm'
+import AddressInput from '~/components/forms/AddressInput'
 import Col from '~/components/layout/Col'
 import Button from '~/components/layout/Button'
 import Block from '~/components/layout/Block'
@@ -17,8 +18,6 @@ import TextField from '~/components/forms/TextField'
 import TextareaField from '~/components/forms/TextareaField'
 import {
   composeValidators,
-  required,
-  mustBeEthereumAddress,
   mustBeFloat,
   maxValue,
   greaterThan,
@@ -48,13 +47,18 @@ const SendCustomTx = ({
   onSubmit,
   initialValues,
 }: Props) => {
-  const handleSubmit = (values) => {
+  const handleSubmit = (values: Object) => {
+    if (values.data || values.value) {
       onSubmit(values)
     }
+  }
 
   const formMutators = {
     setMax: (args, state, utils) => {
-      utils.changeValue(state, 'amount', () => ethBalance)
+      utils.changeValue(state, 'value', () => ethBalance)
+    },
+    setRecipient: (args, state, utils) => {
+      utils.changeValue(state, 'recipientAddress', () => args[0])
     },
   }
 
@@ -88,14 +92,13 @@ const SendCustomTx = ({
               <>
                 <Row margin="md">
                   <Col xs={12}>
-                    <Field
+                    <AddressInput
                       name="recipientAddress"
                       component={TextField}
-                      type="text"
-                      validate={composeValidators(required, mustBeEthereumAddress)}
                       placeholder="Recipient*"
                       text="Recipient*"
                       className={classes.addressInput}
+                      fieldMutator={mutators.setRecipient}
                     />
                   </Col>
                 </Row>
@@ -112,7 +115,7 @@ const SendCustomTx = ({
                 <Row margin="md">
                   <Col>
                     <Field
-                      name="amount"
+                      name="value"
                       component={TextField}
                       type="text"
                       validate={composeValidators(