public commit

app/src/ui/modules/flows/components2/nodes/tasks/TaskNode.tsx

@@ -0,0 +1,51 @@
+import { TypeRegistry } from "@sinclair/typebox";
+import { type Node, type NodeProps, Position } from "@xyflow/react";
+import { registerCustomTypeboxKinds } from "core/utils";
+import type { TAppFlowTaskSchema } from "flows/AppFlows";
+import { useFlowCanvas, useFlowSelector } from "../../../hooks/use-flow";
+import { Handle } from "../Handle";
+import { FetchTaskForm } from "./FetchTaskNode";
+import { RenderNode } from "./RenderNode";
+
+registerCustomTypeboxKinds(TypeRegistry);
+
+const TaskComponents = {
+   fetch: FetchTaskForm,
+   render: RenderNode
+};
+
+export const TaskNode = (
+   props: NodeProps<
+      Node<
+         TAppFlowTaskSchema & {
+            label: string;
+            last?: boolean;
+            start?: boolean;
+            responding?: boolean;
+         }
+      >
+   >
+) => {
+   const {
+      data: { label, start, last, responding }
+   } = props;
+   const task = useFlowSelector((s) => s.flow!.tasks![label])!;
+   const { actions } = useFlowCanvas();
+
+   const Component =
+      task.type in TaskComponents ? TaskComponents[task.type] : () => <div>unsupported</div>;
+
+   function handleChange(params: any) {
+      //console.log("TaskNode:update", task.type, label, params);
+      actions.task.update(label, params);
+   }
+
+   return (
+      <>
+         <Component {...props} params={task.params as any} onChange={handleChange} />
+
+         <Handle type="target" id={`${label}-in`} />
+         <Handle type="source" id={`${label}-out`} />
+      </>
+   );
+};