"use client";

import { Badge } from "@/components/ui/badge";
import { cn } from "@/lib/utils";
import { useLanguage } from "@/lib/i18n/context";
import type { Competition } from "@/lib/mock-data";

const toneClasses: Record<Competition, string> = {
  Low: "bg-success/15 text-success border-success/30",
  Medium: "bg-warning/15 text-warning border-warning/30",
  High: "bg-destructive/15 text-destructive border-destructive/30",
};

export function CompetitionBadge({
  level,
  className,
}: {
  level: Competition;
  className?: string;
}) {
  const { t } = useLanguage();
  const label =
    level === "Low" ? t.competition.low : level === "Medium" ? t.competition.medium : t.competition.high;

  return (
    <Badge
      variant="outline"
      className={cn("font-medium", toneClasses[level], className)}
    >
      {label} {t.competition.suffix}
    </Badge>
  );
}