"use client";

import { Trash2, FileText } from "lucide-react";
import { toast } from "sonner";
import { Button } from "@/components/ui/button";
import { useDeletePrecedent, type CasePrecedent } from "@/lib/api/precedents";

/*
 * Read-only display of a single attached precedent. Layout is:
 *
 *   ┌───────────────────────────────────────────┐
 *   │ citation (gold semibold)        [🗑]    │
 *   │ ┌──┐                                     │
 *   │ │╎ │  "quote text…"                      │
 *   │ └──┘                                     │
 *   │ chair_note (muted)                       │
 *   │ 📄 קובץ מצורף                            │
 *   └───────────────────────────────────────────┘
 */

export function PrecedentCard({
  caseNumber,
  precedent,
}: {
  caseNumber: string;
  precedent: CasePrecedent;
}) {
  const del = useDeletePrecedent(caseNumber);

  const onDelete = async () => {
    if (!window.confirm("להסיר פסיקה זו מהתיק?")) return;
    try {
      await del.mutateAsync(precedent.id);
      toast.success("הפסיקה הוסרה");
    } catch (e) {
      toast.error(e instanceof Error ? e.message : "שגיאה בהסרה");
    }
  };

  return (
    <article className="rounded-lg border border-rule bg-parchment/40 px-4 py-3 space-y-2">
      <div className="flex items-start gap-3">
        <p className="flex-1 text-[0.82rem] text-gold-deep font-semibold leading-snug">
          {precedent.citation}
        </p>
        <Button
          type="button"
          variant="ghost"
          size="sm"
          onClick={onDelete}
          disabled={del.isPending}
          aria-label="הסר פסיקה זו"
          className="text-danger hover:text-danger hover:bg-danger-bg shrink-0 -mt-1 -me-2"
        >
          <Trash2 className="w-4 h-4" aria-hidden="true" />
        </Button>
      </div>

      <blockquote className="border-e-2 border-gold pe-3 text-sm text-ink leading-relaxed whitespace-pre-line">
        {precedent.quote}
      </blockquote>

      {precedent.chair_note && (
        <p className="text-[0.78rem] text-ink-muted italic">
          {precedent.chair_note}
        </p>
      )}

      {precedent.pdf_document_id && (
        <div className="flex items-center gap-1.5 text-[0.72rem] text-ink-muted">
          <FileText className="w-3 h-3" aria-hidden="true" />
          <span>קובץ מצורף</span>
        </div>
      )}
    </article>
  );
}