-
-
Notifications
You must be signed in to change notification settings - Fork 656
/
FlagsProjectChart.tsx
41 lines (37 loc) · 1.33 KB
/
FlagsProjectChart.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
import { useMemo, type VFC } from 'react';
import 'chartjs-adapter-date-fns';
import { ExecutiveSummarySchema } from 'openapi';
import { LineChart, NotEnoughData } from '../../components/LineChart/LineChart';
import { useProjectChartData } from 'component/executiveDashboard/hooks/useProjectChartData';
import { usePlaceholderData } from 'component/executiveDashboard/hooks/usePlaceholderData';
import { GroupedDataByProject } from '../../hooks/useGroupedProjectTrends';
interface IFlagsProjectChartProps {
projectFlagTrends: GroupedDataByProject<
ExecutiveSummarySchema['projectFlagTrends']
>;
}
export const FlagsProjectChart: VFC<IFlagsProjectChartProps> = ({
projectFlagTrends,
}) => {
const placeholderData = usePlaceholderData({
type: 'constant',
});
const data = useProjectChartData(projectFlagTrends);
const notEnoughData = useMemo(
() => (data.datasets.some((d) => d.data.length > 1) ? false : true),
[data],
);
return (
<LineChart
data={notEnoughData ? placeholderData : data}
isLocalTooltip
overrideOptions={{
parsing: {
yAxisKey: 'total',
xAxisKey: 'date',
},
}}
cover={notEnoughData ? <NotEnoughData /> : false}
/>
);
};