import { categoryLabel, type Category, type Locale } from '@ai-radar/shared';

/**
 * Category as a small label. Colour lives on the text only — never a
 * fill, border or dot, so six categories on one page do not compete
 * with the content.
 *
 * Used everywhere, which is how consistency is enforced structurally
 * rather than by discipline.
 */
export function CategoryLabel({
  category,
  locale,
  sponsored = false,
}: {
  category: Category;
  locale: Locale;
  sponsored?: boolean;
}) {
  if (sponsored) {
    return (
      <span className="cat cat-sponsored">{locale === 'ar' ? 'مُموّل' : 'Sponsored'}</span>
    );
  }

  return <span className={`cat cat-${category}`}>{categoryLabel(category, locale)}</span>;
}