ari_assistant/frontend/tests/approvals/ApprovalCard.test.tsx

// frontend/tests/approvals/ApprovalCard.test.tsx
import { render, screen } from "@testing-library/react";
import { describe, expect, it } from "vitest";
import { ApprovalCard } from "@/components/approvals/ApprovalCard";
import type { ApprovalOut } from "@/lib/types";

const base: ApprovalOut = {
  id: "a4",
  icon: "mail",
  tone: "violet",
  risk: "high",
  time: "보내기 대기",
  title: "현우님께 회신 초안이 준비됐어요",
  detail: "d",
  cta: "보내기",
  alt: "수정",
  undo_label: "",
  status: "pending",
  source: "mail",
  rule_id: null,
  sort_order: 3,
};

const noop = () => {};

describe("ApprovalCard", () => {
  it("pending 0이면 빈 상태 문구를 보여준다", () => {
    render(
      <ApprovalCard saved="47분" pending={[]} done={[]} onApprove={noop} onUndo={noop} onApproveAll={noop} />,
    );
    expect(screen.getByText(/결재할 게 없어요/)).toBeInTheDocument();
  });

  it("high 카드의 cta/alt 라벨을 렌더한다", () => {
    render(
      <ApprovalCard saved="47분" pending={[base]} done={[]} onApprove={noop} onUndo={noop} onApproveAll={noop} />,
    );
    expect(screen.getByText("보내기")).toBeInTheDocument();
    expect(screen.getByText("수정")).toBeInTheDocument();
  });

  it("2건 이상이면 모두 승인 버튼", () => {
    const p = [
      { ...base, id: "a4" },
      { ...base, id: "a5" },
    ];
    render(
      <ApprovalCard saved="47분" pending={p} done={[]} onApprove={noop} onUndo={noop} onApproveAll={noop} />,
    );
    expect(screen.getByText(/모두 승인 \(2건\)/)).toBeInTheDocument();
  });

  it("done 행은 undo_label 을 보여준다", () => {
    const done: ApprovalOut[] = [
      { ...base, id: "a1", risk: "low", cta: "", alt: "", undo_label: "원래 시간으로", status: "executed", time: "07:42", title: "치과 예약을 16:00로 옮겼어요" },
    ];
    render(
      <ApprovalCard saved="47분" pending={[]} done={done} onApprove={noop} onUndo={noop} onApproveAll={noop} />,
    );
    expect(screen.getByText("원래 시간으로")).toBeInTheDocument();
  });
});