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

fix: improve impact metrics preview chart (#10368)

Browse Source
This commit is contained in:
Tymoteusz Czech 2025-07-18 09:46:32 +02:00 committed by GitHub
parent 89f5f79836
commit b581b2393d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 29 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/src/component/impact-metrics/ImpactMetricsChartPreview.tsx
View File

@ -1,6 +1,5 @@
import type { FC } from 'react'; import type { FC } from 'react';
import { Typography } from '@mui/material'; import { Box, Typography, useMediaQuery, useTheme } from '@mui/material';
import { StyledChartContainer } from 'component/insights/InsightsCharts.styles';
import { ImpactMetricsChart } from './ImpactMetricsChart.tsx'; import { ImpactMetricsChart } from './ImpactMetricsChart.tsx';
import type { AggregationMode } from './types.ts'; import type { AggregationMode } from './types.ts';
@ -18,7 +17,12 @@ export const ImpactMetricsChartPreview: FC<ImpactMetricsChartPreviewProps> = ({
selectedLabels, selectedLabels,
beginAtZero, beginAtZero,
aggregationMode, aggregationMode,
}) => ( }) => {
const theme = useTheme();
const screenBreakpoint = useMediaQuery(theme.breakpoints.down('lg'));
const key = screenBreakpoint ? 'small' : 'large';
return (
<> <>
<Typography variant='h6' color='text.secondary'> <Typography variant='h6' color='text.secondary'>
Preview Preview
@ -30,8 +34,9 @@ export const ImpactMetricsChartPreview: FC<ImpactMetricsChartPreviewProps> = ({
</Typography> </Typography>
) : null} ) : null}
<StyledChartContainer> <Box sx={(theme) => ({ padding: theme.spacing(1) })}>
<ImpactMetricsChart <ImpactMetricsChart
key={key}
selectedSeries={selectedSeries} selectedSeries={selectedSeries}
selectedRange={selectedRange} selectedRange={selectedRange}
selectedLabels={selectedLabels} selectedLabels={selectedLabels}
@ -39,6 +44,7 @@ export const ImpactMetricsChartPreview: FC<ImpactMetricsChartPreviewProps> = ({
aggregationMode={aggregationMode} aggregationMode={aggregationMode}
isPreview isPreview
/> />
</StyledChartContainer> </Box>
</> </>
); );
};

1
frontend/src/component/impact-metrics/ImpactMetricsControls/ImpactMetricsControls.tsx
View File

@ -36,7 +36,6 @@ export const ImpactMetricsControls: FC<ImpactMetricsControlsProps> = ({
display: 'flex', display: 'flex',
flexDirection: 'column', flexDirection: 'column',
gap: theme.spacing(3), gap: theme.spacing(3),
maxWidth: 400,
})} })}
> >
<Typography variant='body2' color='text.secondary'> <Typography variant='body2' color='text.secondary'>