/**
 * TableHeaderMolecule
 * 
 * 아토믹 디자인: Molecule
 * 
 * 역할: 테이블 헤더 행 (전체 선택 체크박스 포함)
 * - 전체 선택/해제 체크박스
 * - 동적 컬럼 헤더
 * - "작업" 컬럼은 선택된 항목이 없을 때 빈 헤더로 표시
 * 
 * 재사용성: 체크박스가 필요한 모든 테이블에서 사용
 */

import { Checkbox } from "../ui/checkbox";
import { TableHead, TableHeader, TableRow } from "../ui/table";

export interface TableColumn {
  key: string;
  label: string;
  className?: string;
}

interface TableHeaderMoleculeProps {
  columns: TableColumn[];
  allSelected: boolean;
  onToggleSelectAll: (checked: boolean) => void;
  selectedItemsCount?: number;
}

export function TableHeaderMolecule({
  columns,
  allSelected,
  onToggleSelectAll,
  selectedItemsCount = 0,
}: TableHeaderMoleculeProps) {
  return (
    <TableHeader>
      <TableRow>
        <TableHead className="w-[50px] min-w-[50px] max-w-[50px] text-center">
          <Checkbox
            checked={allSelected}
            onCheckedChange={onToggleSelectAll}
          />
        </TableHead>
        {columns.map((column) => {
          // "actions" 컬럼은 항상 렌더링하되, 선택된 항목이 없을 때는 빈 헤더로 표시
          return (
            <TableHead
              key={column.key}
              className={column.className}
            >
              {column.key === "actions" && selectedItemsCount === 0 ? "" : column.label}
            </TableHead>
          );
        })}
      </TableRow>
    </TableHeader>
  );
}
