58 lines
1.9 KiB
TypeScript
58 lines
1.9 KiB
TypeScript
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-ink-soft",
|
|
}: {
|
|
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} />;
|
|
}
|