Generate Text Node

1import {
2	type Node,
3	type NodeProps,
4	Position,
5	useUpdateNodeInternals,
6} from "@xyflow/react";
7import { Bot, Plus, Trash } from "lucide-react";
8import { useCallback } from "react";
9import { Button } from "@/components/ui/button";
10import { Separator } from "@/components/ui/separator";
11import { cn } from "@/lib/utils";
12import { BaseNode } from "@/registry/ui/flow/base-node";
13import {
14	EditableHandle,
15	EditableHandleDialog,
16} from "@/registry/ui/flow/editable-handle";
17import { LabeledHandle } from "@/registry/ui/flow/labeled-handle";
18import {
19	NodeHeader,
20	NodeHeaderAction,
21	NodeHeaderActions,
22	NodeHeaderIcon,
23	NodeHeaderTitle,
24} from "@/registry/ui/flow/node-header";
25import { NodeHeaderStatus } from "@/registry/ui/flow/node-header-status";
26import { type Model, ModelSelector } from "@/registry/ui/model-selector";
27 
28export type GenerateTextData = {
29	status: "processing" | "error" | "success" | "idle" | undefined;
30	config: {
31		model: Model;
32	};
33	dynamicHandles: {
34		tools: {
35			id: string;
36			name: string;
37			description?: string;
38		}[];
39	};
40};
41 
42export type GenerateTextNode = Node<GenerateTextData, "generate-text">;
43 
44interface GenerateTextNodeProps extends NodeProps<GenerateTextNode> {
45	disableModelSelector?: boolean;
46	onModelChange: (model: Model) => void;
47	onCreateTool: (name: string, description?: string) => boolean;
48	onRemoveTool: (handleId: string) => void;
49	onUpdateTool: (
50		toolId: string,
51		newName: string,
52		newDescription?: string,
53	) => boolean;
54	onDeleteNode: () => void;
55}
56 
57export function GenerateTextNode({
58	id,
59	selected,
60	deletable,
61	disableModelSelector,
62	data,
63	onModelChange,
64	onCreateTool,
65	onRemoveTool,
66	onUpdateTool,
67	onDeleteNode,
68}: GenerateTextNodeProps) {
69	const updateNodeInternals = useUpdateNodeInternals();
70 
71	const handleModelChange = useCallback(
72		(value: string) => {
73			onModelChange?.(value as Model);
74		},
75		[onModelChange],
76	);
77 
78	const handleCreateTool = useCallback(
79		(name: string, description?: string) => {
80			if (!onCreateTool) {
81				return false;
82			}
83			const result = onCreateTool(name, description);
84			if (result) {
85				updateNodeInternals(id);
86			}
87			return result;
88		},
89		[onCreateTool, id, updateNodeInternals],
90	);
91 
92	const removeHandle = useCallback(
93		(handleId: string) => {
94			onRemoveTool?.(handleId);
95			updateNodeInternals(id);
96		},
97		[onRemoveTool, id, updateNodeInternals],
98	);
99 
100	return (
101		<BaseNode
102			selected={selected}
103			className={cn("w-[350px] p-0 hover:ring-orange-500", {
104// … truncated