Refactor root admin dashboards and settings

2026-03-10 16:43:43 +01:00
parent db6c5392bb
commit 5b51a2a063
26 changed files with 1121 additions and 781 deletions
@@ -0,0 +1,47 @@
+import type { LucideIcon } from "lucide-react";
+import type { ReactNode } from "react";
+
+import { AppCard } from "@/components/ui/app-card";
+import { CardContent } from "@/components/ui/card";
+
+type StatsCardProps = {
+  title: string;
+  value: string;
+  icon?: LucideIcon;
+  description?: string;
+  footer?: ReactNode;
+  className?: string;
+};
+
+export function StatsCard({
+  title,
+  value,
+  icon: Icon,
+  description,
+  footer,
+  className,
+}: StatsCardProps) {
+  return (
+    <AppCard level={3} className={className}>
+      <CardContent className="space-y-2.5 p-3">
+        <div className="flex items-start justify-between gap-3">
+          <div>
+            <p className="text-sm font-semibold text-foreground">{title}</p>
+            <p className="mt-1 text-3xl font-semibold text-foreground">{value}</p>
+          </div>
+          {Icon ? (
+            <div className="rounded-nested border border-border bg-muted/50 p-2 text-muted-foreground">
+              <Icon className="h-4 w-4" />
+            </div>
+          ) : null}
+        </div>
+
+        {description ? (
+          <p className="text-sm text-muted-foreground">{description}</p>
+        ) : null}
+
+        {footer ? footer : null}
+      </CardContent>
+    </AppCard>
+  );
+}