grafana/public/app/features/browse-dashboards/components/CheckboxCell.tsx
Josh Hunt 32d3e895b3
NestedFolders: Indicate when folders have mixed-selection children (#67337)
* Show indeterminate checkbox for folders with partially selected children

* When selecting an item, check ancestors to see if all their children are now selected

* reword comment

* fix test

* fix lint

* Check all descendants for mixed state

* Use indeterminate checkbox

* fix test description

* make header checkbox select/unselect automatically

* mixed header checkbox:

* fix tests

* add tests
2023-05-02 13:17:25 +03:00

30 lines
761 B
TypeScript

import React from 'react';
import { selectors } from '@grafana/e2e-selectors';
import { Checkbox } from '@grafana/ui';
import { DashboardsTreeCellProps, SelectionState } from '../types';
export default function CheckboxCell({
row: { original: row },
isSelected,
onItemSelectionChange,
}: DashboardsTreeCellProps) {
const item = row.item;
if (item.kind === 'ui-empty-folder' || !isSelected) {
return null;
}
const state = isSelected(item);
return (
<Checkbox
data-testid={selectors.pages.BrowseDashbards.table.checkbox(item.uid)}
value={state === SelectionState.Selected}
indeterminate={state === SelectionState.Mixed}
onChange={(ev) => onItemSelectionChange?.(item, ev.currentTarget.checked)}
/>
);
}