src/components/Category/CategoryBadge.tsx

import React from 'react';
import { Category } from '../../types';

interface CategoryBadgeProps {
  category: Category;
  onClick?: () => void;
  className?: string;
}

const CategoryBadge: React.FC<CategoryBadgeProps> = ({

  category,

  onClick,

  className = ''

}) => {
  return (
    <div

      className={`ios-tag cursor-pointer ${className}`}

      style={{ backgroundColor: `${category.color}20`, color: category.color }}

      onClick={onClick}

    >

      {category.name}

    </div>
  );
};

export default CategoryBadge;