admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Enable multi-selection on table views (#112)

Browse Source 
* Enable multi-selection on table views

* Enable multi-selection
This commit is contained in:
Charles Bochet
2023-05-08 10:58:53 +02:00
committed by GitHub
parent 48a75358b4
commit 94ea9835a9
7 changed files with 86 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
front/src/components/table/Table.tsx
View File

@ -2,6 +2,7 @@ import * as React from 'react';
import {
ColumnDef,
RowSelectionState,
flexRender,
getCoreRowModel,
useReactTable,
@ -34,6 +35,7 @@ type OwnProps<TData, SortField, FilterProperties> = {
filter: FilterType<FilterProperties> | null,
searchValue: string,
) => void;
onRowSelectionChange?: (rowSelection: RowSelectionState) => void;
};
const StyledTable = styled.table`
@ -98,11 +100,23 @@ function Table<TData extends { id: string }, SortField, FilterProperies>({
onSortsUpdate,
onFiltersUpdate,
onFilterSearch,
onRowSelectionChange,
}: OwnProps<TData, SortField, FilterProperies>) {
const [rowSelection, setRowSelection] = React.useState({});
React.useEffect(() => {
onRowSelectionChange && onRowSelectionChange(rowSelection);
}, [rowSelection, onRowSelectionChange]);
const table = useReactTable<TData>({
data,
columns,
state: {
rowSelection,
},
getCoreRowModel: getCoreRowModel(),
enableRowSelection: true, //enable row selection for all rows
onRowSelectionChange: setRowSelection,
});
return (