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

feat: visualize adding a default strategy (#3521)

This commit is contained in:
Mateusz Kwasniewski 2023-04-14 12:33:04 +02:00 committed by GitHub
parent 4054b4cf3a
commit c270344cff
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 121 additions and 2 deletions

View File

@ -0,0 +1,96 @@
import { screen } from '@testing-library/react';
import { render } from 'utils/testRenderer';
import { ChangeRequest } from './ChangeRequest';
import {
IChangeRequest,
IChangeRequestAddStrategy,
IChangeRequestEnabled,
} from '../changeRequest.types';
const changeRequestWithDefaultChange = (
defaultChange: IChangeRequestEnabled | IChangeRequestAddStrategy
) => {
const changeRequest: IChangeRequest = {
approvals: [],
comments: [],
createdAt: new Date(),
createdBy: {
id: 1,
username: 'author',
imageUrl: '',
},
features: [
{
name: 'Feature Toggle Name',
changes: [
{
id: 67,
action: 'updateEnabled',
payload: {
enabled: true,
},
createdAt: new Date(),
createdBy: {
id: 1,
username: 'admin',
imageUrl:
'https://gravatar.com/avatar/21232f297a57a5a743894a0e4a801fc3?size=42&default=retro',
},
},
],
defaultChange,
},
],
id: 0,
minApprovals: 1,
state: 'Draft',
title: 'My change request',
project: 'project',
environment: 'production',
};
return changeRequest;
};
test('Display default add strategy', async () => {
render(
<ChangeRequest
changeRequest={changeRequestWithDefaultChange({
id: 0,
action: 'addStrategy',
payload: {
name: 'flexibleRollout',
constraints: [],
parameters: {
rollout: '100',
stickiness: 'default',
groupId: 'test123',
},
},
})}
/>
);
expect(screen.getByText('Feature Toggle Name')).toBeInTheDocument();
expect(screen.getByText('Enabled')).toBeInTheDocument();
expect(
screen.getByText('Default strategy will be added')
).toBeInTheDocument();
});
test('Display default disable feature', async () => {
render(
<ChangeRequest
changeRequest={changeRequestWithDefaultChange({
id: 0,
action: 'updateEnabled',
payload: {
enabled: false,
},
})}
/>
);
expect(screen.getByText('Feature Toggle Name')).toBeInTheDocument();
expect(screen.getByText('Disabled')).toBeInTheDocument();
expect(screen.getByText('Feature status will change')).toBeInTheDocument();
});

View File

@ -1,5 +1,5 @@
import React, { VFC } from 'react';
import { Box } from '@mui/material';
import { Box, Typography } from '@mui/material';
import type { IChangeRequest } from '../changeRequest.types';
import { FeatureToggleChanges } from './Changes/FeatureToggleChanges';
import { Change } from './Changes/Change/Change';
@ -42,6 +42,25 @@ export const ChangeRequest: VFC<IChangeRequestProps> = ({
feature={feature}
/>
))}
{feature.defaultChange ? (
<Change
discard={
<Typography
variant="body2"
color="text.secondary"
>
{feature.defaultChange.action ===
'addStrategy'
? 'Default strategy will be added'
: 'Feature status will change'}
</Typography>
}
index={feature.changes.length}
changeRequest={changeRequest}
change={feature.defaultChange}
feature={feature}
/>
) : null}
</FeatureToggleChanges>
))}
</Box>

View File

@ -71,13 +71,16 @@ export const Change: FC<{
change: IChange;
feature: IChangeRequestFeature;
}> = ({ index, change, feature, changeRequest, discard }) => {
const lastIndex = feature.defaultChange
? feature.changes.length + 1
: feature.changes.length;
return (
<StyledSingleChangeBox
key={objectId(change)}
$hasConflict={Boolean(change.conflict)}
$isInConflictFeature={Boolean(feature.conflict)}
$isAfterWarning={Boolean(feature.changes[index - 1]?.conflict)}
$isLast={index + 1 === feature.changes.length}
$isLast={index + 1 === lastIndex}
>
<ConditionallyRender
condition={Boolean(change.conflict) && !feature.conflict}

View File

@ -28,6 +28,7 @@ export interface IChangeRequestFeature {
name: string;
conflict?: string;
changes: IChange[];
defaultChange?: IChangeRequestAddStrategy | IChangeRequestEnabled;
}
export interface IChangeRequestApproval {