fix(typegen): use setValue with shouldDirty for inherit select options

field.onChange(undefined) doesn't mark form as dirty in react-hook-form.
Using setValue with shouldDirty: true fixes the issue.

Co-Authored-By: Claude Opus 4.5 <[email protected]>

Author: eluce2

packages/typegen/web/src/components/LayoutItemEditor.tsx

@@ -16,7 +16,7 @@ interface LayoutItemEditorProps {
 }
 
 export function LayoutItemEditor({ configIndex, layoutIndex, onRemove }: LayoutItemEditorProps) {
-  const { control, watch } = useFormContext<{ config: SingleConfig[] }>();
+  const { control, watch, setValue } = useFormContext<{ config: SingleConfig[] }>();
   const schemaName = watch(`config.${configIndex}.layouts.${layoutIndex}.schemaName`);
   const layoutName = watch(`config.${configIndex}.layouts.${layoutIndex}.layoutName`);
 
@@ -71,7 +71,15 @@ export function LayoutItemEditor({ configIndex, layoutIndex, onRemove }: LayoutI
                 </FormLabel>
                 <FormControl>
                   <Select
-                    onValueChange={(val) => field.onChange(val === "__default__" ? undefined : val)}
+                    onValueChange={(val) => {
+                      if (val === "__default__") {
+                        setValue(`config.${configIndex}.layouts.${layoutIndex}.valueLists`, undefined, {
+                          shouldDirty: true,
+                        });
+                      } else {
+                        field.onChange(val);
+                      }
+                    }}
                     value={field.value ?? "__default__"}
                   >
                     <SelectTrigger>
@@ -120,7 +128,9 @@ export function LayoutItemEditor({ configIndex, layoutIndex, onRemove }: LayoutI
                     <Select
                       onValueChange={(val) => {
                         if (val === "__default__") {
-                          field.onChange(undefined);
+                          setValue(`config.${configIndex}.layouts.${layoutIndex}.generateClient`, undefined, {
+                            shouldDirty: true,
+                          });
                         } else {
                           field.onChange(val === "true");
                         }

packages/typegen/web/src/components/metadata-fields-dialog/TableOptionsForm.tsx

@@ -23,7 +23,7 @@ export function TableOptionsForm({
   open,
   topLevelIncludeAllFieldsByDefault,
 }: TableOptionsFormProps) {
-  const { control } = useFormContext<{ config: SingleConfig[] }>();
+  const { control, setValue } = useFormContext<{ config: SingleConfig[] }>();
 
   // Get the field names for the form fields
   const variableNameFieldName =
@@ -92,7 +92,7 @@ export function TableOptionsForm({
                   <Select
                     onValueChange={(val) => {
                       if (val === "__default__") {
-                        field.onChange(undefined);
+                        setValue(alwaysOverrideFieldNamesFieldName, undefined, { shouldDirty: true });
                       } else {
                         field.onChange(val === "true");
                       }
@@ -140,7 +140,7 @@ export function TableOptionsForm({
                   <Select
                     onValueChange={(val) => {
                       if (val === "__default__") {
-                        field.onChange(undefined);
+                        setValue(reduceMetadataFieldName, undefined, { shouldDirty: true });
                       } else {
                         field.onChange(val === "true");
                       }
@@ -189,7 +189,7 @@ export function TableOptionsForm({
                   <Select
                     onValueChange={(val) => {
                       if (val === "__default__") {
-                        field.onChange(undefined);
+                        setValue(includeAllFieldsByDefaultFieldName, undefined, { shouldDirty: true });
                       } else {
                         field.onChange(val === "true");
                       }