refactor: update CustomTooltip types in chart components for better type safety
- Enhanced type definitions for the payload in CustomTooltip across multiple chart components to improve TypeScript support and maintainability.
This commit is contained in:
@@ -30,14 +30,21 @@ export function CompletionRateChart({
|
|||||||
total: day.totalTasks,
|
total: day.totalTasks,
|
||||||
}));
|
}));
|
||||||
|
|
||||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
||||||
const CustomTooltip = ({
|
const CustomTooltip = ({
|
||||||
active,
|
active,
|
||||||
payload,
|
payload,
|
||||||
label,
|
label,
|
||||||
}: {
|
}: {
|
||||||
active?: boolean;
|
active?: boolean;
|
||||||
payload?: any[];
|
payload?: Array<{
|
||||||
|
payload: {
|
||||||
|
day: string;
|
||||||
|
date: string;
|
||||||
|
completionRate: number;
|
||||||
|
completed: number;
|
||||||
|
total: number;
|
||||||
|
};
|
||||||
|
}>;
|
||||||
label?: string;
|
label?: string;
|
||||||
}) => {
|
}) => {
|
||||||
if (active && payload && payload.length) {
|
if (active && payload && payload.length) {
|
||||||
|
|||||||
@@ -30,14 +30,26 @@ export function DailyStatusChart({ data, className }: DailyStatusChartProps) {
|
|||||||
Nouvelles: day.newTasks,
|
Nouvelles: day.newTasks,
|
||||||
}));
|
}));
|
||||||
|
|
||||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
||||||
const CustomTooltip = ({
|
const CustomTooltip = ({
|
||||||
active,
|
active,
|
||||||
payload,
|
payload,
|
||||||
label,
|
label,
|
||||||
}: {
|
}: {
|
||||||
active?: boolean;
|
active?: boolean;
|
||||||
payload?: any[];
|
payload?: Array<{
|
||||||
|
dataKey: string;
|
||||||
|
value: number;
|
||||||
|
color: string;
|
||||||
|
payload: {
|
||||||
|
day: string;
|
||||||
|
date: string;
|
||||||
|
Complétées: number;
|
||||||
|
'En cours': number;
|
||||||
|
Bloquées: number;
|
||||||
|
'En attente': number;
|
||||||
|
Nouvelles: number;
|
||||||
|
};
|
||||||
|
}>;
|
||||||
label?: string;
|
label?: string;
|
||||||
}) => {
|
}) => {
|
||||||
if (active && payload && payload.length) {
|
if (active && payload && payload.length) {
|
||||||
|
|||||||
@@ -47,14 +47,21 @@ export function PriorityBreakdownChart({
|
|||||||
total: item.total,
|
total: item.total,
|
||||||
}));
|
}));
|
||||||
|
|
||||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
||||||
const CustomTooltip = ({
|
const CustomTooltip = ({
|
||||||
active,
|
active,
|
||||||
payload,
|
payload,
|
||||||
label,
|
label,
|
||||||
}: {
|
}: {
|
||||||
active?: boolean;
|
active?: boolean;
|
||||||
payload?: any[];
|
payload?: Array<{
|
||||||
|
payload: {
|
||||||
|
priority: string;
|
||||||
|
Terminées: number;
|
||||||
|
'En cours': number;
|
||||||
|
completionRate: number;
|
||||||
|
total: number;
|
||||||
|
};
|
||||||
|
}>;
|
||||||
label?: string;
|
label?: string;
|
||||||
}) => {
|
}) => {
|
||||||
if (active && payload && payload.length) {
|
if (active && payload && payload.length) {
|
||||||
|
|||||||
@@ -43,13 +43,20 @@ export function StatusDistributionChart({
|
|||||||
value: item.count,
|
value: item.count,
|
||||||
}));
|
}));
|
||||||
|
|
||||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
||||||
const CustomTooltip = ({
|
const CustomTooltip = ({
|
||||||
active,
|
active,
|
||||||
payload,
|
payload,
|
||||||
}: {
|
}: {
|
||||||
active?: boolean;
|
active?: boolean;
|
||||||
payload?: any[];
|
payload?: Array<{
|
||||||
|
payload: {
|
||||||
|
name: string;
|
||||||
|
count: number;
|
||||||
|
percentage: number;
|
||||||
|
status: string;
|
||||||
|
value: number;
|
||||||
|
};
|
||||||
|
}>;
|
||||||
}) => {
|
}) => {
|
||||||
if (active && payload && payload.length) {
|
if (active && payload && payload.length) {
|
||||||
const data = payload[0].payload;
|
const data = payload[0].payload;
|
||||||
@@ -65,8 +72,14 @@ export function StatusDistributionChart({
|
|||||||
return null;
|
return null;
|
||||||
};
|
};
|
||||||
|
|
||||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
const CustomLabel = (props: {
|
||||||
const CustomLabel = (props: any) => {
|
cx: number;
|
||||||
|
cy: number;
|
||||||
|
midAngle: number;
|
||||||
|
innerRadius: number;
|
||||||
|
outerRadius: number;
|
||||||
|
percent: number;
|
||||||
|
}) => {
|
||||||
const { cx, cy, midAngle, innerRadius, outerRadius, percent } = props;
|
const { cx, cy, midAngle, innerRadius, outerRadius, percent } = props;
|
||||||
if (percent < 0.05) return null; // Ne pas afficher les labels pour les petites sections
|
if (percent < 0.05) return null; // Ne pas afficher les labels pour les petites sections
|
||||||
|
|
||||||
|
|||||||
@@ -21,14 +21,20 @@ export function VelocityTrendChart({
|
|||||||
data,
|
data,
|
||||||
className,
|
className,
|
||||||
}: VelocityTrendChartProps) {
|
}: VelocityTrendChartProps) {
|
||||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
||||||
const CustomTooltip = ({
|
const CustomTooltip = ({
|
||||||
active,
|
active,
|
||||||
payload,
|
payload,
|
||||||
label,
|
label,
|
||||||
}: {
|
}: {
|
||||||
active?: boolean;
|
active?: boolean;
|
||||||
payload?: any[];
|
payload?: Array<{
|
||||||
|
payload: {
|
||||||
|
date: string;
|
||||||
|
completed: number;
|
||||||
|
created: number;
|
||||||
|
velocity: number;
|
||||||
|
};
|
||||||
|
}>;
|
||||||
label?: string;
|
label?: string;
|
||||||
}) => {
|
}) => {
|
||||||
if (active && payload && payload.length) {
|
if (active && payload && payload.length) {
|
||||||
|
|||||||
Reference in New Issue
Block a user