2025-12-09 12:13:30 +09:00
|
|
|
"use client";
|
|
|
|
|
|
|
|
|
|
import { memo } from "react";
|
2026-03-19 15:07:07 +09:00
|
|
|
import { NodeProps } from "reactflow";
|
|
|
|
|
import { Send } from "lucide-react";
|
|
|
|
|
import { CompactNodeShell } from "./CompactNodeShell";
|
2025-12-09 12:13:30 +09:00
|
|
|
|
2026-03-19 15:07:07 +09:00
|
|
|
export const HttpRequestActionNode = memo(({ data, selected }: NodeProps<any>) => {
|
|
|
|
|
const method = data.method || "GET";
|
|
|
|
|
const summary = data.url
|
|
|
|
|
? `${method} ${data.url}`
|
|
|
|
|
: "요청 URL을 입력해 주세요";
|
2025-12-09 12:13:30 +09:00
|
|
|
|
|
|
|
|
return (
|
2026-03-19 15:07:07 +09:00
|
|
|
<CompactNodeShell
|
|
|
|
|
color="#06B6D4"
|
|
|
|
|
label={data.displayName || "HTTP 요청"}
|
|
|
|
|
summary={summary}
|
|
|
|
|
icon={<Send className="h-3.5 w-3.5" />}
|
|
|
|
|
selected={selected}
|
2025-12-09 12:13:30 +09:00
|
|
|
>
|
2026-03-19 15:07:07 +09:00
|
|
|
{data.url && (
|
|
|
|
|
<div className="flex items-center gap-1.5">
|
|
|
|
|
<span className="rounded bg-cyan-500/20 px-1 py-0.5 font-mono text-[9px] font-semibold text-cyan-400">
|
|
|
|
|
{method}
|
2025-12-09 12:13:30 +09:00
|
|
|
</span>
|
2026-03-19 15:07:07 +09:00
|
|
|
<span className="break-all font-mono">{data.url}</span>
|
2025-12-09 12:13:30 +09:00
|
|
|
</div>
|
2026-03-19 15:07:07 +09:00
|
|
|
)}
|
|
|
|
|
</CompactNodeShell>
|
2025-12-09 12:13:30 +09:00
|
|
|
);
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
HttpRequestActionNode.displayName = "HttpRequestActionNode";
|