React Custom Hook for data validation

implementuseForm.js

export default function SignUp() {
  
  const { errors, values, handleChange, handleSubmit } = useForm(() => {
         console.log('No errors found')
        console.log('Can implement mutation here')
         
    }, Validate)
  return (
  <form ...>)
  }

useForm.js

import { EventRounded } from '@mui/icons-material';
import { useState, useEffect } from 'react';

const useForm = (callback, validate) => {

  const [values, setValues] = useState({});
  const [errors, setErrors] = useState({});
  const [isSubmitting, setIsSubmitting] = useState(false);

  useEffect(() => {
    if (Object.keys(errors).length === 0 && isSubmitting) {
      callback();
    }
  }, [errors]);

  const handleSubmit = (event) => {
    if (event) event.preventDefault();
    setErrors(validate(values));
    setIsSubmitting(true);
    event.target.reset();
  };

  const handleChange = (event) => {
    // event.persist();
    setValues(values => ({ ...values,     [event.target.name]: event.target.value, [event.target.email]: event.target.value }));
  };

  return {
    handleChange,
    handleSubmit,
    values,
    errors,
  }
};

export default useForm;

validation.js

export default function Validate(values) {
    let errors = {};
    if (!values.email) {
      errors.email = 'Email address is required';
    } else if (!/\S+@\S+\.\S+/.test(values.email)) {
      errors.email = 'Email address is invalid';
    }
    if (!values.name) {
        errors.name = 'Name is required';
      } else if (values.name.length < 3) {
        errors.name = 'Name must be 3 or more characters';
      }
    if (!values.password) {
      errors.password = 'Password is required';
    } else if (values.password.length < 8) {
      errors.password = 'Password must be 8 or more characters';
    }
    return errors;
  };