fix select city

src/components/Navbar.tsx

@@ -327,7 +327,7 @@ export default function Navbar({
               </motion.div>
 
               <div className="absolute -translate-x-1/2 flex items-center gap-5"
-              style={{ left: '45%', }}
+                style={{ left: '45%', }}
               >
                 {/* Navigation Items based on page type */}
                 {navigationItems.map((item) => (
@@ -365,7 +365,7 @@ export default function Navbar({
                     />
                   </Link>
                 ))}
-                
+
               </div>
 
               {/* Right Section */}
@@ -373,36 +373,35 @@ export default function Navbar({
 
                 {/* City Dropdown */}
                 <Dropdown
-                  ref={cityRef}
-                  isOpen={activeCityDropdown}
-                  onToggle={() => {
-                    console.log('City dropdown toggled');
-                    // Add a small delay to prevent rapid state changes
-                    setTimeout(() => {
-                      setActiveCityDropdown(!activeCityDropdown);
-                    }, 50);
-                  }}
-                  items={cities.map(city => ({
-                    id: 'city-change',
-                    label: city.label,
-                    action: () => {
-                      console.log('City action called:', city.id);
-                      handleCityChange(city.id);
-                    }
-                  }))}
-                  title="Select City"
-                  trigger={
-                    <div className="flex items-center space-x-1.5 text-gray-700 hover:text-gray-900 text-base font-medium transition-colors duration-200 cursor-pointer rounded-lg hover:bg-gray-50/50 px-2 py-1">
-                      <span>
-                        {isLandingPage
-                          ? 'Select City'
-                          : activeCity.charAt(0).toUpperCase() + activeCity.slice(1)
-                        }
-                      </span>
-                      <ChevronDown className={`w-3.5 h-3.5 transition-transform duration-200 ${activeCityDropdown ? 'rotate-180' : ''}`} />
-                    </div>
-                  }
-                />
+  ref={cityRef}
+  isOpen={activeCityDropdown}
+  onToggle={() => {
+    console.log('City dropdown toggled');
+    setTimeout(() => {
+      setActiveCityDropdown(!activeCityDropdown);
+    }, 50);
+  }}
+  items={cities.map(city => ({
+    id: 'city-change',
+    label: city.label,
+    action: () => {
+      console.log('City action called:', city.id);
+      handleCityChange(city.id);
+    }
+  }))}
+  title="Select City"
+  trigger={
+    <div className="flex items-center space-x-1.5 text-gray-700 hover:text-gray-900 text-base font-medium transition-colors duration-200 cursor-pointer rounded-lg hover:bg-gray-50/50 px-2 py-1">
+      <span>
+        {isLandingPage || activeCity === 'Landingpage' || !activeCity
+          ? 'Select City'
+          : activeCity.charAt(0).toUpperCase() + activeCity.slice(1)
+        }
+      </span>
+      <ChevronDown className={`w-3.5 h-3.5 transition-transform duration-200 ${activeCityDropdown ? 'rotate-180' : ''}`} />
+    </div>
+  }
+/>
                 {/* Language Dropdown */}
                 <Dropdown
                   ref={languageRef}

src/pages/ComingSoonPage.tsx

@@ -22,7 +22,7 @@ const ComingSoonPage: React.FC<ComingSoonPageProps> = ({
 
   return (
     <Layout
-      activeCity="Melbourne"
+      activeCity="Landingpage"
       onSignInClick={onSignInClick}
       onSignOutClick={onSignOutClick}
       user={user}