From 0e418964cfef07abfb4c5cb7af7b22fd26ad6d91 Mon Sep 17 00:00:00 2001
From: root <root@vps1170145.hostsailor.com>
Date: Thu, 19 Feb 2026 13:15:19 +0000
Subject: [PATCH] fix: use searchParams from useSearchParams for vertical
 routing

- Use searchParams from Next.js useSearchParams hook instead of window.location
- Add searchParams as useEffect dependency to properly update when URL changes
- Add fallback for vertical content to prevent SSR hydration issues

This fixes the bug where all demo pages showed real-estate content.
---
 app/demos/page.tsx | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/app/demos/page.tsx b/app/demos/page.tsx
index 2616a24..877d895 100644
--- a/app/demos/page.tsx
+++ b/app/demos/page.tsx
@@ -222,6 +222,7 @@ function DemosContent() {
   const [lang, setLang] = useState<Language>("es");
   const [selected, setSelected] = useState<Vertical>("real-estate");
   const [contactOpen, setContactOpen] = useState(false);
+  const [initialized, setInitialized] = useState(false);
   const [formData, setFormData] = useState({ 
     businessName: "", 
     contactName: "", 
@@ -242,25 +243,27 @@ function DemosContent() {
   const [formSubmitted, setFormSubmitted] = useState(false);
 
   useEffect(() => {
-    if (typeof window === "undefined") return;
-    // Read directly from URL
-    const params = new URLSearchParams(window.location.search);
-    const urlVertical = params.get("vertical");
-    const urlType = params.get("type");
-    const urlName = params.get("name");
+    if (!searchParams) return;
+    
+    // Get vertical from URL
+    const urlVertical = searchParams.get("vertical");
+    const urlType = searchParams.get("type");
     
     if (urlVertical && ["real-estate", "restaurant", "clinic", "home-services"].includes(urlVertical)) {
       setSelected(urlVertical as Vertical);
     } else if (urlType && ["real-estate", "restaurant", "clinic", "home-services"].includes(urlType)) {
       setSelected(urlType as Vertical);
     }
+    
+    // Get name from URL
+    const urlName = searchParams.get("name");
     if (urlName) {
       setBusinessName(decodeURIComponent(urlName));
     }
-  }, []);
+  }, [searchParams]);
 
   const t = contentByLang[lang];
-  const v = verticals[selected][lang];
+  const v = verticals[selected]?.[lang] || verticals["real-estate"][lang];
   const vName = verticalNames[lang][selected];
 
   useEffect(() => {