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

type Props = {
  cellsCount?: number;
};

const ListSkeleton = ({ cellsCount = 6 }: Props) => {
  const skeletonCells = Array.from({ length: cellsCount }, (_, index) => (
    <TableCell key={index}>
      <Skeleton
        variant="rectangular"
        height={33}
      />
    </TableCell>
  ));

  return Array.from({ length: 4 }, (_, index) => (
    <TableRow key={index}>{skeletonCells}</TableRow>
  ));
};

export default ListSkeleton;