Initial commit

frontend/src/components/shared/LineChart.tsx

@@ -0,0 +1,40 @@
+// Line Chart Component (Recharts wrapper)
+import { LineChart as RechartsLineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer } from 'recharts';
+
+interface LineChartProps {
+  data: Array<Record<string, any>>;
+  dataKey: string;
+  lines: Array<{
+    key: string;
+    name: string;
+    color: string;
+  }>;
+  height?: number;
+  xAxisKey?: string;
+}
+
+export default function LineChart({ data, dataKey, lines, height = 300, xAxisKey = 'date' }: LineChartProps) {
+  return (
+    <ResponsiveContainer width="100%" height={height}>
+      <RechartsLineChart data={data}>
+        <CartesianGrid strokeDasharray="3 3" />
+        <XAxis dataKey={xAxisKey} />
+        <YAxis />
+        <Tooltip />
+        <Legend />
+        {lines.map((line) => (
+          <Line
+            key={line.key}
+            type="monotone"
+            dataKey={line.key}
+            name={line.name}
+            stroke={line.color}
+            strokeWidth={2}
+            dot={{ r: 4 }}
+          />
+        ))}
+      </RechartsLineChart>
+    </ResponsiveContainer>
+  );
+}
+