"use client";

import { ConflictGauge } from "@/components/skeptic";

function getConflictStatus(score: number): "Unanimous" | "Agreed" | "Contested" {
  if (score < 0.1) return "Unanimous";
  if (score < 0.4) return "Agreed";
  return "Contested";
}

interface CrossTierConflictSummaryProps {
  crossTierConflict: number;
  activeTiers: number;
  totalCandidates: number;
}

export function CrossTierConflictSummary({
  crossTierConflict,
  activeTiers,
  totalCandidates,
}: CrossTierConflictSummaryProps) {
  const conflictStatus = getConflictStatus(crossTierConflict);

  return (
    <div className="space-y-3">
      <ConflictGauge
        score={crossTierConflict}
        status={conflictStatus}
        variant="cross-tier"
      />
      <div className="flex gap-4 text-sm text-muted-foreground">
        <span>
          <span className="font-medium text-foreground">{activeTiers}</span>{" "}
          tier{activeTiers !== 1 ? "s" : ""} reporting
        </span>
        <span>•</span>
        <span>
          <span className="font-medium text-foreground">{totalCandidates}</span>{" "}
          total candidate{totalCandidates !== 1 ? "s" : ""}
        </span>
      </div>
    </div>
  );
}
