diff --git a/client/package.json b/client/package.json index f98244838..6644587be 100644 --- a/client/package.json +++ b/client/package.json @@ -79,7 +79,7 @@ "nuqs": "1.17.2", "postcss": "8.4.31", "query-string": "8.1.0", - "rc-tree": "5.7.0", + "rc-tree": "5.8.7", "react": "18.2.0", "react-day-picker": "8.10.0", "react-dom": "18.2.0", diff --git a/client/src/components/tree-select/component.tsx b/client/src/components/tree-select/component.tsx index 98ba01415..9f9b44041 100644 --- a/client/src/components/tree-select/component.tsx +++ b/client/src/components/tree-select/component.tsx @@ -61,6 +61,7 @@ const InnerTreeSelect = ( current: currentRaw, loading, maxBadges = 5, + selectedBadgeLabel = 'more selected', multiple, options = [], placeholder = '', @@ -275,6 +276,11 @@ const InnerTreeSelect = ( [checkedKeys, multiple, onChange, options], ); + const handleRemoveAll = useCallback(() => { + setCheckedKeys([]); + onChange?.([] as TreeSelectProps['current']); + }, [onChange]); + // Current selection useEffect(() => { // Clear selection when current is empty @@ -430,13 +436,18 @@ const InnerTreeSelect = ( ))} {!badgesToShow && currentOptions?.length > 0 && ( - - {currentOptions.length - badgesToShow} selected + + {currentOptions.length - badgesToShow} {selectedBadgeLabel} )} {currentOptions?.length > badgesToShow && Boolean(badgesToShow) && ( - {currentOptions.length - badgesToShow} more selected + {currentOptions.length - badgesToShow} {selectedBadgeLabel} )} diff --git a/client/src/components/tree-select/types.d.ts b/client/src/components/tree-select/types.d.ts index deaa3fd38..4527b5f03 100644 --- a/client/src/components/tree-select/types.d.ts +++ b/client/src/components/tree-select/types.d.ts @@ -10,6 +10,7 @@ export type TreeSelectOption = { interface CommonTreeProps { id?: string; // for testing purposes maxBadges?: number; + selectedBadgeLabel?: string; placeholder?: string; showSearch?: boolean; loading?: boolean; diff --git a/client/src/components/ui/select.tsx b/client/src/components/ui/select.tsx index 887be33e7..9a1d48fba 100644 --- a/client/src/components/ui/select.tsx +++ b/client/src/components/ui/select.tsx @@ -26,11 +26,11 @@ const SelectTrigger = React.forwardRef< <>