1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-08-09 13:47:13 +02:00

feat: basic flag creation chart

This commit is contained in:
sjaanus 2025-07-24 14:26:31 +03:00
parent 9a768f7bdc
commit 9b375dc9b5
No known key found for this signature in database
GPG Key ID: 20E007C0248BA7FF
3 changed files with 30 additions and 1 deletions

View File

@ -22,6 +22,11 @@ export const useInsightsData = (
projects,
);
const creationArchiveData = useFilteredTrends(
instanceInsights.creationArchiveTrends,
projects,
);
const groupedProjectsData = useGroupedProjectTrends(projectsData);
const metricsData = useFilteredTrends(
@ -34,6 +39,9 @@ export const useInsightsData = (
const groupedLifecycleData = useGroupedProjectTrends(lifecycleData);
const groupedCreationArchiveData =
useGroupedProjectTrends(creationArchiveData);
return useMemo(
() => ({
...instanceInsights,
@ -46,6 +54,7 @@ export const useInsightsData = (
allMetricsDatapoints,
lifecycleData,
groupedLifecycleData,
groupedCreationArchiveData,
}),
[
instanceInsights,
@ -57,6 +66,7 @@ export const useInsightsData = (
summary,
lifecycleData,
groupedLifecycleData,
groupedCreationArchiveData,
],
);
};

View File

@ -7,6 +7,7 @@ import useProjects from 'hooks/api/getters/useProjects/useProjects';
type ProjectFlagTrends = InstanceInsightsSchema['projectFlagTrends'];
type LifecycleTrends = InstanceInsightsSchema['lifecycleTrends'];
type CreationArchiveTrends = InstanceInsightsSchema['creationArchiveTrends'];
export const calculateTechDebt = (item: {
total: number;
@ -25,7 +26,8 @@ export const calculateTechDebt = (item: {
export const useProjectChartData = (
projectFlagTrends:
| GroupedDataByProject<ProjectFlagTrends>
| GroupedDataByProject<LifecycleTrends>,
| GroupedDataByProject<LifecycleTrends>
| GroupedDataByProject<CreationArchiveTrends>,
) => {
const theme = useTheme();
const getProjectColor = useProjectColor();

View File

@ -27,6 +27,7 @@ import {
import { useUiFlag } from 'hooks/useUiFlag';
import { NewProductionFlagsChart } from '../componentsChart/NewProductionFlagsChart/NewProductionFlagsChart.tsx';
import Lightbulb from '@mui/icons-material/LightbulbOutlined';
import { CreationArchiveChart } from '../componentsChart/CreationArchiveChart/CreationArchiveChart.tsx';
export const PerformanceInsights: FC = () => {
const statePrefix = 'performance-';
@ -63,6 +64,7 @@ export const PerformanceInsights: FC = () => {
groupedMetricsData,
allMetricsDatapoints,
environmentTypeTrends,
groupedCreationArchiveData,
} = useInsightsData(insights, projects);
const { isEnterprise } = useUiConfig();
@ -110,6 +112,21 @@ export const PerformanceInsights: FC = () => {
</StyledWidget>
) : null}
{isLifecycleGraphsEnabled && isEnterprise() ? (
<StyledWidget>
<StyledWidgetStats width={275}>
<WidgetTitle title='Flags created vs archived' />
</StyledWidgetStats>
<StyledChartContainer>
<CreationArchiveChart
creationArchiveTrends={groupedCreationArchiveData}
isAggregate={showAllProjects}
isLoading={loading}
/>
</StyledChartContainer>
</StyledWidget>
) : null}
{showAllProjects ? (
<StyledWidget>
<StyledWidgetStats width={275}>