Merge pull request 'Added home page with dashboard content and SEO metadata' (#2) from fix/profile-contact-improvements into main

Reviewed-on: #2

src/app/(user)/home/page.tsx

@@ -0,0 +1,11 @@
+import { HomeDashboard } from '@/components/home/HomeDashboard';
+
+export const metadata = {
+  title: 'RE-Quest - Connect with Trusted Real Estate Professionals',
+  description:
+    'Discover verified real estate professionals for buying, selling, renting, and investing. Search by location, specialization, and expertise to connect with trusted agents on RE-Quest.',
+};
+
+export default function HomePage() {
+  return <HomeDashboard />;
+}

src/app/(user)/layout.tsx

@@ -1,23 +1,26 @@
-'use client';
+"use client";
 
-import { useSession } from 'next-auth/react';
+import { useSession } from "next-auth/react";
-import { useRouter, usePathname } from 'next/navigation';
+import { useRouter, usePathname } from "next/navigation";
-import { useEffect } from 'react';
+import { useEffect } from "react";
-import Image from 'next/image';
+import Image from "next/image";
-import { Footer } from '@/components/layout/Footer';
+import { Footer } from "@/components/layout/Footer";
-import { CommonHeader } from '@/components/layout/CommonHeader';
+import { CommonHeader } from "@/components/layout/CommonHeader";
-import { PresenceProvider } from '@/components/providers/presence-provider';
+import { PresenceProvider } from "@/components/providers/presence-provider";
 
 // Pages that don't require authentication
 const publicPaths = [
-  '/user/dashboard',
+  "/home",
-  '/user/profiles',
+  "/user/dashboard",
-  '/user/profile/', // Agent profile view (includes /user/profile/[id])
+  "/user/profiles",
+  "/user/profile/", // Agent profile view (includes /user/profile/[id])
 ];
 
 // Check if current path is public
 const isPublicPath = (pathname: string) => {
-  return publicPaths.some(path => pathname === path || pathname.startsWith(path));
+  return publicPaths.some(
+    (path) => pathname === path || pathname.startsWith(path),
+  );
 };
 
 export default function UserLayout({
@@ -28,11 +31,12 @@ export default function UserLayout({
   const { data: session, status } = useSession();
   const router = useRouter();
   const pathname = usePathname();
-  const isDashboard = pathname === '/user/dashboard';
+  // const isDashboard = pathname === "/user/dashboard";
+  const isDashboard = pathname === "/user/dashboard" || pathname === "/home";
   const isPublic = isPublicPath(pathname);
 
   useEffect(() => {
-    if (status === 'loading') return;
+    if (status === "loading") return;
 
     // Allow public pages without authentication.
     // Agents are intentionally allowed to land on /user/dashboard — the logo
@@ -49,19 +53,31 @@ export default function UserLayout({
 
     // Redirect agents to agent dashboard for protected user pages
     const userRole = (session.user as any)?.role;
-    if (userRole === 'AGENT') {
+    if (userRole === "AGENT") {
-      router.replace('/agent/dashboard');
+      router.replace("/agent/dashboard");
     }
   }, [session, status, router, pathname, isPublic]);
 
   const splashLoading = (
     <div
       className="min-h-screen flex flex-col items-center justify-center"
-      style={{ background: 'linear-gradient(to bottom, #c4d9d4, #f0f5fc)' }}
+      style={{ background: "linear-gradient(to bottom, #c4d9d4, #f0f5fc)" }}
     >
-      <Image src="/assets/images/splash-house.png" alt="" width={150} height={108} priority />
+      <Image
+        src="/assets/images/splash-house.png"
+        alt=""
+        width={150}
+        height={108}
+        priority
+      />
       <div className="mt-[35px]">
-        <Image src="/assets/images/splash-logo.png" alt="RE-Quest" width={264} height={55} priority />
+        <Image
+          src="/assets/images/splash-logo.png"
+          alt="RE-Quest"
+          width={264}
+          height={55}
+          priority
+        />
       </div>
       <div className="mt-8">
         <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-[#00293d]" />
@@ -70,7 +86,7 @@ export default function UserLayout({
   );
 
   // Show loading only for protected pages while checking auth
-  if (status === 'loading' && !isPublic) {
+  if (status === "loading" && !isPublic) {
     return splashLoading;
   }
 
@@ -105,9 +121,7 @@ export default function UserLayout({
             </div>
 
             {/* Main Content */}
-            <main className="flex-1">
+            <main className="flex-1">{children}</main>
-              {children}
-            </main>
           </>
         )}
 

src/app/(user)/user/dashboard/page.tsx

@@ -1,53 +1,7 @@
 'use client';
 
-import { useState, useEffect } from 'react';
+import { HomeDashboard } from '@/components/home/HomeDashboard';
-import { HeroSection } from '@/components/home/HeroSection';
-import { FeaturesSection } from '@/components/home/FeaturesSection';
-import { TopProfessionals } from '@/components/home/TopProfessionals';
-import { TestimonialsSection } from '@/components/home/TestimonialsSection';
-import { cmsService, resolveImageUrl } from '@/services/cms.service';
-import type { HeroContent, FeaturesContent, TopProfessionalsContent, TestimonialsContent, CmsContentRecord } from '@/types/cms';
 
 export default function UserDashboard() {
-  const [cmsData, setCmsData] = useState<Record<string, unknown>>({});
+  return <HomeDashboard />;
-  const [cmsLoaded, setCmsLoaded] = useState(false);
-
-  useEffect(() => {
-    const fetchCms = async () => {
-      try {
-        const sections = await cmsService.getPageContent('landing');
-        const data: Record<string, unknown> = {};
-        for (const s of sections) {
-          const content = s.content as Record<string, unknown>;
-          // Resolve S3 keys in image fields
-          if (s.sectionKey === 'features' && Array.isArray(content.features)) {
-            for (const feat of content.features as { iconPath?: string }[]) {
-              if (feat.iconPath) feat.iconPath = await resolveImageUrl(feat.iconPath);
-            }
-          }
-          if (s.sectionKey === 'testimonials' && Array.isArray(content.stats)) {
-            for (const stat of content.stats as { iconPath?: string }[]) {
-              if (stat.iconPath) stat.iconPath = await resolveImageUrl(stat.iconPath);
-            }
-          }
-          data[s.sectionKey] = content;
-        }
-        setCmsData(data);
-      } catch {
-        // Use default content on error
-      } finally {
-        setCmsLoaded(true);
-      }
-    };
-    fetchCms();
-  }, []);
-
-  return (
-    <div>
-      <HeroSection content={cmsData.hero as HeroContent | undefined} />
-      {cmsLoaded && <FeaturesSection content={cmsData.features as FeaturesContent | undefined} />}
-      <TopProfessionals content={cmsData.topProfessionals as TopProfessionalsContent | undefined} />
-      <TestimonialsSection content={cmsData.testimonials as TestimonialsContent | undefined} />
-    </div>
-  );
 }

src/app/(user)/user/profile/[id]/page.tsx

@@ -533,7 +533,7 @@ export default function AgentProfileView() {
           </div>
 
           {/* Right Content - Profile Info + Experience + All Sections */}
-          <div className="flex-1 space-y-4">
+          <div className="flex-1 min-w-0 space-y-4">
             {/* Profile Card - No edit button for user view */}
             <ProfileCard
               firstName={agentProfile.firstName}

src/app/page.tsx

@@ -1,27 +1,27 @@
-'use client';
+"use client";
 
-import { useSession } from 'next-auth/react';
+import { useSession } from "next-auth/react";
-import { useRouter } from 'next/navigation';
+import { useRouter } from "next/navigation";
-import { useEffect } from 'react';
+import { useEffect } from "react";
 
 export default function Home() {
   const { data: session, status } = useSession();
   const router = useRouter();
 
   useEffect(() => {
-    if (status === 'loading') return;
+    if (status === "loading") return;
 
     // Redirect based on user role, or to public dashboard if not logged in
     if (session) {
       const userRole = (session.user as any)?.role;
-      if (userRole === 'AGENT') {
+      if (userRole === "AGENT") {
-        router.replace('/agent/dashboard');
+        router.replace("/agent/dashboard");
       } else {
-        router.replace('/user/dashboard');
+        router.replace("/user/dashboard");
       }
     } else {
       // Not logged in - go to public user dashboard
-      router.replace('/user/dashboard');
+      router.replace("/home");
     }
   }, [session, status, router]);
 

src/components/home/HomeDashboard.tsx

@@ -0,0 +1,54 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import { HeroSection } from '@/components/home/HeroSection';
+import { FeaturesSection } from '@/components/home/FeaturesSection';
+import { TopProfessionals } from '@/components/home/TopProfessionals';
+import { TestimonialsSection } from '@/components/home/TestimonialsSection';
+import { cmsService, resolveImageUrl } from '@/services/cms.service';
+import type { HeroContent, FeaturesContent, TopProfessionalsContent, TestimonialsContent } from '@/types/cms';
+
+// Shared landing/dashboard content rendered by both /home and /user/dashboard.
+export function HomeDashboard() {
+  const [cmsData, setCmsData] = useState<Record<string, unknown>>({});
+  const [cmsLoaded, setCmsLoaded] = useState(false);
+
+  useEffect(() => {
+    const fetchCms = async () => {
+      try {
+        const sections = await cmsService.getPageContent('landing');
+        const data: Record<string, unknown> = {};
+        for (const s of sections) {
+          const content = s.content as Record<string, unknown>;
+          // Resolve S3 keys in image fields
+          if (s.sectionKey === 'features' && Array.isArray(content.features)) {
+            for (const feat of content.features as { iconPath?: string }[]) {
+              if (feat.iconPath) feat.iconPath = await resolveImageUrl(feat.iconPath);
+            }
+          }
+          if (s.sectionKey === 'testimonials' && Array.isArray(content.stats)) {
+            for (const stat of content.stats as { iconPath?: string }[]) {
+              if (stat.iconPath) stat.iconPath = await resolveImageUrl(stat.iconPath);
+            }
+          }
+          data[s.sectionKey] = content;
+        }
+        setCmsData(data);
+      } catch {
+        // Use default content on error
+      } finally {
+        setCmsLoaded(true);
+      }
+    };
+    fetchCms();
+  }, []);
+
+  return (
+    <div>
+      <HeroSection content={cmsData.hero as HeroContent | undefined} />
+      {cmsLoaded && <FeaturesSection content={cmsData.features as FeaturesContent | undefined} />}
+      <TopProfessionals content={cmsData.topProfessionals as TopProfessionalsContent | undefined} />
+      <TestimonialsSection content={cmsData.testimonials as TestimonialsContent | undefined} />
+    </div>
+  );
+}

src/components/layout/CommonHeader.tsx

@@ -7,6 +7,7 @@ import { useSession } from "next-auth/react";
 import { useHeaderData } from "@/components/providers/header-provider";
 
 const navLinks = [
+  { label: "Professional", href: "/user/profiles" },
   { label: "Education", href: "/education" },
   { label: "About Us", href: "/about" },
   { label: "FAQ's", href: "/faq" },
@@ -56,6 +57,7 @@ export function CommonHeader() {
     if (showProfileMenu || showGuestMenu || showMobileMenu) {
       document.addEventListener("mousedown", handleClickOutside);
     }
+    // const showProfessional = userRole === "AGENT" || userRole === "LENDER";
 
     return () => {
       document.removeEventListener("mousedown", handleClickOutside);
@@ -66,12 +68,13 @@ export function CommonHeader() {
   const userName = profileName || session?.user?.name;
   const userEmail = session?.user?.email;
   const userRole = (session?.user as any)?.role;
-  const showProfessional = userRole === "AGENT" || userRole === "LENDER";
+  // const showProfessional = userRole === "AGENT" || userRole === "LENDER";
   // Use fetched profile image, fallback to session image
   const userImage = profileImage || session?.user?.image;
 
   // Logo destination — always lands on the user dashboard regardless of role.
-  const dashboardLink = "/user/dashboard";
+  // const dashboardLink = "/user/dashboard";
+  const dashboardLink = "/home";
 
   return (
     <header
@@ -92,7 +95,7 @@ export function CommonHeader() {
         </Link>
 
         {/* Navigation - Desktop only */}
-        {/* <nav className="hidden md:flex items-center gap-8 ml-auto mr-8">
+        <nav className="hidden md:flex items-center gap-8 ml-auto mr-8">
           {navLinks.map((link) => (
             <Link
               key={link.href}
@@ -102,8 +105,8 @@ export function CommonHeader() {
               {link.label}
             </Link>
           ))}
-        </nav> */}
+        </nav>
-        <nav className="hidden md:flex items-center gap-8 ml-auto mr-8">
+        {/* <nav className="hidden md:flex items-center gap-8 ml-auto mr-8">
           {showProfessional && (
             <Link
               href="/user/profiles"
@@ -122,7 +125,7 @@ export function CommonHeader() {
               {link.label}
             </Link>
           ))}
-        </nav>
+        </nav> */}
 
         {/* Right Side Icons */}
         <div className="flex items-center gap-2 md:gap-4">
@@ -470,7 +473,7 @@ export function CommonHeader() {
       {/* Mobile Navigation Menu */}
       {showMobileMenu && (
         <div className="md:hidden border-t border-white/20 py-3 pb-4">
-          {/* <nav className="flex flex-col gap-1">
+          <nav className="flex flex-col gap-1">
             {navLinks.map((link) => (
               <Link
                 key={link.href}
@@ -481,8 +484,8 @@ export function CommonHeader() {
                 {link.label}
               </Link>
             ))}
-          </nav> */}
+          </nav>
-          <nav className="flex flex-col gap-1">
+          {/* <nav className="flex flex-col gap-1">
             {showProfessional && (
               <Link
                 href="/user/profiles"
@@ -503,7 +506,7 @@ export function CommonHeader() {
                 {link.label}
               </Link>
             ))}
-          </nav>
+          </nav> */}
         </div>
       )}
     </header>

src/components/profile/ProfileCard.tsx

@@ -276,7 +276,7 @@ export function ProfileCard({
       </div>
 
       {/* Bio */}
-      <p className="text-[14px] font-normal text-[#00293D] font-serif leading-[20px] mb-4 text-center lg:text-left">
+      <p className="text-[14px] font-normal text-[#00293D] font-serif leading-[20px] mb-4 text-center lg:text-left break-words">
         {bio}
       </p>
 

src/middleware.ts

@@ -2,10 +2,30 @@ import { auth } from "@/auth";
 import { NextResponse } from "next/server";
 
 // Auth routes - logged-in users should be redirected away from these
-const authRoutes = ["/login", "/signup", "/forgot-password", "/reset-password", "/verify-email"];
+const authRoutes = [
+  "/login",
+  "/signup",
+  "/forgot-password",
+  "/reset-password",
+  "/verify-email",
+];
 
 // Public routes - accessible to everyone (logged in or not)
-const publicRoutes = ["/", "/contact", "/about", "/faq", "/education", "/coming-soon", "/privacy-policy", "/terms-of-service", "/logout", "/user/dashboard", "/user/profiles", "/user/profile"];
+const publicRoutes = [
+  "/",
+  "/home",
+  "/contact",
+  "/about",
+  "/faq",
+  "/education",
+  "/coming-soon",
+  "/privacy-policy",
+  "/terms-of-service",
+  "/logout",
+  "/user/dashboard",
+  "/user/profiles",
+  "/user/profile",
+];
 
 // Routes that should NEVER be redirected away from (even if logged in)
 const noRedirectRoutes = ["/logout"];
@@ -16,23 +36,27 @@ export default auth((req) => {
   const userRole = (req.auth?.user as any)?.role;
 
   const isAuthRoute = authRoutes.some(
-    (route) => nextUrl.pathname === route || nextUrl.pathname.startsWith(route + "/")
+    (route) =>
+      nextUrl.pathname === route || nextUrl.pathname.startsWith(route + "/"),
   );
 
   const isPublicRoute = publicRoutes.some(
-    (route) => nextUrl.pathname === route || nextUrl.pathname.startsWith(route + "/")
+    (route) =>
+      nextUrl.pathname === route || nextUrl.pathname.startsWith(route + "/"),
   );
 
   const isAgentRoute = nextUrl.pathname.startsWith("/agent");
   const isUserRoute = nextUrl.pathname.startsWith("/user");
 
   const isApiRoute = nextUrl.pathname.startsWith("/api");
-  const isStaticRoute = nextUrl.pathname.startsWith("/_next") ||
+  const isStaticRoute =
-                        nextUrl.pathname.startsWith("/assets") ||
+    nextUrl.pathname.startsWith("/_next") ||
-                        nextUrl.pathname.includes(".");
+    nextUrl.pathname.startsWith("/assets") ||
+    nextUrl.pathname.includes(".");
 
   const isNoRedirectRoute = noRedirectRoutes.some(
-    (route) => nextUrl.pathname === route || nextUrl.pathname.startsWith(route + "/")
+    (route) =>
+      nextUrl.pathname === route || nextUrl.pathname.startsWith(route + "/"),
   );
 
   // Skip middleware for API routes and static files