// frontend/components/dashboard/InboxSummaryCard.tsx
"use client";
import Link from "next/link";
import { Icon } from "@/components/Icon";
import type { InboxRecent } from "@/lib/types";
import { MiniRow } from "./MiniRow";

const kindIcon = (k: InboxRecent["kind"]) =>
  k === "voice" ? "mic" : k === "image" ? "image" : "pen";

const typeLabel = (t: string) =>
  (({ task: "작업", event: "일정", idea: "아이디어" }) as Record<string, string>)[t] ?? "분류 중";

export function InboxSummaryCard({
  items,
  todayRouted,
}: {
  items: InboxRecent[];
  todayRouted: number;
}) {
  return (
    <section className="card">
      <div className="ch">
        <div className="ico">
          <Icon name="inbox" />
        </div>
        <div className="htext">
          <h3>스마트 인박스</h3>
          <div className="sub">적으면 아리가 제자리로</div>
        </div>
        <span className="count">오늘 {todayRouted}건</span>
      </div>

      {items.length === 0 ? (
        <div className="appr-empty">
          <span className="ae-tick">
            <Icon name="tick" w={3} />
          </span>
          인박스가 비었어요 — 떠오르면 바로 적어두세요.
        </div>
      ) : (
        <div className="mini-list">
          {items.map((c) => (
            <MiniRow
              key={c.id}
              tone={c.tone || "faint"}
              icon={kindIcon(c.kind)}
              text={c.raw}
              sub={typeLabel(c.type)}
            />
          ))}
        </div>
      )}

      <Link className="mini-cta" href="/inbox">
        <Icon name="plus" />
        새로 적기 · 인박스 열기
      </Link>
    </section>
  );
}