56 lines
1.6 KiB
TypeScript
56 lines
1.6 KiB
TypeScript
/**
|
|
* NodeConfigPanel - Configures parameters for input/human nodes.
|
|
* Delegates to config components from configs/.
|
|
*/
|
|
|
|
import React, { useState, useEffect } from 'react';
|
|
import type { CanvasNode } from './FlowCanvas';
|
|
import type { NodeType } from '../../api/automation2Api';
|
|
import { getLabel } from './utils';
|
|
import { NODE_CONFIG_REGISTRY } from './configs';
|
|
import styles from './Automation2FlowEditor.module.css';
|
|
|
|
interface NodeConfigPanelProps {
|
|
node: CanvasNode | null;
|
|
nodeType: NodeType | undefined;
|
|
language: string;
|
|
onParametersChange: (nodeId: string, parameters: Record<string, unknown>) => void;
|
|
}
|
|
|
|
export const NodeConfigPanel: React.FC<NodeConfigPanelProps> = ({
|
|
node,
|
|
nodeType,
|
|
language,
|
|
onParametersChange,
|
|
}) => {
|
|
const [params, setParams] = useState<Record<string, unknown>>({});
|
|
|
|
useEffect(() => {
|
|
setParams(node?.parameters ?? {});
|
|
}, [node?.id, node?.parameters]);
|
|
|
|
const updateParam = (key: string, value: unknown) => {
|
|
const next = { ...params, [key]: value };
|
|
setParams(next);
|
|
if (node) onParametersChange(node.id, next);
|
|
};
|
|
|
|
if (!node || !node.type.startsWith('input.')) return null;
|
|
|
|
const ConfigRenderer = NODE_CONFIG_REGISTRY[node.type];
|
|
if (!ConfigRenderer) {
|
|
return (
|
|
<div className={styles.nodeConfigPanel}>
|
|
<h4>{getLabel(nodeType?.label, language) || node.type}</h4>
|
|
<p>Keine Konfiguration für {node.type}</p>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className={styles.nodeConfigPanel}>
|
|
<h4>{getLabel(nodeType?.label, language) || node.type}</h4>
|
|
<ConfigRenderer params={params} updateParam={updateParam} />
|
|
</div>
|
|
);
|
|
};
|