feat: add row selection functionality to DataTable component

This commit is contained in:
Yoga Pangestu 2026-04-14 22:51:25 +07:00
parent c29063391f
commit 2dc311b4b5

View File

@ -67,6 +67,8 @@ interface DataTableProps<TData, TValue> {
bulkActions?: DataTableBulkAction<TData>[];
showNumbering?: boolean;
showSelection?: boolean;
rowSelection?: any;
onRowSelectionChange?: (selection: any) => void;
}
export function DataTable<TData, TValue>({
@ -76,11 +78,12 @@ export function DataTable<TData, TValue>({
bulkActions,
showNumbering = true,
showSelection = true,
rowSelection = {},
onRowSelectionChange,
}: DataTableProps<TData, TValue>) {
const [sorting, setSorting] = React.useState<SortingState>([]);
const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>([]);
const [columnVisibility, setColumnVisibility] = React.useState<VisibilityState>({});
const [rowSelection, setRowSelection] = React.useState({});
const [globalFilter, setGlobalFilter] = React.useState("");
const finalColumns = React.useMemo(() => {
@ -135,7 +138,7 @@ export function DataTable<TData, TValue>({
onColumnFiltersChange: setColumnFilters,
getFilteredRowModel: getFilteredRowModel(),
onColumnVisibilityChange: setColumnVisibility,
onRowSelectionChange: setRowSelection,
onRowSelectionChange: onRowSelectionChange,
onGlobalFilterChange: setGlobalFilter,
state: {
sorting,
@ -310,9 +313,6 @@ export function DataTable<TData, TValue>({
<TableCell colSpan={finalColumns.length} className="h-24 text-center">
<Empty>
<EmptyHeader>
<EmptyMedia variant="icon">
<List />
</EmptyMedia>
<EmptyTitle>Ooops...</EmptyTitle>
<EmptyDescription>
Tidak ada data yang ditemukan.