import { HelperText, TextInput } from 'react-native-paper'
import * as React from 'react'
import { FieldProps } from 'formik'

interface IProps extends FieldProps {
    label: string
    id: string
}

export const InputText: React.FunctionComponent<IProps> = (props) => {
    const {
        field,
        form,
    } = props
    const { handleChange, setFieldTouched, isSubmitting, errors } = form
    const name = field.name
    return (
        <>
            <TextInput
                mode={'outlined'}
                {...field}
                {...props}
                onChangeText={handleChange(name)}
                onBlur={() => setFieldTouched(name)}
                error={!!errors[name]}
                disabled={isSubmitting}
            />
            <HelperText type="error" visible={!!errors[name]}>
                {errors[name]}
            </HelperText>
        </>
    )
}