import React from 'react';

interface CategoryBadgeProps {
  category: "item_request" | "technical_support" | "community_resources" | "general_discussion";
}

const CategoryBadge: React.FC<CategoryBadgeProps> = ({ category }) => {
  const getCategoryConfig = (cat: string) => {
    switch (cat) {
      case 'item_request':
        return { label: 'Item Request', color: 'primary', icon: 'bi-box-seam' };
      case 'technical_support':
        return { label: 'Technical Support', color: 'warning', icon: 'bi-tools' };
      case 'community_resources':
        return { label: 'Community Resources', color: 'info', icon: 'bi-people' };
      case 'general_discussion':
        return { label: 'General Discussion', color: 'secondary', icon: 'bi-chat-dots' };
      default:
        return { label: 'General', color: 'secondary', icon: 'bi-chat' };
    }
  };

  const config = getCategoryConfig(category);

  return (
    <span className={`badge bg-${config.color}`}>
      <i className={`bi ${config.icon} me-1`}></i>
      {config.label}
    </span>
  );
};

export default CategoryBadge;