Merge pull request #123 from marcelblijleven/bugfix/form-issues

Bugfix/form issues

Author: marcelblijleven

package.json

@@ -31,7 +31,7 @@
     "@radix-ui/react-popper": "^1.1.3",
     "@radix-ui/react-progress": "^1.0.3",
     "@radix-ui/react-scroll-area": "^1.0.5",
-    "@radix-ui/react-select": "^1.2.2",
+    "@radix-ui/react-select": "^2.0.0",
     "@radix-ui/react-separator": "^1.0.3",
     "@radix-ui/react-slider": "^1.1.2",
     "@radix-ui/react-slot": "^1.0.2",

pnpm-lock.yaml

@@ -111,12 +111,13 @@ export default function BeanInformationForm() {
                                     {fields.map((field, index) => (
                                         <>
                                             <VarietyInformationFieldset<beanInformationFormSchema>
-                                                key={field.id} field={field}
+                                                key={field.id}
+                                                field={field}
                                                 index={index}
                                                 form={form}
                                                 remove={remove}
                                             />
-                                            {index !== fields.length - 1 && <Separator />}
+                                            {index !== fields.length - 1 && <Separator key={`sep-${field.id}`} />}
                                         </>
                                     ))}
                                     {blend === "BLEND" && (<Button onClick={(event) => {

src/components/forms/bean-information-form/form.tsx

@@ -20,7 +20,7 @@ export default function SelectInput<TFieldValues extends FieldValues = FieldValu
             render={({ field }) => (
                 <FormItem>
                     <FormLabel>{props.label}</FormLabel>
-                    <Select onValueChange={field.onChange} defaultValue={props.default}>
+                    <Select {...field} onValueChange={field.onChange} defaultValue={props.default}>
                         <FormControl>
                             <SelectTrigger className={"capitalize text-base"}>
                                 <SelectValue className={"capitalize text-base"} placeholder="Select an option" />