coder
diff --git a/‎site/components/Form/FormTextField.tsx
Lines changed: 45 additions & 30 deletions b/‎site/components/Form/FormTextField.tsx
Lines changed: 45 additions & 30 deletions
diff --git a/‎site/components/Form/types.ts
Lines changed: 0 additions & 16 deletions b/‎site/components/Form/types.ts
Lines changed: 0 additions & 16 deletions
diff --git a/‎site/pages/workspaces/create/[projectId].tsx
Lines changed: 4 additions & 6 deletions b/‎site/pages/workspaces/create/[projectId].tsx
Lines changed: 4 additions & 6 deletions
@@ -1,8 +1,23 @@
 import TextField, { TextFieldProps } from "@material-ui/core/TextField"
-import { FormikLike } from "../../util/formik"
+import { FormikContextType as FormikLike } from "formik"
 import React from "react"
 import { PasswordField } from "./PasswordField"
-import { FormFieldProps } from "./types"
+
+/**
+ * FormFieldProps are required props for creating form fields using a factory.
+ */
+export interface FormFieldProps<T> {
+  /**
+   * form is a reference to a form or subform and is used to compute common
+   * states such as error and helper text
+   */
+  form: FormikLike<T>
+  /**
+   * formFieldName is a field name associated with the form schema.
+   */
+  formFieldName: keyof T
+}
+
 
 /**
  * FormTextFieldProps extends form-related MUI TextFieldProps with Formik
@@ -12,31 +27,31 @@ import { FormFieldProps } from "./types"
  */
 export interface FormTextFieldProps<T>
   extends Pick<
-      TextFieldProps,
-      | "autoComplete"
-      | "autoFocus"
-      | "children"
-      | "className"
-      | "disabled"
-      | "fullWidth"
-      | "helperText"
-      | "id"
-      | "InputLabelProps"
-      | "InputProps"
-      | "inputProps"
-      | "label"
-      | "margin"
-      | "multiline"
-      | "onChange"
-      | "placeholder"
-      | "required"
-      | "rows"
-      | "select"
-      | "SelectProps"
-      | "style"
-      | "type"
-    >,
-    FormFieldProps<T> {
+  TextFieldProps,
+  | "autoComplete"
+  | "autoFocus"
+  | "children"
+  | "className"
+  | "disabled"
+  | "fullWidth"
+  | "helperText"
+  | "id"
+  | "InputLabelProps"
+  | "InputProps"
+  | "inputProps"
+  | "label"
+  | "margin"
+  | "multiline"
+  | "onChange"
+  | "placeholder"
+  | "required"
+  | "rows"
+  | "select"
+  | "SelectProps"
+  | "style"
+  | "type"
+  >,
+  FormFieldProps<T> {
   /**
    * eventTransform is an optional transformer on the event data before it is
    * processed by formik.
@@ -105,9 +120,9 @@ export const formTextFieldFactory = <T,>(): React.FC<FormTextFieldProps<T>> => {
   }) => {
     const isError = form.touched[formFieldName] && Boolean(form.errors[formFieldName])
 
-    // Conversion to a string primitive is necessary as formFieldName is an in
-    // indexable type such as a string, number or enum.
-    const fieldId = FormikLike.getFieldId<T>(form, String(formFieldName))
+    // TODO: When we need to bring back FormikLike / subforms, use
+    // the `FormikLike.getFieldId` helper.
+    const fieldId = String(formFieldName)
 
     const Component = isPassword ? PasswordField : TextField
     const inputType = isPassword ? undefined : type
 
@@ -1,7 +1,7 @@
 import React from "react"
 import { useRouter } from "next/router"
-import { useFormik } from "formik"
-import { firstOrOnly, subForm, FormikLike } from "./../../../util"
+import { useFormik, FormikContext } from "formik"
+import { firstOrOnly } from "./../../../util"
 import * as API from "../../../api"
 import { FormPage, FormButton } from "../../../components/PageTemplates"
 import { useRequestor } from "../../../hooks/useRequestor"
@@ -66,8 +66,6 @@ const CreateProjectPage: React.FC = () => {
     },
   })
 
-  const parametersForm: FormikLike<Record<string, string>> = subForm(form, "parameters")
-
   const cancel = () => {
     router.push(`/workspaces/create`)
   }
@@ -126,8 +124,8 @@ const CreateProjectPage: React.FC = () => {
                 return (
                   <FormRow>
                     <ParameterTextField
-                      form={parametersForm}
-                      formFieldName={param.id}
+                      form={form}
+                      formFieldName={"parameters." + param.id}
                       fullWidth
                       label={param.name}
                       helperText={param.description}