import { ClassDetails } from '@/lib/fetch';
import Chip from '../ui/Chip';

export interface ClassBarProps {
  classList: ClassDetails[];
}

export default async function ClassBar({ classList }: ClassBarProps) {
  return (
    <div className="border-b border-gray-300 px-3 pb-3 max-w-3xl mx-auto">
      {classList.map(classItem => {
        return (
          <Chip
            key={classItem.id}
            value={classItem.name}
            className="px-3 py-1 my-1"
          />
        );
      })}
    </div>
  );
}