- implementing hobby, language and reference sections

- dynamic template selection

src/modals/sections/CertificateModal.js

@@ -1,9 +1,9 @@
 import { Formik } from 'formik';
-import { get } from 'lodash';
 import React from 'react';
 import * as Yup from 'yup';
 import Input from '../../components/shared/Input';
 import ModalEvents from '../../constants/ModalEvents';
+import { getFieldProps } from '../../utils';
 import DataModal from '../DataModal';
 
 const initialValues = {
@@ -13,7 +13,7 @@ const initialValues = {
   summary: '',
 };
 
-const validationSchema = Yup.object().shape({
+const schema = Yup.object().shape({
   title: Yup.string().required('This is a required field.'),
   issuer: Yup.string().required('This is a required field.'),
   date: Yup.date().max(new Date()),
@@ -21,18 +21,11 @@ const validationSchema = Yup.object().shape({
 });
 
 const CertificateModal = () => {
-  const getFieldProps = (formik, name) => ({
-    touched: get(formik, `touched.${name}`, false),
-    error: get(formik, `errors.${name}`, ''),
-    isRequired: get(validationSchema, `fields.${name}._exclusive.required`),
-    ...formik.getFieldProps(name),
-  });
-
   return (
     <Formik
       validateOnBlur
       initialValues={initialValues}
-      validationSchema={validationSchema}
+      validationSchema={schema}
     >
       {(formik) => (
         <DataModal
@@ -45,26 +38,26 @@ const CertificateModal = () => {
               label="Title"
               className="col-span-2"
               placeholder="CCNP"
-              {...getFieldProps(formik, 'title')}
+              {...getFieldProps(formik, schema, 'title')}
             />
 
             <Input
               label="Issuer"
               placeholder="Cisco Systems"
-              {...getFieldProps(formik, 'issuer')}
+              {...getFieldProps(formik, schema, 'issuer')}
             />
 
             <Input
               type="date"
               label="Date"
-              {...getFieldProps(formik, 'date')}
+              {...getFieldProps(formik, schema, 'date')}
             />
 
             <Input
               type="textarea"
               label="Summary"
               className="col-span-2"
-              {...getFieldProps(formik, 'summary')}
+              {...getFieldProps(formik, schema, 'summary')}
             />
           </div>
         </DataModal>