import type { Severity } from '../../../types/report';
import { SeverityBadge } from './SeverityBadge';
import { EvidenceGallery } from './EvidenceGallery';

interface DiagnosisRowProps {
  key?: string | number;
  category: string;
  detail: string;
  severity: Severity;
  evidenceIds?: string[];
}

export function DiagnosisRow({ category, detail, severity, evidenceIds }: DiagnosisRowProps) {
  return (
    <div className="py-4 border-b border-slate-100 last:border-0">
      <div className="flex items-center gap-4">
        <span className="font-bold text-sm text-[#0A1128] shrink-0 w-28">
          {category}
        </span>
        <p className="flex-1 text-sm text-slate-600">{detail}</p>
        <div className="shrink-0">
          <SeverityBadge severity={severity} />
        </div>
      </div>
      <EvidenceGallery evidenceIds={evidenceIds} compact />
    </div>
  );
}