src/app/admin/page.tsx

@@ -0,0 +1,60 @@
+"use client";
+
+import { useState } from "react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
+import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
+import { BarChart3, TrendingUp, Users, DollarSign, Lock } from "lucide-react";
+
+export default function AdminPage() {
+  const [isAuthenticated, setIsAuthenticated] = useState(false);
+  const [password, setPassword] = useState("");
+
+  if (!isAuthenticated) {
+    return (
+      <div className="flex min-h-screen items-center justify-center bg-gray-50">
+        <div className="w-full max-w-sm rounded-xl bg-white p-8 shadow-lg">
+          <h2 className="mb-6 text-center text-xl font-semibold">Admin Authentication</h2>
+          <input
+            type="password"
+            className="mb-4 w-full rounded border p-2"
+            placeholder="Enter Password"
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+          />
+          <button
+            className="w-full rounded bg-black py-2 text-white"
+            onClick={() => password === "24244" && setIsAuthenticated(true)}
+          >
+            Login
+          </button>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <ThemeProvider>
+      <NavbarLayoutFloatingOverlay
+        navItems={[{ name: "Dashboard", id: "dashboard" }]}
+        brandName="Admin Panel"
+      />
+      <main className="pt-24">
+        <div id="dashboard" className="container mx-auto px-4">
+          <MetricCardThree
+            title="Performance Dashboard"
+            description="Real-time sales and growth analytics."
+            animationType="slide-up"
+            metrics={[
+              { id: "s1", title: "Total Sales", value: "$45,231", icon: DollarSign },
+              { id: "s2", title: "New Users", value: "1,240", icon: Users },
+              { id: "s3", title: "Growth Rate", value: "12.5%", icon: TrendingUp },
+              { id: "s4", title: "Conversion", value: "3.2%", icon: BarChart3 }
+            ]}
+            textboxLayout="default"
+          />
+        </div>
+      </main>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -36,7 +36,8 @@ export default function LandingPage() {
         { name: "Features", id: "features" },
         { name: "Results", id: "results" },
         { name: "FAQ", id: "faq" },
-        { name: "Contact", id: "contact" }
+        { name: "Contact", id: "contact" },
+        { name: "Admin", id: "/admin" }
       ]}
       brandName="BoostPulse"
     />