zaid.marzguioui/myeasycms-v2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add optional sorting state to DataTable component (#148)

Browse Source 
- Introduce `sorting` prop to allow initial sorting configuration
- Update DataTable to use provided initial sorting state
- Maintain default empty sorting state when no initial sorting is specified
This commit is contained in:
Giancarlo Buomprisco
2025-02-05 22:18:12 +07:00
committed by GitHub
parent 4a47df81db
commit 08d5b16123
1 changed files with 3 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/ui/src/makerkit/data-table.tsx
View File

@@ -48,6 +48,7 @@ interface ReactTableProps<T extends object> {
onPaginationChange?: (pagination: PaginationState) => void; onPaginationChange?: (pagination: PaginationState) => void;
manualPagination?: boolean; manualPagination?: boolean;
manualSorting?: boolean; manualSorting?: boolean;
sorting?: SortingState;
tableProps?: React.ComponentProps<typeof Table> & tableProps?: React.ComponentProps<typeof Table> &
Record<`data-${string}`, string>; Record<`data-${string}`, string>;
} }
@@ -62,13 +63,14 @@ export function DataTable<T extends object>({
tableProps, tableProps,
manualPagination = true, manualPagination = true,
manualSorting = false, manualSorting = false,
sorting: initialSorting,
}: ReactTableProps<T>) { }: ReactTableProps<T>) {
const [pagination, setPagination] = useState<PaginationState>({ const [pagination, setPagination] = useState<PaginationState>({
pageIndex: pageIndex ?? 0, pageIndex: pageIndex ?? 0,
pageSize: pageSize ?? 15, pageSize: pageSize ?? 15,
}); });
const [sorting, setSorting] = useState<SortingState>([]); const [sorting, setSorting] = useState<SortingState>(initialSorting ?? []);
const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([]); const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([]);
const [columnVisibility, setColumnVisibility] = useState<VisibilityState>({}); const [columnVisibility, setColumnVisibility] = useState<VisibilityState>({});
const [rowSelection, setRowSelection] = useState({}); const [rowSelection, setRowSelection] = useState({});