diff --git a/src/components/useList/hooks/useListFilter.ts b/src/components/useList/hooks/useListFilter.ts index ee2e708e26..e552de961d 100644 --- a/src/components/useList/hooks/useListFilter.ts +++ b/src/components/useList/hooks/useListFilter.ts @@ -47,7 +47,7 @@ export function useListFilter({ const filterRef = React.useRef(null); const [filter, setFilter] = React.useState(initialFilterValue); const [prevItems, setPrevItems] = React.useState(externalItems); - const [items, setItems] = React.useState(externalItems); + const [filteredItems, setFilteredItems] = React.useState(externalItems); const filterItemsFn = React.useCallback( (nextFilterValue: string, items: ListItemType[]) => { @@ -68,13 +68,13 @@ export function useListFilter({ ); if (externalItems !== prevItems) { - setItems(filterItemsFn(filter, externalItems)); + setFilteredItems(filterItemsFn(filter, externalItems)); setPrevItems(externalItems); } const debouncedFn = React.useCallback( - debounce((value) => setItems(filterItemsFn(value, externalItems)), debounceTimeout), - [setItems, filterItemsFn, externalItems, debounceTimeout], + debounce((value) => setFilteredItems(filterItemsFn(value, externalItems)), debounceTimeout), + [setFilteredItems, filterItemsFn, externalItems, debounceTimeout], ); const {onFilterUpdate, reset} = React.useMemo(() => { @@ -96,7 +96,7 @@ export function useListFilter({ filterRef, filter, reset, - items, + items: filteredItems, onFilterUpdate, }; }