WA-232 Fix Flow errors regarding final form validator Field

src/components/Stepper/index.jsx

@@ -4,7 +4,6 @@ import FormStep from '@material-ui/core/Step'
 import StepLabel from '@material-ui/core/StepLabel'
 import { withStyles } from '@material-ui/core/styles'
 import * as React from 'react'
-import type { FormApi } from 'react-final-form'
 import GnoForm from '~/components/forms/GnoForm'
 import Button from '~/components/layout/Button'
 import Col from '~/components/layout/Col'
@@ -21,7 +20,7 @@ type Props = {
   initialValues?: Object,
   children: React$Node,
   onReset?: () => void,
-  onSubmit: (values: Object, form: FormApi, callback: ?(errors: ?Object) => void) => ?Object | Promise<?Object> | void,
+  onSubmit: (values: Object) => Promise<void>,
 }
 
 type State = {

src/components/forms/GnoForm/index.jsx

@@ -3,12 +3,14 @@ import * as React from 'react'
 import { type FormApi } from 'final-form'
 import { Form } from 'react-final-form'
 
+export type OnSubmit = (
+  values: Object,
+  form: FormApi,
+  callback: ?(errors: ?Object) => ?Object
+) => ?Object | Promise<?Object> | void
+
 type Props = {
-  onSubmit: (
-    values: Object,
-    form: FormApi,
-    callback: ?(errors: ?Object) => ?Object
-  ) => ?Object | Promise<?Object> | void,
+  onSubmit: OnSubmit,
   children: Function,
   padding: number,
   validation?: (values: Object) => Object | Promise<Object>,

src/components/forms/validator.js

@@ -1,7 +1,8 @@
 // @flow
 import { getWeb3 } from '~/wallets/getWeb3'
+import { type FieldValidator } from 'final-form'
 
-type Field = boolean | string
+type Field = boolean | string | null | typeof undefined
 
 export const required = (value: Field) => (value ? undefined : 'Required')
 
@@ -48,7 +49,7 @@ export const ADDRESS_REPEATED_ERROR = 'Address already introduced'
 export const uniqueAddress = (addresses: string[]) => (value: string) =>
   (addresses.includes(value) ? ADDRESS_REPEATED_ERROR : undefined)
 
-export const composeValidators = (...validators: Function[]) => (value: Field) =>
+export const composeValidators = (...validators: Function[]): FieldValidator => (value: Field) =>
   validators.reduce((error, validator) => error || validator(value), undefined)
 
 export const inLimit = (limit: number, base: number, baseText: string) => (value: string) => {

src/routes/open/components/Layout.jsx

@@ -1,6 +1,5 @@
 // @flow
 import * as React from 'react'
-import type { FormApi } from 'react-final-form'
 import Stepper from '~/components/Stepper'
 import Confirmation from '~/routes/open/components/FormConfirmation'
 import Review from '~/routes/open/components/ReviewInformation'
@@ -21,8 +20,7 @@ type Props = {
   userAccount: string,
   safeAddress: string,
   safeTx: string,
-  onCallSafeContractSubmit: (values: Object, form: FormApi, callback: ?(errors: ?Object) => void)
-    => ?Object | Promise<?Object> | void,
+  onCallSafeContractSubmit: (values: Object) => Promise<void>,
 }
 
 const Layout = ({

src/routes/open/components/Layout.stories.js

@@ -26,7 +26,7 @@ storiesOf('Routes /open', module)
     getProviderInfo()
     const provider = 'METAMASK'
     const userAccount = '0x03db1a8b26d08df23337e9276a36b474510f0023'
-    const onCallSafeContractSubmit = async (values: Object) => {
+    const onCallSafeContractSubmit = async (values: Object): Promise<void> => {
       const accounts = getAccountsFrom(values)
       const numConfirmations = getThresholdFrom(values)
       const data = {

src/routes/open/components/SafeForm/Confirmations/index.test.js

@@ -8,7 +8,7 @@ import { getProviderInfo } from '~/wallets/getWeb3'
 import Wrapper from '~/test/utils/Wrapper'
 import { CONFIRMATIONS_ERROR } from '~/routes/open/components/SafeForm'
 
-const obSubmitMock = () => {}
+const onSubmitMock = async (): Promise<void> => {}
 
 describe('React DOM TESTS > Create Safe form', () => {
   let open
@@ -25,7 +25,7 @@ describe('React DOM TESTS > Create Safe form', () => {
           userAccount="foo"
           safeAddress=""
           safeTx=""
-          onCallSafeContractSubmit={obSubmitMock}
+          onCallSafeContractSubmit={onSubmitMock}
         />
       </Wrapper>
     ))