diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycle.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycle.tsx index 0f8fded237..2bdf1164a6 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycle.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycle.tsx @@ -13,6 +13,7 @@ export interface LifecycleFeature { type: string; name: string; lastSeenAt?: string | null; + enabled: boolean; }>; } diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.test.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.test.tsx index c6a68d47b5..9462733328 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.test.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.test.tsx @@ -53,7 +53,7 @@ test('render initial stage', async () => { await screen.findByText('initial'); await screen.findByText('2 minutes'); await screen.findByText( - "This feature toggle is currently in the initial phase of it's life cycle.", + 'This feature flag is currently in the initial phase of its lifecycle.', ); }); diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.tsx index 201ec897bf..a522318ac3 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.tsx @@ -136,8 +136,8 @@ const InitialStageDescription: FC = () => { return ( <> - This feature toggle is currently in the initial phase of it's - life cycle. + This feature flag is currently in the initial phase of its + lifecycle. This means that the flag has been created, but it has not yet @@ -250,8 +250,7 @@ const PreLiveStageDescription: FC = ({ children }) => { return ( <> - We've seen the feature flag in the following non-production - environments: + We've seen the feature flag in the following environments: {children} diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/populateCurrentStage.test.ts b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/populateCurrentStage.test.ts index 366f7b0506..b832072454 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/populateCurrentStage.test.ts +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/populateCurrentStage.test.ts @@ -24,13 +24,27 @@ describe('populateCurrentStage', () => { lifecycle: { stage: 'pre-live', enteredStageAt }, environments: [ { name: 'test', type: 'development', lastSeenAt: null }, - { name: 'test1', type: 'production', lastSeenAt: '2022-08-01' }, + { + name: 'test1', + type: 'production', + lastSeenAt: '2022-08-01', + enabled: true, + }, { name: 'dev', type: 'development', lastSeenAt: '2022-08-01' }, + { + name: 'prod_disabled', + type: 'production', + lastSeenAt: '2022-08-02', + enabled: false, + }, ], } as IFeatureToggle; const expected = { name: 'pre-live', - environments: [{ name: 'dev', lastSeenAt: '2022-08-01' }], + environments: [ + { name: 'dev', lastSeenAt: '2022-08-01' }, + { name: 'prod_disabled', lastSeenAt: '2022-08-02' }, + ], enteredStageAt, }; const result = populateCurrentStage(feature); @@ -41,7 +55,18 @@ describe('populateCurrentStage', () => { const feature = { lifecycle: { stage: 'live', enteredStageAt }, environments: [ - { name: 'prod', type: 'production', lastSeenAt: '2022-08-01' }, + { + name: 'prod', + type: 'production', + lastSeenAt: '2022-08-01', + enabled: true, + }, + { + name: 'prod_ignore', + type: 'production', + lastSeenAt: '2022-08-01', + enabled: false, + }, ], } as IFeatureToggle; const expected = { diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/populateCurrentStage.ts b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/populateCurrentStage.ts index a7d914383f..6798f91433 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/populateCurrentStage.ts +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/populateCurrentStage.ts @@ -6,9 +6,11 @@ export const populateCurrentStage = ( ): LifecycleStage | undefined => { if (!feature.lifecycle) return undefined; - const getFilteredEnvironments = (condition: (type: string) => boolean) => { + const getFilteredEnvironments = ( + condition: (env: { type: string; enabled: boolean }) => boolean, + ) => { return (feature.environments || []) - .filter((env) => condition(env.type) && Boolean(env.lastSeenAt)) + .filter((env) => condition(env) && Boolean(env.lastSeenAt)) .map((env) => ({ name: env.name, lastSeenAt: env.lastSeenAt!, @@ -24,7 +26,9 @@ export const populateCurrentStage = ( return { name: 'pre-live', environments: getFilteredEnvironments( - (type) => type !== 'production', + (env) => + env.type !== 'production' || + (env.type === 'production' && !env.enabled), ), enteredStageAt, }; @@ -32,7 +36,7 @@ export const populateCurrentStage = ( return { name: 'live', environments: getFilteredEnvironments( - (type) => type === 'production', + (env) => env.type === 'production' && env.enabled, ), enteredStageAt, };