add additional grid to form

app/components/projects/BackProject.jsx

@@ -1,10 +1,14 @@
-import React, { useMemo, useState, useEffect } from 'react'
+import React from 'react'
+import web3 from 'Embark/web3'
+import { Formik } from 'formik'
 import withObservables from '@nozbe/with-observables'
 import { Q } from '@nozbe/watermelondb'
 import { withDatabase } from '@nozbe/watermelondb/DatabaseProvider'
 import { withStyles } from '@material-ui/core/styles'
 import { useProjectData } from './hooks'
 import Divider from '@material-ui/core/Divider'
+import TextField from '@material-ui/core/TextField'
+import MenuItem from '@material-ui/core/MenuItem'
 
 const styles = theme => ({
   root: {
@@ -20,10 +24,17 @@ const styles = theme => ({
     display: 'grid',
     fontSize: '2.5rem',
     gridColumnStart: '1',
-    gridColumnEnd: '12',
+    gridColumnEnd: '13',
     gridRowStart: '1',
     gridRowEnd: '6',
     textAlign: 'center'
+  },
+  submissionRoot: {
+    gridColumnStart: '1',
+    gridColumnEnd: '13'
+  },
+  textField: {
+    width: '100%'
   }
 })
 
@@ -35,12 +46,48 @@ const Title = ({ className, manifest }) => (
   </div>
 )
 
+const SubmissionSection = ({ classes }) => (
+  <Formik
+    initialValues={{ delegateProfile: ''}}
+    onSubmit={console.log}
+  >
+    {({
+      values,
+      errors,
+      touched,
+      handleChange,
+      handleBlur,
+      handleSubmit,
+      setFieldValue,
+      setStatus,
+      status
+    }) => (
+      <form onSubmit={handleSubmit} className={classes.submissionRoot}>
+        <TextField
+          className={classes.textField}
+          id="delegateProfile"
+          name="delegateProfile"
+          select
+          label="Select Delegate Profile"
+          placeholder="Select Delegate Profile"
+          margin="normal"
+          variant="outlined"
+          onChange={handleChange}
+          onBlur={handleBlur}
+          value={values.adminType || ''}
+        />
+      </form>
+    )}
+  </Formik>
+)
+
 function BackProject({classes, match, profile, projectAddedEvents}) {
   const projectId = match.params.id
   const { projectAge, projectAssets, manifest } = useProjectData(projectId, profile, projectAddedEvents)
   return (
     <div className={classes.root}>
       <Title className={classes.title} manifest={manifest} />
+      <SubmissionSection classes={classes}/>
     </div>
   )
 }