[ui] Add popover wrapper for form elements

• How can I use this wrapper? Is this the right way?

Fixes #6 (closed)

services/client/react-frontend/src/components/DynamicForm/index.jsx

@@ -48,6 +48,8 @@ function DynamicForm({ formFields, onSubmit, hidden, onFormMounted }) {
               step={formField.step}
               key={index}
               onChange={handleChange}
+              infoText={formField.infoText}
+              infoTitle={formField.infoTitle}
             />
           )
           break
@@ -60,6 +62,8 @@ function DynamicForm({ formFields, onSubmit, hidden, onFormMounted }) {
               options={formField.options}
               onChange={handleChange}
               key={index}
+              infoText={formField.infoText}
+              infoTitle={formField.infoTitle}
             />
           )
           break
@@ -71,6 +75,8 @@ function DynamicForm({ formFields, onSubmit, hidden, onFormMounted }) {
               defaultValue={formField.defaultValue}
               onChange={handleChange}
               key={index}
+              infoText={formField.infoText}
+              infoTitle={formField.infoTitle}
             />
           )
           break
@@ -86,27 +92,26 @@ function DynamicForm({ formFields, onSubmit, hidden, onFormMounted }) {
   }, [onFormMounted])
 
   return (
-    <div className={hidden ? 'hidden' : ''}>
-      <Form
-        id='simulationParameterForm'
-        ref={form}
-        onSubmit={(e) => {
-          e.preventDefault()
+    <Form
+      id='simulationParameterForm'
+      ref={form}
+      className={hidden ? 'hidden' : ''}
+      onSubmit={(e) => {
+        e.preventDefault()
 
-          let parsedFormData = {}
+        let parsedFormData = {}
 
-          formData.forEach((formGroup) => {
-            let name = formGroup.name
-            let value = formGroup.value
-            parsedFormData[name] = value
-          })
+        formData.forEach((formGroup) => {
+          let name = formGroup.name
+          let value = formGroup.value
+          parsedFormData[name] = value
+        })
 
-          onSubmit(parsedFormData)
-        }}
-      >
-        {markup}
-      </Form>
-    </div>
+        onSubmit(parsedFormData)
+      }}
+    >
+      {markup}
+    </Form>
   )
 }