submission form cleanup

components/forms/SettingsSubmit.tsx

@@ -181,6 +181,9 @@ export default function SettingsSubmit({ mode = "create", submissionId, initialV
     handleSubmit,
     control,
     reset,
+    // ↓↓↓ added setValue & getValues for rehydrate-fix
+    setValue,
+    getValues,
     formState: { isSubmitting },
   } = useForm<any>({
     defaultValues: {
@@ -254,6 +257,48 @@ export default function SettingsSubmit({ mode = "create", submissionId, initialV
   const apt = useOptions("laser_scan_lens_apt", initialValues?.lens_apt ?? null);
   const exp = useOptions("laser_scan_lens_exp", initialValues?.lens_exp ?? null);
 
+  // 🔧 Re-apply RHF values when options hydrate (fixes stubborn placeholder)
+  useEffect(() => {
+    if (!isEdit) return; // only matters in edit-mode
+    const optionsByName: Record<string, Opt[]> = {
+      mat: mats.opts,
+      mat_coat: coats.opts,
+      mat_color: colors.opts,
+      mat_opacity: opacs.opts,
+      laser_soft: soft.opts,
+      source: srcs.opts,
+      lens_conf: conf.opts,
+      lens_apt: apt.opts,
+      lens_exp: exp.opts,
+      lens: lens.opts,
+    };
+    const names = Object.keys(optionsByName) as Array<keyof typeof optionsByName>;
+    const current = getValues();
+
+    names.forEach((name) => {
+      const cur = current?.[name as string];
+      if (cur == null || cur === "") return;
+      const opts = optionsByName[name] || [];
+      // if the option exists now (or even if it didn't before), nudge RHF to re-sync
+      if (!opts.length || opts.some((o) => String(o.id) === String(cur))) {
+        setValue(name as any, cur, { shouldDirty: false, shouldValidate: false });
+      }
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [
+    isEdit,
+    mats.opts.length,
+    coats.opts.length,
+    colors.opts.length,
+    opacs.opts.length,
+    soft.opts.length,
+    srcs.opts.length,
+    conf.opts.length,
+    apt.opts.length,
+    exp.opts.length,
+    lens.opts.length,
+  ]);
+
   // Image files
   const [photoFile, setPhotoFile] = useState<File | null>(null);
   const [screenFile, setScreenFile] = useState<File | null>(null);
@@ -376,7 +421,6 @@ export default function SettingsSubmit({ mode = "create", submissionId, initialV
 
     <div className="grid md:grid-cols-3 gap-3">
     <Select label="Lens Configuration" {...{ name: "lens_conf", register, options: conf.opts, required: true }} />
-    {/* Suffixes after label */}
     <Select label="Scan Head Aperture (mm)" {...{ name: "lens_apt", register, options: apt.opts, required: true }} />
     <Select label="Beam Expander (X Magnification)" {...{ name: "lens_exp", register, options: exp.opts, required: true }} />
     </div>
@@ -411,7 +455,8 @@ export default function SettingsSubmit({ mode = "create", submissionId, initialV
         <Number label="Interval (mm)" name={`fill_settings.${i}.interval`} register={register} step="0.001" />
         <Number label="Pass" name={`fill_settings.${i}.pass`} register={register} step="1" />
         <Number label="Angle (°)" name={`fill_settings.${i}.angle`} register={register} step="1" />
-        {/* Only show when Auto Rotate = true; label + degree suffix */}
+        {/* Moved: toggle first, then conditional increment */}
+        <Check label="Auto Rotate" name={`fill_settings.${i}.auto`} register={register} />
         {autoRotate && (
           <Number
           label="Auto Rotate Increment (°)"
@@ -420,7 +465,6 @@ export default function SettingsSubmit({ mode = "create", submissionId, initialV
           step="0.001"
           />
         )}
-        <Check label="Auto Rotate" name={`fill_settings.${i}.auto`} register={register} />
         <Check label="Crosshatch" name={`fill_settings.${i}.cross`} register={register} />
         <Check label="Flood Fill" name={`fill_settings.${i}.flood`} register={register} />
         <Check label="Air Assist" name={`fill_settings.${i}.air`} register={register} />