mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 13:32:00 +00:00
chore: update Table component
This commit is contained in:
+13
-18
@@ -1,6 +1,6 @@
|
||||
'use client';
|
||||
|
||||
import { ReactNode, useState } from 'react';
|
||||
import { ReactNode, useCallback, useState } from 'react';
|
||||
import {
|
||||
flexRender,
|
||||
getCoreRowModel,
|
||||
@@ -10,6 +10,7 @@ import {
|
||||
TableOptions,
|
||||
useReactTable,
|
||||
ColumnDef,
|
||||
FilterFn,
|
||||
} from '@tanstack/react-table';
|
||||
import { rankItem } from '@tanstack/match-sorter-utils';
|
||||
import { Icon } from '@iconify/react';
|
||||
@@ -32,7 +33,7 @@ interface TableClassNames {
|
||||
|
||||
export interface TableProps<TData extends object> {
|
||||
data: TData[];
|
||||
columns: ColumnDef<TData, any>[];
|
||||
columns: ColumnDef<TData, unknown>[];
|
||||
pageSize?: number;
|
||||
totalItems?: number;
|
||||
page?: number;
|
||||
@@ -46,17 +47,6 @@ export interface TableProps<TData extends object> {
|
||||
|
||||
const DUMMY_SKELETON_DATA = [{}, {}, {}, {}, {}];
|
||||
|
||||
const fuzzyFilter = (
|
||||
row: any,
|
||||
columnId: string,
|
||||
value: string,
|
||||
addMeta: (meta: any) => void
|
||||
) => {
|
||||
const itemRank = rankItem(row.getValue(columnId), value);
|
||||
addMeta({ itemRank });
|
||||
return itemRank.passed;
|
||||
};
|
||||
|
||||
const emptyContentDefaultValue = (
|
||||
<div className='w-full p-5 text-center'>
|
||||
<span className='text-lg opacity-50'>
|
||||
@@ -99,6 +89,15 @@ const Table = <TData extends object>({
|
||||
pageSize: pageSize,
|
||||
});
|
||||
|
||||
const fuzzyFilter: FilterFn<TData> = useCallback(
|
||||
(row, columnId, value, addMeta) => {
|
||||
const itemRank = rankItem(row.getValue(columnId), value);
|
||||
addMeta({ itemRank });
|
||||
return itemRank.passed;
|
||||
},
|
||||
[]
|
||||
);
|
||||
|
||||
const tableOptions: TableOptions<TData> = {
|
||||
columns,
|
||||
data: isLoading ? (DUMMY_SKELETON_DATA as TData[]) : data, // Type assertion
|
||||
@@ -231,11 +230,7 @@ const Table = <TData extends object>({
|
||||
<div className={cn('mt-5', className.paginationClassName)}>
|
||||
<Pagination
|
||||
totalItems={isServerSideTable ? totalItems : table.getRowCount()}
|
||||
itemsPerPage={
|
||||
isServerSideTable
|
||||
? undefined
|
||||
: table.getState().pagination.pageSize
|
||||
}
|
||||
itemsPerPage={table.getState().pagination.pageSize}
|
||||
currentPage={
|
||||
isServerSideTable
|
||||
? page
|
||||
|
||||
Reference in New Issue
Block a user