Merge pull request #39 from DouglasNeuroInformatics/record-array-initial-values-issue

Author: joshunrau

src/components/Form/Form.stories.tsx

@@ -389,6 +389,34 @@ export const ReadOnly: StoryObj<typeof Form<ExampleFormSchemaType>> = {
 };
 
 export const WithInitialValues: StoryObj<typeof Form> = {
+  args: {
+    content: ungroupedContent,
+    initialValues: {
+      booleanCheck: true,
+      booleanRadio: true,
+      date: new Date(),
+      numberInput: 44,
+      numberSlider: 45,
+      numberRadio: 3,
+      numberSelect: 4,
+      stringSelect: 'a',
+      setListbox: new Set(['a', 'b']),
+      setSelect: new Set(['c', 'd']),
+      showDynamicField: true,
+      dynamicField: 'Foo',
+      stringTextArea: 'Lorem ipsum',
+      stringPassword: 'Password',
+      stringInput: 'Input',
+      stringRadio: 'b'
+    },
+    onSubmit: (data) => {
+      alert(JSON.stringify(data, null, 2));
+    },
+    validationSchema: $ExampleFormData
+  }
+};
+
+export const WithDynamicInitialValues: StoryObj<typeof Form> = {
   decorators: [
     (Story) => {
       const [initialValues, setInitialValues] = useState<FormTypes.PartialNullableData<ExampleFormData>>({});

src/components/Form/Form.tsx

@@ -65,6 +65,7 @@ const Form = <TSchema extends z.ZodType<FormDataType>, TData extends z.TypeOf<TS
   const [rootErrors, setRootErrors] = useState<string[]>([]);
   const [errors, setErrors] = useState<FormErrors<TData>>({});
   const [values, setValues] = useState<PartialFormDataType<TData>>({});
+  const [isInitialSetValuesComplete, setIsInitialSetValuesComplete] = useState(false);
 
   const handleError = (error: z.ZodError<TData>) => {
     const fieldErrors: FormErrors<TData> = {};
@@ -130,8 +131,13 @@ const Form = <TSchema extends z.ZodType<FormDataType>, TData extends z.TypeOf<TS
     if (initialValues) {
       setValues(getInitialValues(initialValues));
     }
+    setIsInitialSetValuesComplete(true);
   }, [initialValues]);
 
+  if (!isInitialSetValuesComplete) {
+    return null;
+  }
+
   return (
     <form
       autoComplete="off"