refactor(DataTable): enhance type definitions for processed data rows and update custom actions renderer type

This commit is contained in:
Marco Beretta 2025-09-26 18:29:10 +02:00
parent 57be7d0e0c
commit 1fa6d3db27
No known key found for this signature in database
GPG key ID: D918033D8E74CC11
2 changed files with 8 additions and 9 deletions

View file

@ -9,9 +9,8 @@ import {
type VisibilityState,
type ColumnDef,
type Row,
type Table as TTable,
} from '@tanstack/react-table';
import type { DataTableProps } from './DataTable.types';
import type { DataTableProps, ProcessedDataRow, TableColumnDef } from './DataTable.types';
import { SelectionCheckbox, MemoizedTableRow, SkeletonRows } from './DataTableComponents';
import { Table, TableBody, TableHead, TableHeader, TableCell, TableRow } from '../Table';
import { useDebounced, useOptimizedRowSelection } from './DataTable.hooks';
@ -23,10 +22,6 @@ import { Button } from '../Button';
import { Label } from '../Label';
import { Spinner } from '~/svgs';
type ProcessedDataRow<TData> = TData & { _id: string; _index: number };
type TableColumnDef<TData, TValue> = ColumnDef<ProcessedDataRow<TData>, TValue>;
function DataTable<TData extends Record<string, unknown>, TValue>({
columns,
data,
@ -190,7 +185,7 @@ function DataTable<TData extends Record<string, unknown>, TValue>({
const virtualRows = rowVirtualizer.getVirtualItems();
const totalSize = rowVirtualizer.getTotalSize();
const paddingTop = virtualRows.length > 0 ? (virtualRows[0]?.start ?? 0) : 0;
const paddingTop = virtualRows[0]?.start ?? 0;
const paddingBottom =
virtualRows.length > 0 ? totalSize - (virtualRows[virtualRows.length - 1]?.end ?? 0) : 0;
@ -294,7 +289,7 @@ function DataTable<TData extends Record<string, unknown>, TValue>({
customActionsRenderer({
selectedCount,
selectedRows: table.getSelectedRowModel().rows.map((r) => r.original),
table: table as unknown as TTable<TData & { _id: string }>,
table,
})}
</div>

View file

@ -1,6 +1,10 @@
import type { ColumnDef, SortingState, Table } from '@tanstack/react-table';
import type React from 'react';
export type ProcessedDataRow<TData> = TData & { _id: string; _index: number };
export type TableColumnDef<TData, TValue> = ColumnDef<ProcessedDataRow<TData>, TValue>;
export type TableColumn<TData, TValue> = ColumnDef<TData, TValue> & {
accessorKey?: string | number;
meta?: {
@ -56,7 +60,7 @@ export interface DataTableProps<TData extends Record<string, unknown>, TValue> {
customActionsRenderer?: (params: {
selectedCount: number;
selectedRows: TData[];
table: Table<TData & { _id: string }>;
table: Table<ProcessedDataRow<TData>>;
}) => React.ReactNode;
}