Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-07-26 13:48:33 +02:00
Code Issues Projects Releases Wiki Activity

fix: Do not show the MetricsChartTooltip InfoSummary when all projects (#6810)

Browse Source 
What it says on the tin

Closes #
[](https://linear.app/unleash/issue/1-2275/hide-bottom-part-of-metrics-tooltip-when-all-projects)
<img width="1677" alt="Screenshot 2024-04-09 at 16 57 13"
src="https://github.com/Unleash/unleash/assets/104830839/2369c6f4-a136-4635-b77b-63aa0087338e">
<img width="1678" alt="Screenshot 2024-04-09 at 16 55 53"
src="https://github.com/Unleash/unleash/assets/104830839/b29ec13d-5611-40a2-8dc6-af4c5a4ec97a">

---------

Signed-off-by: andreas-unleash <andreas@getunleash.ai>
This commit is contained in:
andreas-unleash 2024-04-09 17:48:04 +03:00 committed by GitHub
parent 032419aa76
commit fb9855c3fa
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 33 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/src/component/insights/componentsChart/MetricsSummaryChart/MetricsChartTooltip/MetricsChartTooltip-InfoSummary.test.tsx
View File

@ -1,18 +0,0 @@
import { render, screen } from '@testing-library/react';
import { InfoSummary } from './MetricsChartTooltip';
test('Renders apps, flags, and environments, even when their data is `N/A`', () => {
render(
<InfoSummary
data={[
{ key: 'Flags', value: 'N/A' },
{ key: 'Environments', value: 'N/A' },
{ key: 'Apps', value: 'N/A' },
]}
/>,
);
screen.getByText('Environments');
screen.getByText('Apps');
screen.getByText('Flags');
});

51
frontend/src/component/insights/componentsChart/MetricsSummaryChart/MetricsChartTooltip/MetricsChartTooltip.tsx
View File

@ -2,6 +2,7 @@ import type { VFC } from 'react';
import type { InstanceInsightsSchemaMetricsSummaryTrendsItem } from 'openapi';
import { Box, Divider, Paper, styled, Typography } from '@mui/material';
import type { TooltipState } from 'component/insights/components/LineChart/ChartTooltip/ChartTooltip';
import { ConditionallyRender } from '../../../../common/ConditionallyRender/ConditionallyRender';
const StyledTooltipItemContainer = styled(Paper)(({ theme }) => ({
padding: theme.spacing(2),
@ -126,24 +127,38 @@ export const MetricsSummaryTooltip: VFC<{ tooltip: TooltipState | null }> = ({
title={`Not exposed: ${point.value.totalNo ?? 0}`}
color={'error'}
/>
<Divider
sx={(theme) => ({ margin: theme.spacing(1.5, 0) })}
/>
<InfoSummary
data={[
{
key: 'Flags',
value: point.value.totalFlags ?? 'N/A',
},
{
key: 'Environments',
value: point.value.totalEnvironments ?? 'N/A',
},
{
key: 'Apps',
value: point.value.totalApps ?? 'N/A',
},
]}
<ConditionallyRender
condition={
Boolean(point.value.totalApps) &&
Boolean(point.value.totalEnvironments) &&
Boolean(point.value.totalFlags)
}
show={
<>
<Divider
sx={(theme) => ({
margin: theme.spacing(1.5, 0),
})}
/>
<InfoSummary
data={[
{
key: 'Flags',
value: point.value.totalFlags,
},
{
key: 'Environments',
value: point.value
.totalEnvironments,
},
{
key: 'Apps',
value: point.value.totalApps,
},
]}
/>
</>
}
/>
</StyledTooltipItemContainer>
)) || null}