mirror of
https://github.com/kjanat/livedash-node.git
synced 2026-02-13 22:35:47 +01:00
Kaj Kowalski
5bfd762e55
- Update tsconfig to ES2024 target and bundler moduleResolution - Add dynamic imports for chart.js and recharts (bundle optimization) - Consolidate 17 useState into useReducer in sessions page - Fix 18 .js extension imports across lib files - Add type declarations for @rapideditor/country-coder - Fix platform user types (PlatformUserRole enum) - Fix Calendar component prop types - Centralize next-auth type augmentation - Add force-dynamic to all API routes (prevent build-time prerender) - Fix Prisma JSON null handling with Prisma.DbNull - Fix various type mismatches (SessionMessage, ImportRecord, etc.) - Export ButtonProps from button component - Update next-themes import path - Replace JSX.Element with React.ReactElement - Remove obsolete debug scripts and pnpm lockfile - Downgrade eslint to v8 for next compatibility
71 lines
1.6 KiB
TypeScript
71 lines
1.6 KiB
TypeScript
"use client";
|
|
|
|
import dynamic from "next/dynamic";
|
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
|
|
|
interface LineChartData {
|
|
date: string;
|
|
value: number;
|
|
[key: string]: string | number;
|
|
}
|
|
|
|
interface LineChartProps {
|
|
data: LineChartData[];
|
|
title?: string;
|
|
dataKey?: string;
|
|
color?: string;
|
|
gradient?: boolean;
|
|
height?: number;
|
|
className?: string;
|
|
}
|
|
|
|
const ChartSkeleton = ({ height = 300 }: { height?: number }) => (
|
|
<div className="animate-pulse" style={{ height }}>
|
|
<div className="h-full w-full bg-muted rounded-md relative overflow-hidden">
|
|
<svg className="w-full h-full" preserveAspectRatio="none">
|
|
<path
|
|
d="M0,150 Q50,100 100,120 T200,80 T300,100 T400,60 T500,90"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
className="text-muted-foreground/20"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
);
|
|
|
|
const LineChartInner = dynamic(() => import("./line-chart-inner"), {
|
|
ssr: false,
|
|
loading: () => <ChartSkeleton />,
|
|
});
|
|
|
|
export default function ModernLineChart({
|
|
data,
|
|
title,
|
|
dataKey = "value",
|
|
color = "hsl(var(--primary))",
|
|
gradient = true,
|
|
height = 300,
|
|
className,
|
|
}: LineChartProps) {
|
|
return (
|
|
<Card className={className}>
|
|
{title && (
|
|
<CardHeader>
|
|
<CardTitle className="text-lg font-semibold">{title}</CardTitle>
|
|
</CardHeader>
|
|
)}
|
|
<CardContent>
|
|
<LineChartInner
|
|
data={data}
|
|
dataKey={dataKey}
|
|
color={color}
|
|
gradient={gradient}
|
|
height={height}
|
|
/>
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
}
|