feat: Conditionally render the header layout based on whether the current path is the user dashboard.

src/app/(user)/layout.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useSession } from 'next-auth/react';
-import { useRouter } from 'next/navigation';
+import { useRouter, usePathname } from 'next/navigation';
 import { useEffect } from 'react';
 import { Footer } from '@/components/layout/Footer';
 import { CommonHeader } from '@/components/layout/CommonHeader';
@@ -13,6 +13,9 @@ export default function UserLayout({
 }) {
   const { data: session, status } = useSession();
   const router = useRouter();
+  const pathname = usePathname();
+
+  const isDashboard = pathname === '/user/dashboard';
 
   useEffect(() => {
     if (status === 'loading') return;
@@ -39,16 +42,34 @@ export default function UserLayout({
 
   return (
     <div className="min-h-screen flex flex-col">
-      {/* Main Content with Header inside */}
-      <main className="flex-1 relative">
-        {/* Header overlaying the content */}
-        <div className="absolute top-0 left-0 right-0 z-50 px-4 py-3">
-          <div className="max-w-7xl mx-auto">
-            <CommonHeader />
+      {isDashboard ? (
+        <>
+          {/* Main Content with Header Overlay for Dashboard */}
+          <main className="flex-1 relative">
+            {/* Header overlaying the content */}
+            <div className="absolute top-0 left-0 right-0 z-50 px-4 py-3">
+              <div className="max-w-7xl mx-auto">
+                <CommonHeader />
+              </div>
+            </div>
+            {children}
+          </main>
+        </>
+      ) : (
+        <>
+          {/* Regular Header for other pages */}
+          <div className="px-4 py-3 bg-white">
+            <div className="max-w-7xl mx-auto">
+              <CommonHeader />
+            </div>
           </div>
-        </div>
-        {children}
-      </main>
+
+          {/* Main Content */}
+          <main className="flex-1">
+            {children}
+          </main>
+        </>
+      )}
 
       {/* Footer */}
       <Footer />