1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-07-19 13:29:41 +02:00

chore(deps): upgrade react-table to v8 [EE-4837] (#8245)

This commit is contained in:
Chaim Lev-Ari 2023-05-02 13:42:16 +07:00 committed by GitHub
parent f20d3e72b9
commit 757461d58b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
140 changed files with 1805 additions and 2872 deletions

View file

@ -1,48 +1,58 @@
import { HeaderGroup, TableHeaderProps } from 'react-table';
import { Header, flexRender } from '@tanstack/react-table';
import { filterHOC } from './Filter';
import { TableHeaderCell } from './TableHeaderCell';
interface Props<D extends Record<string, unknown> = Record<string, unknown>> {
headers: HeaderGroup<D>[];
headers: Header<D, unknown>[];
onSortChange?(colId: string, desc: boolean): void;
}
export function TableHeaderRow<
D extends Record<string, unknown> = Record<string, unknown>
>({
headers,
onSortChange,
className,
role,
style,
}: Props<D> & TableHeaderProps) {
>({ headers, onSortChange }: Props<D>) {
return (
<tr className={className} role={role} style={style}>
{headers.map((column) => (
<TableHeaderCell
headerProps={{
...column.getHeaderProps({
className: column.className,
style: {
width: column.disableResizing ? column.width : '',
},
}),
}}
key={column.id}
canSort={column.canSort}
onSortClick={(desc) => {
column.toggleSortBy(desc);
if (onSortChange) {
onSortChange(column.id, desc);
<tr>
{headers.map((header) => {
const sortDirection = header.column.getIsSorted();
const {
meta: { className, width } = { className: '', width: undefined },
} = header.column.columnDef;
return (
<TableHeaderCell
className={className}
style={{
width,
}}
key={header.id}
canSort={header.column.getCanSort()}
onSortClick={(desc) => {
header.column.toggleSorting(desc);
if (onSortChange) {
onSortChange(header.id, desc);
}
}}
isSorted={!!sortDirection}
isSortedDesc={sortDirection ? sortDirection === 'desc' : false}
render={() =>
flexRender(header.column.columnDef.header, header.getContext())
}
}}
isSorted={column.isSorted}
isSortedDesc={column.isSortedDesc}
render={() => column.render('Header')}
canFilter={!column.disableFilters}
renderFilter={() => column.render('Filter')}
/>
))}
renderFilter={
header.column.getCanFilter()
? () =>
flexRender(
header.column.columnDef.meta?.filter ||
filterHOC('Filter'),
{
column: header.column,
}
)
: undefined
}
/>
);
})}
</tr>
);
}