2021-09-18 06:16:02 +02:00
|
|
|
import * as React from "react";
|
|
|
|
import { useTheme } from "@mui/material/styles";
|
|
|
|
import Box from "@mui/material/Box";
|
|
|
|
import IconButton from "@mui/material/IconButton";
|
|
|
|
import FirstPageIcon from "@mui/icons-material/FirstPage";
|
|
|
|
import KeyboardArrowLeft from "@mui/icons-material/KeyboardArrowLeft";
|
|
|
|
import KeyboardArrowRight from "@mui/icons-material/KeyboardArrowRight";
|
|
|
|
import LastPageIcon from "@mui/icons-material/LastPage";
|
|
|
|
|
|
|
|
interface TablePaginationActionsProps {
|
|
|
|
count: number;
|
|
|
|
page: number;
|
|
|
|
rowsPerPage: number;
|
|
|
|
onPageChange: (event: React.MouseEvent<HTMLButtonElement>, newPage: number) => void;
|
|
|
|
}
|
|
|
|
|
2021-09-20 05:29:02 +02:00
|
|
|
export function TablePaginationActionsAll(props: TablePaginationActionsProps): React.ReactElement {
|
2021-09-18 06:16:02 +02:00
|
|
|
const theme = useTheme();
|
|
|
|
const { count, page, rowsPerPage, onPageChange } = props;
|
|
|
|
|
2021-09-20 05:29:02 +02:00
|
|
|
const handleFirstPageButtonClick = (event: React.MouseEvent<HTMLButtonElement>): void => {
|
2021-09-18 06:16:02 +02:00
|
|
|
onPageChange(event, 0);
|
|
|
|
};
|
|
|
|
|
2021-09-20 05:29:02 +02:00
|
|
|
const handleBackButtonClick = (event: React.MouseEvent<HTMLButtonElement>): void => {
|
2021-09-18 06:16:02 +02:00
|
|
|
onPageChange(event, page - 1);
|
|
|
|
};
|
|
|
|
|
2021-09-20 05:29:02 +02:00
|
|
|
const handleNextButtonClick = (event: React.MouseEvent<HTMLButtonElement>): void => {
|
2021-09-18 06:16:02 +02:00
|
|
|
onPageChange(event, page + 1);
|
|
|
|
};
|
|
|
|
|
2021-09-20 05:29:02 +02:00
|
|
|
const handleLastPageButtonClick = (event: React.MouseEvent<HTMLButtonElement>): void => {
|
2021-09-18 06:16:02 +02:00
|
|
|
onPageChange(event, Math.max(0, Math.ceil(count / rowsPerPage) - 1));
|
|
|
|
};
|
|
|
|
|
|
|
|
return (
|
|
|
|
<Box sx={{ flexShrink: 0, ml: 2.5 }}>
|
2021-10-12 00:30:46 +02:00
|
|
|
<IconButton onClick={handleFirstPageButtonClick} disabled={page === 0}>
|
2021-09-18 06:16:02 +02:00
|
|
|
{theme.direction === "rtl" ? <LastPageIcon /> : <FirstPageIcon />}
|
|
|
|
</IconButton>
|
2021-10-12 00:30:46 +02:00
|
|
|
<IconButton onClick={handleBackButtonClick} disabled={page === 0}>
|
2021-09-18 06:16:02 +02:00
|
|
|
{theme.direction === "rtl" ? <KeyboardArrowRight /> : <KeyboardArrowLeft />}
|
|
|
|
</IconButton>
|
2021-10-12 00:30:46 +02:00
|
|
|
<IconButton onClick={handleNextButtonClick} disabled={page >= Math.ceil(count / rowsPerPage) - 1}>
|
2021-09-18 06:16:02 +02:00
|
|
|
{theme.direction === "rtl" ? <KeyboardArrowLeft /> : <KeyboardArrowRight />}
|
|
|
|
</IconButton>
|
2021-10-12 00:30:46 +02:00
|
|
|
<IconButton onClick={handleLastPageButtonClick} disabled={page >= Math.ceil(count / rowsPerPage) - 1}>
|
2021-09-18 06:16:02 +02:00
|
|
|
{theme.direction === "rtl" ? <FirstPageIcon /> : <LastPageIcon />}
|
|
|
|
</IconButton>
|
|
|
|
</Box>
|
|
|
|
);
|
|
|
|
}
|