1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-03-18 00:19:49 +01:00

feat: lifecycle stage dates (#6926)

This commit is contained in:
Mateusz Kwasniewski 2024-04-25 13:30:00 +02:00 committed by GitHub
parent 68e7a3164e
commit 0eaf725e82
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 56 additions and 27 deletions

View File

@ -23,6 +23,9 @@ import {
} from 'component/providers/AccessProvider/permissions';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import { isSafeToArchive } from './isSafeToArchive';
import { useLocationSettings } from 'hooks/useLocationSettings';
import { formatDateYMDHMS } from 'utils/formatDate';
import { formatDistanceToNow, parseISO } from 'date-fns';
const TimeLabel = styled('span')(({ theme }) => ({
color: theme.palette.text.secondary,
@ -330,6 +333,18 @@ const CompletedStageDescription: FC<{
);
};
const FormatTime: FC<{ time: string }> = ({ time }) => {
const { locationSettings } = useLocationSettings();
return <span>{formatDateYMDHMS(time, locationSettings.locale)}</span>;
};
const FormatElapsedTime: FC<{ time: string }> = ({ time }) => {
const pastTime = parseISO(time);
const elapsedTime = formatDistanceToNow(pastTime, { addSuffix: false });
return <span>{elapsedTime}</span>;
};
export const FeatureLifecycleTooltip: FC<{
children: React.ReactElement<any, any>;
stage: LifecycleStage;
@ -358,11 +373,12 @@ export const FeatureLifecycleTooltip: FC<{
</MainLifecycleRow>
<TimeLifecycleRow>
<TimeLabel>Stage entered at</TimeLabel>
<span>14/01/2024</span>
<FormatTime time={stage.enteredStageAt} />
</TimeLifecycleRow>
<TimeLifecycleRow>
<TimeLabel>Time spent in stage</TimeLabel>
<span>3 days</span>
<FormatElapsedTime time={stage.enteredStageAt} />
</TimeLifecycleRow>
<StageTimeline stage={stage} />
</Box>

View File

@ -1,16 +1,19 @@
export type LifecycleStage =
| { name: 'initial' }
| {
name: 'pre-live';
environments: Array<{ name: string; lastSeenAt: string }>;
}
| {
name: 'live';
environments: Array<{ name: string; lastSeenAt: string }>;
}
| {
name: 'completed';
environments: Array<{ name: string; lastSeenAt: string }>;
status: 'kept' | 'discarded';
}
| { name: 'archived' };
type TimedStage = { enteredStageAt: string };
export type LifecycleStage = TimedStage &
(
| { name: 'initial' }
| {
name: 'pre-live';
environments: Array<{ name: string; lastSeenAt: string }>;
}
| {
name: 'live';
environments: Array<{ name: string; lastSeenAt: string }>;
}
| {
name: 'completed';
environments: Array<{ name: string; lastSeenAt: string }>;
status: 'kept' | 'discarded';
}
| { name: 'archived' }
);

View File

@ -1,6 +1,8 @@
import { populateCurrentStage } from './populateCurrentStage';
import type { IFeatureToggle } from '../../../../../interfaces/featureToggle';
const enteredStageAt = 'date';
describe('populateCurrentStage', () => {
it('should return undefined if lifecycle is not defined', () => {
const feature = {};
@ -10,16 +12,16 @@ describe('populateCurrentStage', () => {
it('should return initial stage when lifecycle stage is initial', () => {
const feature = {
lifecycle: { stage: 'initial' },
lifecycle: { stage: 'initial', enteredStageAt },
};
const expected = { name: 'initial' };
const expected = { name: 'initial', enteredStageAt };
const result = populateCurrentStage(feature as IFeatureToggle);
expect(result).toEqual(expected);
});
it('should correctly populate pre-live stage with dev environments', () => {
const feature = {
lifecycle: { stage: 'pre-live' },
lifecycle: { stage: 'pre-live', enteredStageAt },
environments: [
{ name: 'test', type: 'development', lastSeenAt: null },
{ name: 'test1', type: 'production', lastSeenAt: '2022-08-01' },
@ -29,6 +31,7 @@ describe('populateCurrentStage', () => {
const expected = {
name: 'pre-live',
environments: [{ name: 'dev', lastSeenAt: '2022-08-01' }],
enteredStageAt,
};
const result = populateCurrentStage(feature);
expect(result).toEqual(expected);
@ -36,7 +39,7 @@ describe('populateCurrentStage', () => {
it('should handle live stage with production environments', () => {
const feature = {
lifecycle: { stage: 'live' },
lifecycle: { stage: 'live', enteredStageAt },
environments: [
{ name: 'prod', type: 'production', lastSeenAt: '2022-08-01' },
],
@ -44,6 +47,7 @@ describe('populateCurrentStage', () => {
const expected = {
name: 'live',
environments: [{ name: 'prod', lastSeenAt: '2022-08-01' }],
enteredStageAt,
};
const result = populateCurrentStage(feature);
expect(result).toEqual(expected);
@ -51,7 +55,7 @@ describe('populateCurrentStage', () => {
it('should return completed stage with production environments', () => {
const feature = {
lifecycle: { stage: 'completed' },
lifecycle: { stage: 'completed', enteredStageAt },
environments: [
{ name: 'prod', type: 'production', lastSeenAt: '2022-08-01' },
],
@ -60,6 +64,7 @@ describe('populateCurrentStage', () => {
name: 'completed',
status: 'kept',
environments: [{ name: 'prod', lastSeenAt: '2022-08-01' }],
enteredStageAt,
};
const result = populateCurrentStage(feature);
expect(result).toEqual(expected);
@ -67,9 +72,9 @@ describe('populateCurrentStage', () => {
it('should return archived stage when lifecycle stage is archived', () => {
const feature = {
lifecycle: { stage: 'archived' },
lifecycle: { stage: 'archived', enteredStageAt },
} as IFeatureToggle;
const expected = { name: 'archived' };
const expected = { name: 'archived', enteredStageAt };
const result = populateCurrentStage(feature);
expect(result).toEqual(expected);
});

View File

@ -15,15 +15,18 @@ export const populateCurrentStage = (
}));
};
const enteredStageAt = feature.lifecycle.enteredStageAt;
switch (feature.lifecycle.stage) {
case 'initial':
return { name: 'initial' };
return { name: 'initial', enteredStageAt };
case 'pre-live':
return {
name: 'pre-live',
environments: getFilteredEnvironments(
(type) => type !== 'production',
),
enteredStageAt,
};
case 'live':
return {
@ -31,6 +34,7 @@ export const populateCurrentStage = (
environments: getFilteredEnvironments(
(type) => type === 'production',
),
enteredStageAt,
};
case 'completed':
return {
@ -39,9 +43,10 @@ export const populateCurrentStage = (
environments: getFilteredEnvironments(
(type) => type === 'production',
),
enteredStageAt,
};
case 'archived':
return { name: 'archived' };
return { name: 'archived', enteredStageAt };
default:
return undefined;
}