Как перейти от Fomik к Formik HOC?

Question

[Zombie42679]

Изучаю React и встал вопрос создания форм, использую Formik, но не очень хочется дублировать код, используя обертку , насколько я знаю, можно создать HOC и в неё кидать любую форму, но у меня получается какой-то бред, может кто-то показать на простом примере ниже реализацию через HOC, буду очень благодарен

import React from 'react';
import { Formik, Form, Field, ErrorMessage } from 'formik';
import * as Yup from "yup";

const schema = Yup.object().shape({
  email: Yup.string().email('Введите верный mail').required('Поле не должно быть пустым'),
  password: Yup.string().required('Поле пароль не заполнено')
})

const LoginForm = (props) => {
  return (

    <div>
      <Formik
        initialValues={{ email: '', password: '' }}

        validationSchema={schema}

        onSubmit={(values, { setSubmitting }) => {
          console.log(values)
          setTimeout(() => {setSubmitting(false)}, 2000)
        }}
      >
        {({ isSubmitting, handleSubmit, errors, touched  }) => (
          <Form onSubmit={handleSubmit}>
            <Field type="email" name="email" />
            <ErrorMessage name="email" component="div" />
            <Field type="password" name="password" />
            <ErrorMessage name="password" component="div" />
            <button disabled={isSubmitting}>
              Отправить
            </button>
          </Form>
        )}
      </Formik>
    </div>
  )
}



const Login = (props) => {
  return (
    <div>
      <h1>Login</h1>
      <LoginForm />
    </div>
  )
}

export default Login;