"use client";

import { ClipboardCheck, Lightbulb } from "lucide-react";

import { Badge } from "@/components/ui/badge";
import { cn } from "@/lib/utils";

import type { RoleCapability } from "./types";

type Props = {
  capability: RoleCapability;
  className?: string;
};

const config: Record<
  RoleCapability,
  { label: string; icon: typeof Lightbulb; className: string }
> = {
  reviewer: {
    label: "Reviewer",
    icon: ClipboardCheck,
    className: "bg-teal-100 text-teal-800 dark:bg-teal-950 dark:text-teal-200",
  },
  suggester: {
    label: "Suggester",
    icon: Lightbulb,
    className: "bg-orange-100 text-orange-800 dark:bg-orange-950 dark:text-orange-200",
  },
};

export function RoleCapabilityBadge({ capability, className }: Props) {
  const { label, icon: Icon, className: style } = config[capability];

  return (
    <Badge variant="secondary" className={cn("gap-1", style, className)}>
      <Icon className="size-3" />
      {label}
    </Badge>
  );
}