diff --git a/src/components/dashboard/charts/StatusDistributionChart.tsx b/src/components/dashboard/charts/StatusDistributionChart.tsx index 98a687f..e1cc572 100644 --- a/src/components/dashboard/charts/StatusDistributionChart.tsx +++ b/src/components/dashboard/charts/StatusDistributionChart.tsx @@ -7,6 +7,7 @@ import { ResponsiveContainer, Tooltip, Legend, + PieLabelRenderProps, } from 'recharts'; interface StatusDistributionData { @@ -72,15 +73,21 @@ export function StatusDistributionChart({ return null; }; - const CustomLabel = (props: { - cx: number; - cy: number; - midAngle: number; - innerRadius: number; - outerRadius: number; - percent: number; - }) => { + const CustomLabel = (props: PieLabelRenderProps) => { const { cx, cy, midAngle, innerRadius, outerRadius, percent } = props; + + // Type guards to ensure we have the required numeric values + if ( + typeof cx !== 'number' || + typeof cy !== 'number' || + typeof midAngle !== 'number' || + typeof innerRadius !== 'number' || + typeof outerRadius !== 'number' || + typeof percent !== 'number' + ) { + return null; + } + if (percent < 0.05) return null; // Ne pas afficher les labels pour les petites sections const RADIAN = Math.PI / 180;