Dashboard

1"use client";
2 
3import type React from "react";
4 
5import { NativeButton } from "../../native/baseui/native-button-baseui";
6import { cn } from "@/lib/utils";
7import { motion, type Variants } from "framer-motion";
8import {
9  Activity,
10  BarChart3,
11  ChevronRight,
12  Clock,
13  DollarSign,
14  Download,
15  Menu,
16  Percent,
17  Settings,
18  TrendingDown,
19  TrendingUp,
20  Users,
21  Zap,
22} from "lucide-react";
23import { useState } from "react";
24import {
25  CartesianGrid,
26  Line,
27  LineChart,
28  ResponsiveContainer,
29  Tooltip,
30  XAxis,
31  YAxis,
32} from "recharts";
33 
34// ============================================================================
35// TYPES & INTERFACES
36// ============================================================================
37 
38interface MetricCardProps {
39  label: string;
40  value: string;
41  change: string;
42  trend: "up" | "down";
43  icon: React.ReactNode;
44}
45 
46interface ChartCardProps {
47  title: string;
48  description: string;
49  data: Array<{ name: string; value: number }>;
50  dataKey: string;
51  height?: number;
52}
53 
54interface DetailItem {
55  label: string;
56  value: string;
57  subtitle: string;
58}
59 
60interface DetailedCardProps {
61  title: string;
62  items: DetailItem[];
63}
64 
65// ============================================================================
66// LOCAL COMPONENTS
67// ============================================================================
68 
69interface BadgeProps extends React.HTMLAttributes<HTMLDivElement> {
70  variant?: "default" | "secondary" | "destructive" | "outline";
71}
72 
73function Badge({ className, variant = "default", ...props }: BadgeProps) {
74  return (
75    <div
76      className={cn(
77        "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
78        {
79          "border-transparent bg-primary text-primary-foreground hover:bg-primary/80":
80            variant === "default",
81          "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80":
82            variant === "secondary",
83          "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80":
84            variant === "destructive",
85          "text-foreground": variant === "outline",
86        },
87        className
88      )}
89      {...props}
90    />
91  );
92}
93 
94// ============================================================================
95// STATIC CHART DATA - EXTENSIVE DUMMY DATA FOR PROPER RENDERING
96// … truncated