feat: Dashboards

package.json

@@ -41,6 +41,7 @@
     "react-intersection-observer": "^9.16.0",
     "react-quill": "^2.0.0",
     "react-toastify": "^11.0.5",
+    "recharts": "^3.1.2",
     "sharp": "^0.33.5",
     "starknet": "^6.23.1",
     "starknetkit": "^2.12.1",

src/app/dashboard/admin/blog-management/page.tsx

@@ -0,0 +1,7 @@
+import React from "react";
+
+function page() {
+  return <div>page</div>;
+}
+
+export default page;

src/app/dashboard/admin/help-center/page.tsx

@@ -0,0 +1,7 @@
+import React from "react";
+
+function page() {
+  return <div>page</div>;
+}
+
+export default page;

src/app/dashboard/admin/layout.tsx

@@ -0,0 +1,45 @@
+import DashboardNav from "../components/resuables/DashboardNav";
+
+export default function Layout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  const nav_items = [
+    { href: "/dashboard/admin/overview", label: "Overview" },
+    {
+      href: "/dashboard/admin/projects",
+      label: "Projects",
+    },
+    {
+      href: "/dashboard/admin/researchers",
+      label: "Researchers",
+    },
+    {
+      href: "/dashboard/admin/validators",
+      label: "Validators",
+    },
+    {
+      href: "/dashboard/admin/metrics",
+      label: "Metrics",
+    },
+    {
+      href: "/dashboard/admin/blog-management",
+      label: "Blog Management",
+    },
+    {
+      href: "/dashboard/admin/help-center",
+      label: "Help Center",
+    },
+    {
+      href: "/dashboard/admin/suspension",
+      label: "Suspension",
+    },
+  ];
+  return (
+    <div className="flex flex-col gap-y-6">
+      <DashboardNav navItems={nav_items} />
+      {children}
+    </div>
+  );
+}

src/app/dashboard/admin/metrics/page.tsx

@@ -0,0 +1,7 @@
+import React from "react";
+
+function page() {
+  return <div>page</div>;
+}
+
+export default page;

src/app/dashboard/admin/overview/components/AdminOverviewStats.tsx

@@ -0,0 +1,57 @@
+import StatCard from "@/app/dashboard/components/resuables/StatCard";
+import { CircleDollarSign, FileText, FolderOpen } from "lucide-react";
+
+const dummy_stats = [
+  {
+    label: "Total Projects",
+    value: "24",
+    icon: <FolderOpen />,
+    badgeText: "+12% from last month",
+  },
+  {
+    label: "Active Validators",
+    value: "18,429",
+    icon: <FileText />,
+    badgeText: "+8% from last month",
+  },
+  {
+    label: "Active Researchers",
+    value: "247",
+    icon: <CircleDollarSign />,
+    badgeText: "+5.4% from yesterday",
+  },
+  {
+    label: "Total Revenue",
+    value: "$700K",
+    icon: <CircleDollarSign />,
+    badgeText: "+0.2% this quarter",
+  },
+  {
+    label: "Vulnerabilities Found",
+    value: "24",
+    icon: <FolderOpen />,
+    badgeText: "+12% from last month",
+  },
+  {
+    label: "Avg Completion Time",
+    value: "24",
+    icon: <FolderOpen />,
+    badgeText: "+12% from last month",
+  },
+];
+
+function AdminOverviewStats() {
+  return (
+    <div className="grid grid-cols-1 lg:grid-cols-3 gap-3">
+      {dummy_stats.map((stat, id) => (
+        <StatCard
+          key={id}
+          stat={stat}
+          badgeStyle="bg-[#153710] text-[#1BC100]"
+        />
+      ))}
+    </div>
+  );
+}
+
+export default AdminOverviewStats;