fix: collapse issue

RocketChat · Feb 4, 2024 · ab56c61 · ab56c61
1 parent 845a738
commit ab56c61
Showing 1 changed file with 6 additions and 2 deletions.
diff --git a/packages/fuselage/src/components/MultiSelect/MultiSelect.tsx b/packages/fuselage/src/components/MultiSelect/MultiSelect.tsx
@@ -80,6 +80,9 @@ export const MultiSelect = forwardRef(
     useEffect((): void => setInternalValue(value || []), [value]);
 
     const [currentOptionValue, setCurrentOption] = useState<SelectOption[0]>();
+    const [visibleOptions, setVisibleOptions] = useState(
+      AnimatedVisibility.HIDDEN
+    );
 
     const index = options.findIndex(
       (option) => getValue(option) === currentOptionValue
@@ -108,7 +111,6 @@ export const MultiSelect = forwardRef(
       }
       return [value, label];
     };
-
     const applyFilter = ([, option]: SelectOption) =>
       !filter || option.toLowerCase().includes(filter.toLowerCase());
 
@@ -142,10 +144,12 @@ export const MultiSelect = forwardRef(
     };
 
     const handleClick = useEffectEvent(() => {
-      if (visible === AnimatedVisibility.VISIBLE) {
+      if (visibleOptions === AnimatedVisibility.VISIBLE) {
+        setVisibleOptions(AnimatedVisibility.HIDDEN);
         return hide();
       }
       innerRef.current?.focus();
+      setVisibleOptions(AnimatedVisibility.VISIBLE);
       return show();
     });