fix: add memo to autocomplete options

okta · Feb 1, 2024 · c6c0d5d · c6c0d5d
1 parent 6383c3b
commit c6c0d5d
Showing 1 changed file with 16 additions and 5 deletions.
diff --git a/packages/odyssey-react-mui/src/labs/DataFilters.tsx b/packages/odyssey-react-mui/src/labs/DataFilters.tsx
@@ -176,6 +176,21 @@ const DataFilters = ({
     }
   }, [onChangeSearch, searchValue, searchDelayTime, hasSearchSubmitButton]);
 
+  const autocompleteOptions = useMemo(() => {
+    // Check if filterPopoverCurrentFilter and filterPopoverCurrentFilter.options are defined
+    if (
+      filterPopoverCurrentFilter?.variant === "autocomplete" &&
+      filterPopoverCurrentFilter?.options
+    ) {
+      return filterPopoverCurrentFilter.options.map((option) => ({
+        label: option.label,
+      }));
+    }
+
+    // if filterPopoverCurrentFilter or filterPopoverCurrentFilter.options is undefined
+    return [];
+  }, [filterPopoverCurrentFilter]);
+
   const updateInputValue = useCallback(
     ({ filterId, value }: { filterId: string; value: DataFilterValue }) => {
       setInputValues({ ...inputValues, [filterId]: value });
@@ -428,11 +443,7 @@ const DataFilters = ({
                                   value: label,
                                 });
                               }}
-                              options={filterPopoverCurrentFilter.options.map(
-                                (option: { label: string }) => ({
-                                  label: option.label,
-                                })
-                              )}
+                              options={autocompleteOptions}
                             />
                           </AutocompleteInnerContainer>
                           <Button