diff --git a/frontend/src/component/insights/componentsChart/CreationArchiveChart/CreationArchiveChart.tsx b/frontend/src/component/insights/componentsChart/CreationArchiveChart/CreationArchiveChart.tsx index 389395f8ee..487b64484f 100644 --- a/frontend/src/component/insights/componentsChart/CreationArchiveChart/CreationArchiveChart.tsx +++ b/frontend/src/component/insights/componentsChart/CreationArchiveChart/CreationArchiveChart.tsx @@ -193,6 +193,10 @@ export const CreationArchiveChart: FC = ({ legend: { position: 'bottom' as const, labels: { + color: theme.palette.text.secondary, + usePointStyle: true, + padding: 21, + boxHeight: 8, filter: (legendItem) => { return !flagTypeNames.includes( legendItem.text || '', @@ -234,6 +238,7 @@ export const CreationArchiveChart: FC = ({ scales: { x: { type: 'time', + display: false, time: { unit: 'week', tooltipFormat: 'PPP', diff --git a/frontend/src/component/insights/componentsStat/CreationArchiveStats/CreationArchiveStats.tsx b/frontend/src/component/insights/componentsStat/CreationArchiveStats/CreationArchiveStats.tsx index 895ff7665c..f09c79270c 100644 --- a/frontend/src/component/insights/componentsStat/CreationArchiveStats/CreationArchiveStats.tsx +++ b/frontend/src/component/insights/componentsStat/CreationArchiveStats/CreationArchiveStats.tsx @@ -1,11 +1,12 @@ import type { FC } from 'react'; -import { Box, Typography, Link, styled } from '@mui/material'; +import { Box, Typography, styled } from '@mui/material'; import { HelpIcon } from 'component/common/HelpIcon/HelpIcon'; import InfoOutlined from '@mui/icons-material/InfoOutlined'; import Lightbulb from '@mui/icons-material/LightbulbOutlined'; import { StatsExplanation } from 'component/insights/InsightsCharts.styles'; import type { GroupedDataByProject } from 'component/insights/hooks/useGroupedProjectTrends'; import type { InstanceInsightsSchema } from 'openapi'; +import { Link } from 'react-router-dom'; function getCurrentArchiveRatio( groupedCreationArchiveData: GroupedDataByProject< @@ -72,6 +73,7 @@ const StyledLink = styled(Link)(({ theme }) => ({ '&:hover': { textDecoration: 'underline', }, + fontSize: theme.spacing(1.75), })); interface CreationArchiveStatsProps { @@ -105,7 +107,7 @@ export const CreationArchiveStats: FC = ({ Do you create more flags than you archive? Or do you have good process for cleaning up? - + View flags in cleanup stage