Add src/app/dashboard/page.tsx

src/app/dashboard/page.tsx

@@ -0,0 +1,69 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+import { LayoutDashboard, ShoppingBag, Heart, Settings, User } from "lucide-react";
+
+export default function DashboardPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-magnetic"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="pill"
+        contentWidth="small"
+        sizing="large"
+        background="blurBottom"
+        cardStyle="solid"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Dashboard", id: "#" }
+            ]}
+            brandName="ServiceConnect"
+          />
+        </div>
+
+        <main className="container mx-auto py-20 px-4">
+          <h1 className="text-4xl font-extrabold mb-10">Customer Dashboard</h1>
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
+            <div className="p-6 border rounded-3xl bg-card shadow-sm">
+              <div className="flex items-center gap-3 mb-4"><User /> <h2 className="text-xl font-bold">Profile</h2></div>
+              <p>View and edit your personal information and preferences.</p>
+            </div>
+            <div className="p-6 border rounded-3xl bg-card shadow-sm">
+              <div className="flex items-center gap-3 mb-4"><ShoppingBag /> <h2 className="text-xl font-bold">Order History</h2></div>
+              <p>Track your current and past service bookings.</p>
+            </div>
+            <div className="p-6 border rounded-3xl bg-card shadow-sm">
+              <div className="flex items-center gap-3 mb-4"><Heart /> <h2 className="text-xl font-bold">Saved Items</h2></div>
+              <p>Manage your favorite services and companies.</p>
+            </div>
+            <div className="p-6 border rounded-3xl bg-card shadow-sm">
+              <div className="flex items-center gap-3 mb-4"><Settings /> <h2 className="text-xl font-bold">Settings</h2></div>
+              <p>Configure account security, notifications, and WhatsApp integration.</p>
+            </div>
+          </div>
+        </main>
+
+        <div id="footer" data-section="footer">
+          <FooterBaseReveal
+            logoText="ServiceConnect"
+            columns={[
+              { title: "Marketplace", items: [{ label: "Home", href: "/" }] },
+              { title: "Account", items: [{ label: "Dashboard", href: "/dashboard" }] },
+              { title: "Legal", items: [{ label: "Privacy", href: "#" }] },
+            ]}
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}