Fix Multi select sorting

ClickHouse · Sep 24, 2023 · 76996d5 · 76996d5
1 parent 559b24e
commit 76996d5
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 4 deletions.
diff --git a/src/components/Select/MultiSelect.stories.tsx b/src/components/Select/MultiSelect.stories.tsx
@@ -65,6 +65,7 @@ export default {
   argTypes: {
     label: { control: "text" },
     disabled: { control: "boolean" },
+    sortable: { control: "boolean" },
     error: { control: "text" },
     value: { control: "text" },
     defaultValue: { control: "text" },

diff --git a/src/components/Select/MultiSelectValue.tsx b/src/components/Select/MultiSelectValue.tsx
@@ -37,24 +37,24 @@ export const MultiSelectValue = ({
     selectedValues.map(value => ({
       id: `multi-select-${id}-${value}`,
       value,
-      filtered: sortable,
     }))
   );
   useEffect(() => {
     setValues(
       selectedValues.map(value => ({
         id: `multi-select-${id}-${value}`,
         value,
-        filtered: sortable,
       }))
     );
-  }, [id, selectedValues, sortable]);
+  }, [id, selectedValues]);
   if (selectedValues.length === 0) {
     return null;
   }
+
   return (
     <BadgeList
       as={ReactSortable}
+      disabled={!sortable}
       list={values}
       setList={setValues}
       onEnd={e => {

diff --git a/src/components/Select/common/InternalSelect.tsx b/src/components/Select/common/InternalSelect.tsx
@@ -347,7 +347,7 @@ export const InternalSelect = ({
                   disabled={disabled ?? false}
                   onSelect={onSelect}
                   selectedValues={selectedValues}
-                  sortable={sortable ?? false}
+                  sortable={!disabled && sortable}
                   valueNode={valueNode.current}
                   onChange={onChange}
                 />