import React, { useEffect, useState } from 'react';
import PropTypes from 'prop-types';
import flattenObject from 'flat';

export const FormContext = React.createContext();

const FormScreen = ({ form, children, onSubmit }) => {
  const [isMounted, setIsMounted] = useState(false);

  const { getFieldsError, validateFields } = form;

  useEffect(() => {
    setIsMounted(true);
    validateFields();
  }, [validateFields]);

  function handleSubmit(e, additionalData) {
    e && e.preventDefault();

    validateFields((err, values) => {
      if (!err) {
        onSubmit(values, additionalData);
      }
    });
  }

  function hasErrors() {
    const errors = flattenObject(getFieldsError());
    return Object.keys(errors).some(field => errors[field]);
  }

  return (
    <FormContext.Provider value={form}>
      {children({
        hasErrors: isMounted ? hasErrors() : true,
        handleSubmit,
      })}
    </FormContext.Provider>
  );
};

FormScreen.propTypes = {
  form: PropTypes.object.isRequired,
  children: PropTypes.func.isRequired,
  onSubmit: PropTypes.func.isRequired,
};

export default FormScreen;

@@ -615,24 +615,21 @@
 %0A  %7D%0A%0A  
-function
+const
  hasErro
@@ -634,32 +634,31 @@
 rors
-() %7B%0A    const errors = 
+ = () =%3E Object.values(
 flat
@@ -688,74 +688,31 @@
 r())
-;%0A    return Object.keys(errors).some(field =%3E errors%5Bfield%5D);%0A  %7D
+).some(error =%3E error);
 %0A%0A  

simplify the hasErrors method