'use client';

import * as React from 'react';
import TablePagination from '@mui/material/TablePagination';

function noop(): void {
  return undefined;
}

interface LessonQuestionsPaginationProps {
  count: number;
  page: number;
  //
  setPage: (page: number) => void;
  setRowsPerPage: (page: number) => void;
  rowsPerPage: number;
}

export function MfQuestionsPagination({
  count,
  page,
  //
  setPage,
  setRowsPerPage,
  rowsPerPage,
}: LessonQuestionsPaginationProps): React.JSX.Element {
  // You should implement the pagination using a similar logic as the filters.
  // Note that when page change, you should keep the filter search params.
  const handleChangePage = (event: unknown, newPage: number) => {
    setPage(newPage);
  };

  const handleChangeRowsPerPage = (event: React.ChangeEvent<HTMLInputElement>) => {
    setRowsPerPage(parseInt(event.target.value));
    // console.log(parseInt(event.target.value));
  };

  return (
    <TablePagination
      component="div"
      count={count}
      onPageChange={handleChangePage}
      onRowsPerPageChange={handleChangeRowsPerPage}
      page={page}
      rowsPerPage={rowsPerPage}
      rowsPerPageOptions={[5, 10, 25]}
    />
  );
}
