diff --git a/frontend/src/components/scripts/ScriptParameterForm.tsx b/frontend/src/components/scripts/ScriptParameterForm.tsx new file mode 100644 index 00000000..55450bdb --- /dev/null +++ b/frontend/src/components/scripts/ScriptParameterForm.tsx @@ -0,0 +1,58 @@ +import { useScriptGeneratorStore } from '@/store/scriptGeneratorStore' +import { ScriptParameterField } from './ScriptParameterField' +import type { ScriptParametersSchema, ScriptParameter } from '@/types' + +interface Props { + canGenerate: boolean +} + +export function ScriptParameterForm({ canGenerate }: Props) { + const selectedTemplate = useScriptGeneratorStore(s => s.selectedTemplate) + const paramValues = useScriptGeneratorStore(s => s.paramValues) + const formErrors = useScriptGeneratorStore(s => s.formErrors) + + if (!selectedTemplate) return null + + const schema = selectedTemplate.parameters_schema as ScriptParametersSchema + const parameters = (schema?.parameters ?? []).slice().sort((a, b) => a.order - b.order) + + // Group parameters: null-group first, then named groups in order of first appearance + const ungrouped = parameters.filter(p => p.group === null) + const groupOrder: string[] = [] + const grouped: Record = {} + for (const p of parameters) { + if (p.group !== null) { + if (!grouped[p.group]) { + grouped[p.group] = [] + groupOrder.push(p.group) + } + grouped[p.group].push(p) + } + } + + const renderParam = (param: ScriptParameter) => ( + + ) + + return ( +
+ {ungrouped.map(renderParam)} + {groupOrder.map(group => ( +
+

+ {group} +

+
+ {grouped[group].map(renderParam)} +
+
+ ))} +
+ ) +}