Nested folders: Clear selection state in tree view when indeterminate (#72595)

* clear selection state when indeterminate

* ensure search state is properly cleared when toggling the indeterminate checkbox

* select everything in view
This commit is contained in:
Ashley Harrison
2023-08-02 11:37:19 +01:00
committed by GitHub
parent 6194d8fd8b
commit dbef9899ac
2 changed files with 19 additions and 12 deletions

View File

@ -11,7 +11,14 @@ export default function CheckboxHeaderCell({ isSelected, onAllSelectionChange }:
<Checkbox
value={state === SelectionState.Selected}
indeterminate={state === SelectionState.Mixed}
onChange={(ev) => onAllSelectionChange?.(ev.currentTarget.checked)}
onChange={(ev) => {
if (state === SelectionState.Mixed) {
// Ensure clicking an indeterminate checkbox always clears the selection
onAllSelectionChange?.(false);
} else {
onAllSelectionChange?.(ev.currentTarget.checked);
}
}}
/>
);
}

View File

@ -64,21 +64,21 @@ export const generateColumns = (
id: `column-checkbox`,
width,
Header: () => {
const { view } = response;
const hasSelection = selection('*', '*');
const allSelected = view.every((item) => selection(item.kind, item.uid));
return (
<Checkbox
indeterminate={selection('*', '*')}
checked={false}
indeterminate={!allSelected && hasSelection}
checked={allSelected}
disabled={!response}
onChange={(e) => {
const { view } = response;
const count = Math.min(view.length, 50);
const hasSelection = selection('*', '*');
for (let i = 0; i < count; i++) {
const item = view.get(i);
if (item.uid && item.kind) {
if (hasSelection === selection(item.kind, item.uid)) {
selectionToggle(item.kind, item.uid);
}
if (hasSelection) {
clearSelection();
} else {
for (let i = 0; i < view.length; i++) {
const item = view.get(i);
selectionToggle(item.kind, item.uid);
}
}
}}