fix: id or name

ocadotechnology · Oct 2, 2024 · e041ebb · e041ebb
1 parent aa25638
commit e041ebb
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 10 deletions.
diff --git a/src/components/form/AutocompleteField.tsx b/src/components/form/AutocompleteField.tsx
@@ -35,7 +35,6 @@ export interface AutocompleteFieldProps<
   textFieldProps: Omit<
     TextFieldProps,
     | "name"
-    | "id"
     | "value"
     | "onChange"
     | "onBlur"
@@ -67,7 +66,7 @@ const AutocompleteField = <
   FreeSolo,
   ChipComponent
 >): JSX.Element => {
-  const { name, required, ...otherTextFieldProps } = textFieldProps
+  const { id, name, required, ...otherTextFieldProps } = textFieldProps
 
   const dotPath = name.split(".")
 
@@ -97,9 +96,9 @@ const AutocompleteField = <
             defaultValue={
               meta.initialValue === "" ? undefined : meta.initialValue
             }
-            renderInput={({ id, ...otherParams }) => (
+            renderInput={({ id: _, ...otherParams }) => (
               <TextField
-                id={name}
+                id={id ?? name}
                 name={name}
                 required={required}
                 type="text" // Force to be string to avoid number incrementor/decrementor

diff --git a/src/components/form/CheckboxField.tsx b/src/components/form/CheckboxField.tsx
@@ -16,7 +16,7 @@ import { getNestedProperty } from "../../utils/general"
 export interface CheckboxFieldProps
   extends Omit<
     CheckboxProps,
-    "defaultChecked" | "id" | "value" | "onChange" | "onBlur"
+    "defaultChecked" | "value" | "onChange" | "onBlur"
   > {
   name: string
   formControlLabelProps: Omit<FormControlLabelProps, "control">
@@ -25,6 +25,7 @@ export interface CheckboxFieldProps
 }
 
 const CheckboxField: FC<CheckboxFieldProps> = ({
+  id,
   name,
   formControlLabelProps,
   required = false,
@@ -59,7 +60,7 @@ const CheckboxField: FC<CheckboxFieldProps> = ({
               control={
                 <Checkbox
                   defaultChecked={meta.initialValue}
-                  id={name}
+                  id={id ?? name}
                   name={name}
                   value={value}
                   onChange={form.handleChange}

diff --git a/src/components/form/RepeatField.tsx b/src/components/form/RepeatField.tsx
@@ -15,7 +15,6 @@ import { getNestedProperty } from "../../utils/general"
 export type RepeatFieldProps = Omit<
   TextFieldProps,
   | "name"
-  | "id"
   | "value"
   | "onChange"
   | "onBlur"
@@ -35,6 +34,7 @@ const TextField: FC<
     fieldProps: FieldProps
   }
 > = ({
+  id,
   repeatName,
   setValue,
   fieldProps,
@@ -64,7 +64,7 @@ const TextField: FC<
       type={type}
       label={label ?? `Repeat ${name.replace("_", " ")}`}
       placeholder={placeholder ?? `Enter your ${name.replace("_", " ")} again`}
-      id={repeatName}
+      id={id ?? repeatName}
       name={repeatName}
       value={repeatValue}
       onChange={form.handleChange}

diff --git a/src/components/form/TextField.tsx b/src/components/form/TextField.tsx
@@ -12,7 +12,6 @@ import { getNestedProperty } from "../../utils/general"
 export type TextFieldProps = Omit<
   MuiTextFieldProps,
   | "name"
-  | "id"
   | "value"
   | "onChange"
   | "onBlur"
@@ -28,6 +27,7 @@ export type TextFieldProps = Omit<
 
 // https://formik.org/docs/examples/with-material-ui
 const TextField: FC<TextFieldProps> = ({
+  id,
   name,
   schema,
   type = "text",
@@ -61,7 +61,7 @@ const TextField: FC<TextFieldProps> = ({
 
     return (
       <MuiTextField
-        id={name}
+        id={id ?? name}
         name={name}
         type={type}
         required={required}