diff --git a/frontend/src/component/common/LifecycleFilters/LifecycleFilters.tsx b/frontend/src/component/common/LifecycleFilters/LifecycleFilters.tsx index 6f242b212a..6ce070168d 100644 --- a/frontend/src/component/common/LifecycleFilters/LifecycleFilters.tsx +++ b/frontend/src/component/common/LifecycleFilters/LifecycleFilters.tsx @@ -25,16 +25,12 @@ const StyledChip = styled(Chip, { }, })); -interface ILifecycleFiltersBaseProps { +interface ILifecycleFiltersBaseProps { state: FilterItemParamHolder; onChange: (value: FilterItemParamHolder) => void; total?: number; children?: ReactNode; - countData?: T; - getStageCount: ( - lifecycle: LifecycleStage['name'] | null, - data?: T, - ) => number | undefined; + countData?: Record; sx?: SxProps; } @@ -62,15 +58,14 @@ const lifecycleOptions: { { label: 'Cleanup', value: 'completed' }, ]; -export const LifecycleFilters = ({ +export const LifecycleFilters = ({ state, onChange, total, children, countData, - getStageCount, sx, -}: ILifecycleFiltersBaseProps) => { +}: ILifecycleFiltersBaseProps) => { const current = state.lifecycle?.values ?? []; return ( @@ -81,7 +76,7 @@ export const LifecycleFilters = ({ value === null ? !state.lifecycle : current.includes(value); - const count = getStageCount(value, countData); + const count = value ? countData?.[value] : total; const dynamicLabel = isActive && Number.isInteger(total) ? `${label} (${total === count ? total : `${total} of ${count}`})` diff --git a/frontend/src/component/feature/FeatureToggleList/FeatureToggleFilters/FeatureLifecycleFilters.tsx b/frontend/src/component/feature/FeatureToggleList/FeatureToggleFilters/FeatureLifecycleFilters.tsx index e65d15f30e..299490ae54 100644 --- a/frontend/src/component/feature/FeatureToggleList/FeatureToggleFilters/FeatureLifecycleFilters.tsx +++ b/frontend/src/component/feature/FeatureToggleList/FeatureToggleFilters/FeatureLifecycleFilters.tsx @@ -40,14 +40,20 @@ export const FeatureLifecycleFilters: FC = ({ children, }) => { const { lifecycleCount } = useLifecycleCount(); + const countData = Object.entries(lifecycleCount || {}).reduce( + (acc, [key, value]) => { + acc[key === 'preLive' ? 'pre-live' : key] = value; + return acc; + }, + {} as Record, + ); return ( `${theme.spacing(1.5)} ${theme.spacing(3)} 0 ${theme.spacing(3)}`, diff --git a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectLifecycleFilters.tsx b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectLifecycleFilters.tsx index f1584378d0..eae4c50c11 100644 --- a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectLifecycleFilters.tsx +++ b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectLifecycleFilters.tsx @@ -1,30 +1,9 @@ import type { FC, ReactNode } from 'react'; +import { useEffect } from 'react'; import type { FilterItemParamHolder } from '../../../filter/Filters/Filters.tsx'; -import type { LifecycleStage } from '../../../feature/FeatureView/FeatureOverview/FeatureLifecycle/LifecycleStage.tsx'; import { useProjectStatus } from 'hooks/api/getters/useProjectStatus/useProjectStatus'; import { LifecycleFilters } from '../../../common/LifecycleFilters/LifecycleFilters.tsx'; -const getStageCount = ( - lifecycle: LifecycleStage['name'] | null, - lifecycleSummary?: { [key: string]: { currentFlags: number } }, -) => { - if (!lifecycleSummary) { - return undefined; - } - - if (lifecycle === null) { - return ( - (lifecycleSummary.initial?.currentFlags || 0) + - (lifecycleSummary.preLive?.currentFlags || 0) + - (lifecycleSummary.live?.currentFlags || 0) + - (lifecycleSummary.completed?.currentFlags || 0) - ); - } - - const key = lifecycle === 'pre-live' ? 'preLive' : lifecycle; - return lifecycleSummary[key]?.currentFlags; -}; - interface IProjectLifecycleFiltersProps { projectId: string; state: FilterItemParamHolder; @@ -41,7 +20,26 @@ export const ProjectLifecycleFilters: FC = ({ children, }) => { const { data } = useProjectStatus(projectId); - const lifecycleSummary = data?.lifecycleSummary; + const lifecycleSummary = Object.entries( + data?.lifecycleSummary || {}, + ).reduce( + (acc, [key, value]) => { + acc[key === 'preLive' ? 'pre-live' : key] = value.currentFlags || 0; + return acc; + }, + {} as Record, + ); + + const isArchivedFilterActive = state.archived?.values?.includes('true'); + useEffect(() => { + if (isArchivedFilterActive && state.lifecycle) { + onChange({ ...state, lifecycle: null }); + } + }, [isArchivedFilterActive, state, onChange]); + + if (isArchivedFilterActive) { + return null; + } return ( = ({ onChange={onChange} total={total} countData={lifecycleSummary} - getStageCount={getStageCount} > {children}