Implement pagination for registry records table #60
@ -71,7 +71,7 @@ const RegistryRecords = ({ type }) => {
|
||||
const { config } = useContext(ConsoleContext);
|
||||
const [sorter, sortBy] = useSorter('createTime', false);
|
||||
const [page, setPage] = useState(0);
|
||||
const [rowsPerPage, setRowsPerPage] = useState(5);
|
||||
const [rowsPerPage, setRowsPerPage] = useState(10);
|
||||
|
||||
const offset = page * rowsPerPage;
|
||||
|
||||
@ -100,10 +100,10 @@ const RegistryRecords = ({ type }) => {
|
||||
};
|
||||
|
||||
const labelDisplayedRows = ({ from, to }) => {
|
||||
if(to > from) {
|
||||
return `${from}-${to}`;
|
||||
} else {
|
||||
if (rowsPerPage > records.length) {
|
||||
return `${from}-${from + records.length - 1}`;
|
||||
} else {
|
||||
return `${from}-${to}`;
|
||||
}
|
||||
};
|
||||
|
||||
@ -175,12 +175,15 @@ const RegistryRecords = ({ type }) => {
|
||||
<TablePagination
|
||||
component="td"
|
||||
rowsPerPageOptions={[5, 10, 25]}
|
||||
count={records.length >= rowsPerPage ? -1 : rowsPerPage}
|
||||
count={-1}
|
||||
rowsPerPage={rowsPerPage}
|
||||
page={page}
|
||||
onPageChange={handleChangePage}
|
||||
onRowsPerPageChange={handleChangeRowsPerPage}
|
||||
labelDisplayedRows={labelDisplayedRows}
|
||||
nextIconButtonProps={{
|
||||
disabled: records.length < rowsPerPage,
|
||||
}}
|
||||
/>
|
||||
</TableRow>
|
||||
</TableFooter>
|
||||
|
Loading…
Reference in New Issue
Block a user