Add titles to form data and display them dynamically

Incorporated 'title' property into form data objects for dynamic rendering in the GenericForm component. This enhancement facilitates the use of specific titles for different forms, improving readability and user experience.

src/components/form/data/apply.tsx

@@ -202,5 +202,6 @@ export const apply: FormData = {
 
         other: Yup.string()
                     .max(2000, 'Please provide at most 2000 characters')
-    })
+    }),
+    title: "Staff Application"
 };

src/components/form/data/contact.tsx

@@ -47,5 +47,6 @@ export const contact: FormData = {
             .min(10, 'Question should be at least 10 characters')
             .max(2000, 'Question should not exceed 2000 characters')
             .required('Question is required')
-    })
+    }),
+    title: "Contact Form"
 };

src/components/form/formInterfaces.tsx

@@ -22,6 +22,7 @@ export type FormData = {
     backend: string;
     userInput: UserInput;
     spec: Yup.Schema<any>
+    title: string;
 }
 
 export interface FormProperties {

src/components/form/genericForm.tsx

@@ -60,7 +60,7 @@ const GenericForm = (formData: FormData) => {
     return (
         <div className="container">
             <div>
-                <h1>Contact Form</h1>
+                <h1>{formData.title}</h1>
             </div>
             <div>
                 <Formik