import { useTranslation } from "react-i18next";

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

const STYLES: Record<string, string> = {
  draft: "bg-neutral-100 text-neutral-600",
  internal: "bg-amber-100 text-amber-800",
  public: "bg-green-100 text-green-800",
};

export function VisibilityBadge({ visibility }: { visibility: string }) {
  const { t } = useTranslation();

  return (
    <Badge variant="outline" className={STYLES[visibility] ?? ""}>
      {t(`visibility.${visibility}`)}
    </Badge>
  );
}
