73 lines
2.2 KiB
TypeScript
73 lines
2.2 KiB
TypeScript
"use client";
|
|
|
|
import { Handle, Position, type Node, type NodeProps } from "@xyflow/react";
|
|
|
|
import BaseNodeWrapper from "./base-node-wrapper";
|
|
|
|
type AgentOutputNodeData = {
|
|
title?: string;
|
|
channel?: string;
|
|
outputType?: string;
|
|
body?: string;
|
|
_status?: string;
|
|
_statusMessage?: string;
|
|
};
|
|
|
|
type AgentOutputNodeType = Node<AgentOutputNodeData, "agent-output">;
|
|
|
|
export default function AgentOutputNode({ data, selected }: NodeProps<AgentOutputNodeType>) {
|
|
const nodeData = data as AgentOutputNodeData;
|
|
|
|
return (
|
|
<BaseNodeWrapper
|
|
nodeType="agent-output"
|
|
selected={selected}
|
|
status={nodeData._status}
|
|
statusMessage={nodeData._statusMessage}
|
|
className="min-w-[300px] border-amber-500/30"
|
|
>
|
|
<Handle
|
|
type="target"
|
|
position={Position.Left}
|
|
id="agent-output-in"
|
|
className="!h-3 !w-3 !bg-amber-500 !border-2 !border-background"
|
|
/>
|
|
|
|
<div className="flex h-full flex-col gap-3 p-3">
|
|
<header className="space-y-1">
|
|
<p className="truncate text-xs font-semibold text-foreground" title={nodeData.title}>
|
|
{nodeData.title ?? "Agent output"}
|
|
</p>
|
|
</header>
|
|
|
|
<section className="space-y-1">
|
|
<p className="text-[10px] font-semibold uppercase tracking-wide text-muted-foreground">
|
|
Channel
|
|
</p>
|
|
<p className="truncate text-xs text-foreground/90" title={nodeData.channel}>
|
|
{nodeData.channel ?? "-"}
|
|
</p>
|
|
</section>
|
|
|
|
<section className="space-y-1">
|
|
<p className="text-[10px] font-semibold uppercase tracking-wide text-muted-foreground">
|
|
Output Type
|
|
</p>
|
|
<p className="truncate text-xs text-foreground/90" title={nodeData.outputType}>
|
|
{nodeData.outputType ?? "-"}
|
|
</p>
|
|
</section>
|
|
|
|
<section className="space-y-1">
|
|
<p className="text-[10px] font-semibold uppercase tracking-wide text-muted-foreground">
|
|
Body
|
|
</p>
|
|
<p className="line-clamp-6 whitespace-pre-wrap text-xs text-foreground/90">
|
|
{nodeData.body ?? ""}
|
|
</p>
|
|
</section>
|
|
</div>
|
|
</BaseNodeWrapper>
|
|
);
|
|
}
|