mirror of
https://github.com/Unleash/unleash.git
synced 2024-12-22 19:07:54 +01:00
feat: cr sidebar segments count (#4466)
This commit is contained in:
parent
df41146f50
commit
0a233ba519
@ -0,0 +1,25 @@
|
||||
import { render } from 'utils/testRenderer';
|
||||
import React from 'react';
|
||||
import { UpdateCount } from './ChangeRequestSidebar';
|
||||
import { screen } from '@testing-library/react';
|
||||
|
||||
test('Show only features count when no segments', async () => {
|
||||
render(<UpdateCount featuresCount={1} segmentsCount={0} />);
|
||||
|
||||
expect(screen.getByText('1 feature toggle')).toBeInTheDocument();
|
||||
expect(screen.queryByText('0 segments')).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
test('Show features and segments count', async () => {
|
||||
render(<UpdateCount featuresCount={0} segmentsCount={1} />);
|
||||
|
||||
expect(screen.getByText('0 feature toggles')).toBeInTheDocument();
|
||||
expect(screen.getByText('1 segment')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
test('Show features and segments plural count', async () => {
|
||||
render(<UpdateCount featuresCount={2} segmentsCount={3} />);
|
||||
|
||||
expect(screen.getByText('2 feature toggles')).toBeInTheDocument();
|
||||
expect(screen.getByText('3 segments')).toBeInTheDocument();
|
||||
});
|
@ -11,6 +11,7 @@ import useToast from 'hooks/useToast';
|
||||
import { formatUnknownError } from 'utils/formatUnknownError';
|
||||
import { EnvironmentChangeRequest } from './EnvironmentChangeRequest/EnvironmentChangeRequest';
|
||||
import { ReviewChangesHeader } from './ReviewChangesHeader/ReviewChangesHeader';
|
||||
import { ConditionallyRender } from '../../common/ConditionallyRender/ConditionallyRender';
|
||||
|
||||
interface IChangeRequestSidebarProps {
|
||||
open: boolean;
|
||||
@ -66,7 +67,10 @@ export const Separator = () => (
|
||||
</Typography>
|
||||
);
|
||||
|
||||
export const UpdateCount: FC<{ count: number }> = ({ count }) => (
|
||||
export const UpdateCount: FC<{
|
||||
featuresCount: number;
|
||||
segmentsCount: number;
|
||||
}> = ({ featuresCount, segmentsCount }) => (
|
||||
<Box>
|
||||
<Typography component="span" variant="body1" color="text.secondary">
|
||||
Updates:{' '}
|
||||
@ -77,8 +81,32 @@ export const UpdateCount: FC<{ count: number }> = ({ count }) => (
|
||||
fontWeight: 'bold',
|
||||
}}
|
||||
>
|
||||
{count} {count === 1 ? 'feature toggle' : 'feature toggles'}
|
||||
{featuresCount}{' '}
|
||||
{featuresCount === 1 ? 'feature toggle' : 'feature toggles'}
|
||||
</Typography>
|
||||
<ConditionallyRender
|
||||
condition={segmentsCount > 0}
|
||||
show={
|
||||
<>
|
||||
<Typography
|
||||
component="span"
|
||||
variant="body1"
|
||||
color="text.secondary"
|
||||
>
|
||||
{' and '}
|
||||
</Typography>
|
||||
<Typography
|
||||
component="span"
|
||||
sx={{
|
||||
fontWeight: 'bold',
|
||||
}}
|
||||
>
|
||||
{segmentsCount}{' '}
|
||||
{segmentsCount === 1 ? 'segment' : 'segments'}
|
||||
</Typography>
|
||||
</>
|
||||
}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
|
||||
|
@ -86,7 +86,12 @@ export const EnvironmentChangeRequest: FC<{
|
||||
</Typography>
|
||||
<Separator />
|
||||
<UpdateCount
|
||||
count={environmentChangeRequest.features.length}
|
||||
featuresCount={
|
||||
environmentChangeRequest.features.length
|
||||
}
|
||||
segmentsCount={
|
||||
environmentChangeRequest.segments.length
|
||||
}
|
||||
/>
|
||||
</Box>
|
||||
<Box sx={{ ml: 'auto' }}>
|
||||
|
Loading…
Reference in New Issue
Block a user