diff --git a/assets/stylesheets/App.css b/assets/stylesheets/App.css index 449628b..4afbd1e 100644 --- a/assets/stylesheets/App.css +++ b/assets/stylesheets/App.css @@ -91,7 +91,7 @@ transition: opacity 0.15s ease-in-out; } -.ant-select-focused .object-display-tag, +.object-select.ant-select-focused .object-display-tag, .ant-select-focused .object-type-display-tag, .ant-select-focused .country-display { opacity: 0.5; diff --git a/src/components/Dashboard/common/ObjectSelect.jsx b/src/components/Dashboard/common/ObjectSelect.jsx index baaf350..92db19e 100644 --- a/src/components/Dashboard/common/ObjectSelect.jsx +++ b/src/components/Dashboard/common/ObjectSelect.jsx @@ -359,7 +359,7 @@ const ObjectSelect = ({ const onTreeSelectChange = useCallback( (value) => { // Mark this as an internal change - setIsSearching(false) + if (!multiple) setIsSearching(false) isInternalChangeRef.current = true // value can be a string (single) or array (multiple) @@ -368,9 +368,7 @@ const ObjectSelect = ({ let selectedObjects = [] if (Array.isArray(value)) { selectedObjects = value - .map((id) => - objectList.find((obj) => areValuesEqual(obj._id, id)) - ) + .map((id) => objectList.find((obj) => areValuesEqual(obj._id, id))) .filter(Boolean) } setTreeSelectValue(value) @@ -402,14 +400,32 @@ const ObjectSelect = ({ if (requestId !== searchRequestIdRef.current) return if (!Array.isArray(data)) return - setTreeData(buildTreeData(data, properties.length)) + const searchData = + multiple && Array.isArray(treeSelectValue) + ? [ + ...data, + ...objectList.filter((object) => + treeSelectValue.some((id) => areValuesEqual(object._id, id)) + ) + ].filter( + (object, index, objects) => + objects.findIndex((item) => + areValuesEqual(item._id, object._id) + ) === index + ) + : data + + setTreeData(buildTreeData(searchData, properties.length)) }, [ searchObjects, type, buildTreeData, objectPropertiesTree, - properties.length + properties.length, + multiple, + treeSelectValue, + objectList ] ) @@ -471,9 +487,7 @@ const ObjectSelect = ({ type != 'unknown' ) { valueRef.current = value - const fullValues = await Promise.all( - value.map(fetchFullObjectIfNeeded) - ) + const fullValues = await Promise.all(value.map(fetchFullObjectIfNeeded)) const pathKeys = [] if (fullValues.length === 0) { @@ -514,9 +528,7 @@ const ObjectSelect = ({ setExpandedKeys([...new Set(pathKeys)]) setTreeSelectValue( value - .map((item) => - item && typeof item === 'object' ? item._id : item - ) + .map((item) => (item && typeof item === 'object' ? item._id : item)) .filter((id) => id != null) ) setInitialized(true) @@ -723,6 +735,7 @@ const ObjectSelect = ({ searchValue={searchValue} disabled={disabled || type == 'unknown' || type == undefined} style={{ opacity: delayedInitialLoading ? 0 : 1 }} + className={multiple ? 'object-select-multiple' : 'object-select'} /> {delayedInitialLoading && (