import Badge from 'react-bootstrap/Badge';
import { SESSION_TYPE_COLORS } from '../types';
import { useI18n } from '../i18n/context';
import type { TranslationKey } from '../i18n/translations';

interface SessionTypeBadgeProps {
  typeId: number;
}

function SessionTypeBadge({ typeId }: SessionTypeBadgeProps) {
  const { t } = useI18n();
  const label = t(`sessionType.${typeId}` as TranslationKey);
  const color = SESSION_TYPE_COLORS[typeId] || '#6c757d';

  return (
    <Badge style={{ backgroundColor: color }} className="session-type-badge">
      {label}
    </Badge>
  );
}

export default SessionTypeBadge;
