import Checkbox from '@material-hu/components/design-system/Checkbox/Checkbox';
import TableCell from '@material-hu/components/design-system/Table/components/TableCell';
import TableHead from '@material-hu/components/design-system/Table/components/TableHead';
import TableRow from '@material-hu/components/design-system/Table/components/TableRow';

import { useLokaliseTranslation } from 'src/utils/i18n';

type KnowledgeBaseTableHeaderProps = {
  selectedCount: number;
  totalCount: number;
  onSelectAll: (checked: boolean) => void;
};

const KnowledgeBaseTableHeader = ({
  selectedCount,
  totalCount,
  onSelectAll,
}: KnowledgeBaseTableHeaderProps) => {
  const { t } = useLokaliseTranslation('agents');

  const isAllSelected = totalCount > 0 && selectedCount === totalCount;
  const isIndeterminate = selectedCount > 0 && selectedCount < totalCount;

  return (
    <TableHead>
      <TableRow
        headerRow
        sx={{ '& th': { py: 2 } }}
      >
        <TableCell
          headerCell
          sx={{ width: 48 }}
        >
          <Checkbox
            checked={isAllSelected}
            indeterminate={isIndeterminate}
            onChange={e => onSelectAll(e.target.checked)}
            sx={{ mx: 1 }}
          />
        </TableCell>

        <TableCell headerCell>{t('knowledge_base.table.title')}</TableCell>

        <TableCell headerCell>
          {t('knowledge_base.table.uploaded_by')}
        </TableCell>

        <TableCell headerCell>
          {t('knowledge_base.table.last_modified')}
        </TableCell>

        <TableCell headerCell>{t('knowledge_base.table.size')}</TableCell>

        <TableCell headerCell>{t('knowledge_base.table.audience')}</TableCell>

        <TableCell headerCell>{t('general:state')}</TableCell>

        <TableCell
          headerCell
          sx={{ width: 80 }}
        />
      </TableRow>
    </TableHead>
  );
};

export default KnowledgeBaseTableHeader;