eCourt-note/components/AnnotationTypeIcon.tsx

import {
  ArrowRight,
  Circle,
  EyeOff,
  Highlighter,
  MessageSquare,
  Minus,
  Pencil,
  Square,
  Stamp,
  Strikethrough,
  Type,
  Underline,
} from "lucide-react";

import type {
  AnnotationDTO,
  DrawData,
  HighlightData,
  ShapeData,
} from "@/db/schema";

/** ไอคอนตามชนิด annotation — presentational ล้วน **ไม่มี "use client"** ให้หน้าสรุป
 *  (server component, F15) ใช้ร่วมกับ sidebar (client) ได้: lucide icon เป็น SVG
 *  component ล้วน render ฝั่ง server ได้ (ย้ายมาจาก AnnotationSidebar.tsx) */
export function AnnotationTypeIcon({
  type,
  data,
  className = "h-4 w-4 shrink-0 text-slate-500",
}: {
  type: AnnotationDTO["type"];
  data: AnnotationDTO["data"];
  className?: string;
}) {
  if (type === "HIGHLIGHT") {
    const style = (data as HighlightData).style ?? "highlight";
    if (style === "underline") return <Underline className={className} />;
    if (style === "strikethrough") return <Strikethrough className={className} />;
    return <Highlighter className={className} />; // highlight / squiggle
  }
  if (type === "DRAW")
    return (data as DrawData).pen === "highlighter" ? (
      <Highlighter className={className} />
    ) : (
      <Pencil className={className} />
    );
  if (type === "REDACTION") return <EyeOff className={className} />;
  if (type === "TEXTBOX") return <Type className={className} />;
  if (type === "STAMP") return <Stamp className={className} />;
  if (type === "SHAPE") {
    const shape = (data as ShapeData).shape;
    if (shape === "rect") return <Square className={className} />;
    if (shape === "ellipse") return <Circle className={className} />;
    if (shape === "line") return <Minus className={className} />;
    return <ArrowRight className={className} />;
  }
  return <MessageSquare className={className} />;
}