diff --git a/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx b/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx index 7c909167c9..30102681d7 100644 --- a/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx +++ b/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx @@ -177,19 +177,29 @@ export const UserListPicker = ({ [filters, backendEntities], ); - const totalOwnedUserEntities = useMemo( - () => - entitiesWithoutUserFilter.filter(entity => + const filterCounts = useMemo>( + () => ({ + all: entitiesWithoutUserFilter.length, + starred: entitiesWithoutUserFilter.filter(entity => + starredFilter.filterEntity(entity), + ).length, + owned: entitiesWithoutUserFilter.filter(entity => ownedFilter.filterEntity(entity), ).length, - [entitiesWithoutUserFilter, ownedFilter], + }), + [entitiesWithoutUserFilter, starredFilter, ownedFilter], ); useEffect(() => { - if (!loading && totalOwnedUserEntities === 0) { + if ( + !loading && + !!selectedUserFilter && + selectedUserFilter !== 'all' && + filterCounts[selectedUserFilter] === 0 + ) { setSelectedUserFilter('all'); } - }, [loading, totalOwnedUserEntities, setSelectedUserFilter]); + }, [loading, filterCounts, selectedUserFilter, setSelectedUserFilter]); useEffect(() => { updateFilters({ @@ -203,19 +213,6 @@ export const UserListPicker = ({ }); }, [selectedUserFilter, isOwnedEntity, isStarredEntity, updateFilters]); - function getFilterCount(id: UserListFilterKind) { - switch (id) { - case 'owned': - return totalOwnedUserEntities; - case 'starred': - return entitiesWithoutUserFilter.filter(entity => - starredFilter.filterEntity(entity), - ).length; - default: - return entitiesWithoutUserFilter.length; - } - } - return ( {filterGroups.map(group => ( @@ -233,7 +230,7 @@ export const UserListPicker = ({ onClick={() => setSelectedUserFilter(item.id)} selected={item.id === filters.user?.value} className={classes.menuItem} - disabled={getFilterCount(item.id) === 0} + disabled={filterCounts[item.id] === 0} > {item.icon && ( @@ -249,7 +246,7 @@ export const UserListPicker = ({ - {getFilterCount(item.id) ?? '-'} + {filterCounts[item.id] ?? '-'} ))}