"use client";

import { memo } from "react";
import { NodeProps } from "reactflow";
import { RefreshCw } from "lucide-react";
import { CompactNodeShell } from "./CompactNodeShell";
import type { UpsertActionNodeData } from "@/types/node-editor";

export const UpsertActionNode = memo(({ data, selected }: NodeProps<UpsertActionNodeData>) => {
  const mappingCount = data.fieldMappings?.length || 0;
  const conflictCount = data.conflictKeys?.length || 0;
  const summary = data.targetTable
    ? `${data.targetTable} (${mappingCount}개 필드, ${conflictCount}개 키)`
    : "대상 테이블을 선택해 주세요";

  return (
    <CompactNodeShell
      color="#8B5CF6"
      label={data.displayName || "UPSERT"}
      summary={summary}
      icon={<RefreshCw className="h-3.5 w-3.5" />}
      selected={selected}
    />
  );
});

UpsertActionNode.displayName = "UpsertActionNode";