mirror of
https://github.com/hexastack/hexabot
synced 2025-06-26 18:27:28 +00:00
89 lines
2.7 KiB
TypeScript
89 lines
2.7 KiB
TypeScript
/*
|
|
* Copyright © 2024 Hexastack. All rights reserved.
|
|
*
|
|
* Licensed under the GNU Affero General Public License v3.0 (AGPLv3) with the following additional terms:
|
|
* 1. The name "Hexabot" is a trademark of Hexastack. You may not use this name in derivative works without express written permission.
|
|
* 2. All derivative works must include clear attribution to the original creator and software, Hexastack and Hexabot, in a prominent location (e.g., in the software's "About" section, documentation, and README file).
|
|
*/
|
|
|
|
import {
|
|
DataGridProps,
|
|
GridPaginationModel,
|
|
GridSortModel,
|
|
} from "@mui/x-data-grid";
|
|
import { useState } from "react";
|
|
|
|
import { PageQueryDto } from "@/types/pagination.types";
|
|
|
|
export function toPageQueryPayload(
|
|
pagination?: GridPaginationModel,
|
|
sort?: GridSortModel,
|
|
): PageQueryDto {
|
|
return {
|
|
skip: pagination ? pagination.page * pagination.pageSize : undefined,
|
|
limit: pagination ? pagination.pageSize : undefined,
|
|
sort: sort && sort.length ? `${sort[0].field} ${sort[0].sort}` : undefined,
|
|
};
|
|
}
|
|
|
|
export const usePagination = (
|
|
// rowCount is the total number of rows in the table
|
|
// if you don't know the total number of rows set it to -1
|
|
// that way the DataGrid will try to fetch all the rows until the server returns an empty array
|
|
rowCount: number = -1,
|
|
initialPaginationState: GridPaginationModel = {
|
|
page: 0,
|
|
pageSize: 10,
|
|
},
|
|
initialSortState?: GridSortModel,
|
|
hasCount: boolean = true,
|
|
): {
|
|
dataGridPaginationProps: Pick<
|
|
DataGridProps,
|
|
| "paginationMode"
|
|
| "sortingMode"
|
|
| "onPaginationModelChange"
|
|
| "onSortModelChange"
|
|
| "rowCount"
|
|
| "initialState"
|
|
| "pageSizeOptions"
|
|
>;
|
|
pageQueryPayload?: PageQueryDto;
|
|
} => {
|
|
const [paginationModel, setPaginationModel] = useState(
|
|
initialPaginationState,
|
|
);
|
|
const [sortModel, setSortModel] = useState(initialSortState);
|
|
|
|
return {
|
|
// spread these in the DataGrid component
|
|
dataGridPaginationProps: {
|
|
pageSizeOptions: [
|
|
{ label: "5/page", value: 5 },
|
|
{ label: "10/page", value: 10 },
|
|
{ label: "25/page", value: 25 },
|
|
{ label: "50/page", value: 50 },
|
|
],
|
|
rowCount,
|
|
sortingMode: "server",
|
|
initialState: {
|
|
columns: { columnVisibilityModel: { id: false } },
|
|
pagination: {
|
|
paginationModel: initialPaginationState,
|
|
rowCount,
|
|
},
|
|
sorting: {
|
|
sortModel: initialSortState,
|
|
},
|
|
},
|
|
paginationMode: "server",
|
|
onSortModelChange: setSortModel,
|
|
onPaginationModelChange: setPaginationModel,
|
|
},
|
|
pageQueryPayload: toPageQueryPayload(
|
|
hasCount ? paginationModel : undefined,
|
|
sortModel,
|
|
),
|
|
};
|
|
};
|