submission form cleanup

This commit is contained in:
makearmy 2025-10-06 20:37:40 -04:00
parent 4359803a3f
commit 51df489ce6

View file

@ -181,8 +181,6 @@ export default function SettingsSubmit({ mode = "create", submissionId, initialV
handleSubmit,
control,
reset,
setValue, // <-- add
getValues, // <-- add
formState: { isSubmitting },
} = useForm<any>({
defaultValues: {
@ -256,61 +254,6 @@ 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);
// 🔧 Targeted fix: when options hydrate, re-apply current ids so selects adopt them.
useEffect(() => {
if (!initialValues) return;
type Name =
| "mat"
| "mat_coat"
| "mat_color"
| "mat_opacity"
| "laser_soft"
| "source"
| "lens_conf"
| "lens_apt"
| "lens_exp"
| "lens";
const ensure = (name: Name, id?: string | null, opts?: Opt[]) => {
if (!id) return;
if (!opts || opts.length === 0) return;
const curr = getValues(name as any);
// Re-apply if blank OR already equal to the intended id (forces the select to adopt it)
if (curr == null || curr === "" || String(curr) === String(id)) {
setValue(name as any, String(id), { shouldDirty: false, shouldValidate: false });
}
};
ensure("mat", initialValues.mat ?? null, mats.opts);
ensure("mat_coat", initialValues.mat_coat ?? null, coats.opts);
ensure("mat_color", initialValues.mat_color ?? null, colors.opts);
ensure("mat_opacity",initialValues.mat_opacity ?? null, opacs.opts);
ensure("laser_soft", initialValues.laser_soft ?? null, soft.opts);
ensure("source", initialValues.source ?? null, srcs.opts);
// Order: source → (conf/apt/exp) → lens
ensure("lens_conf", initialValues.lens_conf ?? null, conf.opts);
ensure("lens_apt", initialValues.lens_apt ?? null, apt.opts);
ensure("lens_exp", initialValues.lens_exp ?? null, exp.opts);
ensure("lens", initialValues.lens ?? null, lens.opts);
}, [
initialValues,
mats.opts,
coats.opts,
colors.opts,
opacs.opts,
soft.opts,
srcs.opts,
lens.opts,
conf.opts,
apt.opts,
exp.opts,
getValues,
setValue,
]);
// Image files
const [photoFile, setPhotoFile] = useState<File | null>(null);
const [screenFile, setScreenFile] = useState<File | null>(null);
@ -418,7 +361,7 @@ export default function SettingsSubmit({ mode = "create", submissionId, initialV
<Select label="Coating" {...{ name: "mat_coat", register, options: coats.opts, required: true }} />
<Select label="Color" {...{ name: "mat_color", register, options: colors.opts, required: true }} />
<Select label="Opacity" {...{ name: "mat_opacity", register, options: opacs.opts, required: true }} />
<Number label="Material Thickness (mm)" name="mat_thickness" register={register} step="0.01" />
<Number label="Thickness (mm)" name="mat_thickness" register={register} step="0.01" />
</div>
</section>
@ -433,8 +376,9 @@ 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 }} />
<Select label="Scan Head Aperture" {...{ name: "lens_apt", register, options: apt.opts, required: true }} />
<Select label="Beam Expander" {...{ name: "lens_exp", register, options: exp.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>
<div className="grid md:grid-cols-3 gap-3">
@ -454,24 +398,35 @@ export default function SettingsSubmit({ mode = "create", submissionId, initialV
fields={fills.fields}
onAdd={() => fills.append({ type: "" })} // default to "—"
onRemove={(i) => fills.remove(i)}
render={(i) => (
<div className="grid md:grid-cols-4 gap-2">
<Text label="Name" name={`fill_settings.${i}.name`} register={register} />
<Select label="Type" name={`fill_settings.${i}.type`} register={register} options={FILL_TYPES} />
<Number label="Frequency (kHz)" name={`fill_settings.${i}.frequency`} register={register} step="0.1" />
<Number label="Pulse (ns)" name={`fill_settings.${i}.pulse`} register={register} step="0.1" />
<Number label="Power (%)" name={`fill_settings.${i}.power`} register={register} step="0.1" />
<Number label="Speed (mm/s)" name={`fill_settings.${i}.speed`} register={register} step="0.1" />
<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" />
<Number label="Increment" name={`fill_settings.${i}.increment`} register={register} step="0.001" />
<Check label="Auto" name={`fill_settings.${i}.auto`} register={register} />
<Check label="Cross" name={`fill_settings.${i}.cross`} register={register} />
<Check label="Flood" name={`fill_settings.${i}.flood`} register={register} />
<Check label="Air" name={`fill_settings.${i}.air`} register={register} />
</div>
)}
render={(i) => {
const autoRotate = !!useWatch({ control, name: `fill_settings.${i}.auto` });
return (
<div className="grid md:grid-cols-4 gap-2">
<Text label="Name" name={`fill_settings.${i}.name`} register={register} />
<Select label="Type" name={`fill_settings.${i}.type`} register={register} options={FILL_TYPES} />
<Number label="Frequency (kHz)" name={`fill_settings.${i}.frequency`} register={register} step="0.1" />
<Number label="Pulse (ns)" name={`fill_settings.${i}.pulse`} register={register} step="0.1" />
<Number label="Power (%)" name={`fill_settings.${i}.power`} register={register} step="0.1" />
<Number label="Speed (mm/s)" name={`fill_settings.${i}.speed`} register={register} step="0.1" />
<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 */}
{autoRotate && (
<Number
label="Auto Rotate Increment (°)"
name={`fill_settings.${i}.increment`}
register={register}
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} />
</div>
);
}}
/>
{/* Line */}
@ -480,23 +435,45 @@ export default function SettingsSubmit({ mode = "create", submissionId, initialV
fields={lines.fields}
onAdd={() => lines.append({})}
onRemove={(i) => lines.remove(i)}
render={(i) => (
<div className="grid md:grid-cols-4 gap-2">
<Text label="Name" name={`line_settings.${i}.name`} register={register} />
<Number label="Frequency (kHz)" name={`line_settings.${i}.frequency`} register={register} step="0.1" />
<Number label="Pulse (ns)" name={`line_settings.${i}.pulse`} register={register} step="0.1" />
<Number label="Power (%)" name={`line_settings.${i}.power`} register={register} step="0.1" />
<Number label="Speed (mm/s)" name={`line_settings.${i}.speed`} register={register} step="0.1" />
<Check label="Perf" name={`line_settings.${i}.perf`} register={register} />
<Check label="Cut" name={`line_settings.${i}.cut`} register={register} />
<Check label="Skip" name={`line_settings.${i}.skip`} register={register} />
<Number label="Pass" name={`line_settings.${i}.pass`} register={register} step="1" />
<Number label="Step" name={`line_settings.${i}.step`} register={register} step="0.001" />
<Number label="Size" name={`line_settings.${i}.size`} register={register} step="0.001" />
<Check label="Wobble" name={`line_settings.${i}.wobble`} register={register} />
<Check label="Air" name={`line_settings.${i}.air`} register={register} />
</div>
)}
render={(i) => {
const perf = !!useWatch({ control, name: `line_settings.${i}.perf` });
const wobble = !!useWatch({ control, name: `line_settings.${i}.wobble` });
return (
<div className="grid md:grid-cols-4 gap-2">
<Text label="Name" name={`line_settings.${i}.name`} register={register} />
<Number label="Frequency (kHz)" name={`line_settings.${i}.frequency`} register={register} step="0.1" />
<Number label="Pulse (ns)" name={`line_settings.${i}.pulse`} register={register} step="0.1" />
<Number label="Power (%)" name={`line_settings.${i}.power`} register={register} step="0.1" />
<Number label="Speed (mm/s)" name={`line_settings.${i}.speed`} register={register} step="0.1" />
{/* Perforation mode toggle */}
<Check label="Perforation Mode" name={`line_settings.${i}.perf`} register={register} />
{/* Cut/Skip are integers with mm suffix; only when perf=true */}
{perf && (
<>
<Number label="Cut (mm)" name={`line_settings.${i}.cut`} register={register} step="1" />
<Number label="Skip (mm)" name={`line_settings.${i}.skip`} register={register} step="1" />
</>
)}
<Number label="Pass" name={`line_settings.${i}.pass`} register={register} step="1" />
{/* Wobble toggle */}
<Check label="Wobble" name={`line_settings.${i}.wobble`} register={register} />
{/* Step/Size only when wobble=true; mm suffix */}
{wobble && (
<>
<Number label="Step (mm)" name={`line_settings.${i}.step`} register={register} step="0.001" />
<Number label="Size (mm)" name={`line_settings.${i}.size`} register={register} step="0.001" />
</>
)}
<Check label="Air Assist" name={`line_settings.${i}.air`} register={register} />
</div>
);
}}
/>
{/* Raster */}
@ -520,15 +497,15 @@ export default function SettingsSubmit({ mode = "create", submissionId, initialV
{isHalftone && (
<>
<Number label="Halftone Cell" name={`raster_settings.${i}.halftone_cell`} register={register} step="1" />
<Number label="Halftone Angle" name={`raster_settings.${i}.halftone_angle`} register={register} step="1" />
<Number label="Halftone Angle (°)" name={`raster_settings.${i}.halftone_angle`} register={register} step="1" />
</>
)}
<Number label="Interval (mm)" name={`raster_settings.${i}.interval`} register={register} step="0.001" />
<Number label="Dot" name={`raster_settings.${i}.dot`} register={register} step="0.1" />
<Number label="Dot Width Adjustment (mm)" name={`raster_settings.${i}.dot`} register={register} step="0.1" />
<Number label="Pass" name={`raster_settings.${i}.pass`} register={register} step="1" />
<Check label="Cross" name={`raster_settings.${i}.cross`} register={register} />
<Check label="Inversion" name={`raster_settings.${i}.inversion`} register={register} />
<Check label="Air" name={`raster_settings.${i}.air`} register={register} />
<Check label="Crosshatch" name={`raster_settings.${i}.cross`} register={register} />
<Check label="Inverted" name={`raster_settings.${i}.inversion`} register={register} />
<Check label="Air Assist" name={`raster_settings.${i}.air`} register={register} />
</div>
);
}}