File size: 1,187 Bytes
75137c7 2251e03 75137c7 |
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 42 43 44 45 46 |
import React from 'react';
import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer } from 'recharts';
import type { TimeStats } from '../../utils/analysis.utils.ts';
type TimeSeriesChartProps = {
data: TimeStats[];
};
const TimeSeriesChart = ({ data }: TimeSeriesChartProps) => {
// Format date for display
const chartData = data.map((item) => ({
...item,
dateDisplay: new Date(item.date).toLocaleDateString('en-US', {
month: 'short',
day: 'numeric',
}),
}));
return (
<div className="h-64 w-full">
<ResponsiveContainer width="100%" height="100%">
<LineChart
data={chartData}
margin={{ top: 5, right: 30, left: 20, bottom: 5 }}
>
<CartesianGrid strokeDasharray="3 3" />
<XAxis dataKey="dateDisplay" />
<YAxis />
<Tooltip />
<Legend />
<Line
type="monotone"
dataKey="count"
stroke="#3b82f6"
strokeWidth={2}
name="Arguments Analyzed"
/>
</LineChart>
</ResponsiveContainer>
</div>
);
};
export default TimeSeriesChart;
|