diff --git a/frontend/src/component/common/LifecycleFilters/LifecycleFilters.tsx b/frontend/src/component/common/LifecycleFilters/LifecycleFilters.tsx index ec9c911407..40ee5c8ffd 100644 --- a/frontend/src/component/common/LifecycleFilters/LifecycleFilters.tsx +++ b/frontend/src/component/common/LifecycleFilters/LifecycleFilters.tsx @@ -66,6 +66,10 @@ export const LifecycleFilters = ({ countData, }: ILifecycleFiltersBaseProps) => { const current = state.lifecycle?.values ?? []; + const allFlagsCount = Object.entries(countData ?? {}).reduce( + (acc, [key, count]) => (key !== 'archived' ? acc + count : acc), + 0, + ); return ( @@ -75,7 +79,9 @@ export const LifecycleFilters = ({ value === null ? !state.lifecycle : current.includes(value); - const count = value ? countData?.[value] : total; + const count = value + ? countData?.[value] + : allFlagsCount || undefined; const dynamicLabel = isActive && Number.isInteger(total) ? `${label} (${total === count ? total : `${total} of ${count}`})` diff --git a/frontend/src/component/feature/FeatureToggleList/FeaturesOverviewLifecycleFilters/FeaturesOverviewLifecycleFilters.test.tsx b/frontend/src/component/feature/FeatureToggleList/FeaturesOverviewLifecycleFilters/FeaturesOverviewLifecycleFilters.test.tsx index ee46539720..e19aa61c7c 100644 --- a/frontend/src/component/feature/FeatureToggleList/FeaturesOverviewLifecycleFilters/FeaturesOverviewLifecycleFilters.test.tsx +++ b/frontend/src/component/feature/FeatureToggleList/FeaturesOverviewLifecycleFilters/FeaturesOverviewLifecycleFilters.test.tsx @@ -47,7 +47,7 @@ describe('LifecycleFilters', () => { , ); - expect(getByText('All flags')).toBeInTheDocument(); + expect(getByText('All flags (10)')).toBeInTheDocument(); expect(getByText('Develop (2)')).toBeInTheDocument(); expect(getByText('Rollout production (3)')).toBeInTheDocument(); expect(getByText('Cleanup (4)')).toBeInTheDocument(); @@ -98,7 +98,7 @@ describe('LifecycleFilters', () => { lifecycle: { operator: 'IS', values: ['completed'] }, }); - await userEvent.click(getByText('All flags')); + await userEvent.click(getByText('All flags (10)')); expect(onChange).toHaveBeenCalledWith({ lifecycle: null }); }); });