mirror of https://github.com/portainer/portainer
50 lines
1.3 KiB
TypeScript
50 lines
1.3 KiB
TypeScript
import { ChevronDown, ChevronUp } from 'lucide-react';
|
|
import { CellProps, Column, HeaderProps } from 'react-table';
|
|
|
|
import { Button } from '@@/buttons';
|
|
|
|
export function buildExpandColumn<T extends Record<string, unknown>>(
|
|
isExpandable: (item: T) => boolean
|
|
): Column<T> {
|
|
return {
|
|
id: 'expand',
|
|
Header: ({
|
|
filteredFlatRows,
|
|
getToggleAllRowsExpandedProps,
|
|
isAllRowsExpanded,
|
|
}: HeaderProps<T>) => {
|
|
const hasExpandableItems = filteredFlatRows.some((item) =>
|
|
isExpandable(item.original)
|
|
);
|
|
|
|
return (
|
|
hasExpandableItems && (
|
|
<Button
|
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
{...getToggleAllRowsExpandedProps()}
|
|
color="none"
|
|
icon={isAllRowsExpanded ? ChevronDown : ChevronUp}
|
|
/>
|
|
)
|
|
);
|
|
},
|
|
Cell: ({ row }: CellProps<T>) => (
|
|
<div className="vertical-center">
|
|
{isExpandable(row.original) && (
|
|
<Button
|
|
/* eslint-disable-next-line react/jsx-props-no-spreading */
|
|
{...row.getToggleRowExpandedProps()}
|
|
color="none"
|
|
icon={row.isExpanded ? ChevronDown : ChevronUp}
|
|
/>
|
|
)}
|
|
</div>
|
|
),
|
|
disableFilters: true,
|
|
Filter: () => null,
|
|
canHide: false,
|
|
width: 30,
|
|
disableResizing: true,
|
|
};
|
|
}
|