src/app/admin/page.tsx

@@ -0,0 +1,64 @@
+"use client";
+
+import ReactLenis from "lenis/react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
+import FeatureBento from "@/components/sections/feature/FeatureBento";
+import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
+import { Shield, Users, Settings, Bell, FileText, UserCheck } from "lucide-react";
+
+export default function AdminDashboardPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="text-stagger"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="pill"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="metallic"
+      secondaryButtonStyle="glass"
+      headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <NavbarLayoutFloatingOverlay
+          brandName="Admin Panel"
+          navItems={[
+            { name: "Dashboard", id: "dashboard" },
+            { name: "Users", id: "users" },
+            { name: "Settings", id: "settings" },
+          ]}
+          button={{ text: "Logout", href: "/" }}
+        />
+        <div className="pt-32 pb-20">
+          <FeatureBento
+            title="Admin Dashboard"
+            description="Overview of village management operations and system status."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            animationType="slide-up"
+            features={[
+              { title: "User Management", description: "Manage residents, admins, and security staff accounts.", bentoComponent: "reveal-icon", icon: Users },
+              { title: "System Settings", description: "Configure gate access rules, notification templates, and system preferences.", bentoComponent: "reveal-icon", icon: Settings },
+              { title: "Alerts & Logs", description: "Monitor real-time gate access and system activity logs.", bentoComponent: "reveal-icon", icon: Bell },
+            ]}
+          />
+          <MetricCardOne
+            title="System Insights"
+            description="Real-time data on village management efficiency."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            gridVariant="uniform-all-items-equal"
+            animationType="slide-up"
+            metrics={[
+              { id: "active", value: "85%", title: "Active Users", description: "Platform engagement rate", icon: UserCheck },
+              { id: "logs", value: "42", title: "New Alerts", description: "Requiring attention", icon: FileText },
+              { id: "security", value: "Active", title: "System Status", description: "All services running", icon: Shield },
+            ]}
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -65,24 +65,21 @@ export default function WebAgency2Page() {
           carouselItemClassName="!aspect-[4/5]"
         />
         <FeatureBento
-          title="Key Modules for Every Role"
-          description="Unified access control and management for a safer, more connected neighborhood."
+          id="dashboard"
+          title="Admin Dashboard Modules"
+          description="Comprehensive control systems for village operations."
           textboxLayout="default"
           useInvertedBackground={false}
           animationType="slide-up"
           features={[
             {
-              title: "Admin Hub",              description: "Streamlined billing, facility scheduling, and resident management tools.",              bentoComponent: "reveal-icon",              icon: Building2,
+              title: "Resident Management",              description: "Maintain updated resident databases, vehicle registry, and household profiles.",              bentoComponent: "reveal-icon",              icon: Users,
             },
             {
-              title: "Resident Portal",              description: "Submit requests, pay dues, and receive community announcements instantly.",              bentoComponent: "media-stack",              items: [
-                { imageSrc: "http://img.b2bpic.net/free-photo/crop-hands-near-tablet-with-plan_23-2147785623.jpg", imageAlt: "Resident dashboard overview" },
-                { imageSrc: "http://img.b2bpic.net/free-vector/interface-charity-application_23-2148632019.jpg", imageAlt: "Billing and payments portal" },
-                { imageSrc: "http://img.b2bpic.net/free-vector/illustation-loan-application_53876-20579.jpg", imageAlt: "Request tracking" },
-              ],
+              title: "Security Operations",              description: "Centralized monitoring of CCTVs, patrol routes, and emergency broadcast alerts.",              bentoComponent: "reveal-icon",              icon: Shield,
             },
             {
-              title: "Security Interface",              description: "Real-time visitor logs, gate access validation, and emergency broadcast systems.",              bentoComponent: "reveal-icon",              icon: Shield,
+              title: "Access Control",              description: "Manage gate entry credentials, visitor pass logs, and automated barrier synchronization.",              bentoComponent: "reveal-icon",              icon: KeyRound,
             },
           ]}
         />
@@ -177,4 +174,4 @@ export default function WebAgency2Page() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}