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:
parent
f20d3e72b9
commit
757461d58b
140 changed files with 1805 additions and 2872 deletions
|
@ -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>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue