feat(navbar): render LoginModal conditionally based on route

src/components/Navbar.tsx

@@ -9,6 +9,8 @@ import { CTAButton } from './CTAButton';
 import logoImage from '../assets/cit-logo.png';
 import melbourneLogo from '../assets/melbourne-logo.png';
 import { CitySelectionDialog } from './CitySelectionDialog';
+import { useAuth } from '../context/AuthContext';
+import { LoginModal } from './LoginModal';
 
 interface NavbarProps {
   activeCity: string;
@@ -63,7 +65,7 @@ export default function Navbar({
   onSignInClick,
   onSignOutClick,
   isUserSignedIn = false,
-  user
+  // user
 }: NavbarProps) {
   const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
   const [isScrolled, setIsScrolled] = useState(false);
@@ -85,6 +87,22 @@ export default function Navbar({
   const navigate = useNavigate();
 
   const [lastKnownCity, setLastKnownCity] = useState<'landing' | 'melbourne'>('landing');
+  const [isLoginOpen, setLoginOpen] = useState(false);
+
+  const { user, login, logout } = useAuth(); // from AuthContext
+
+  const protectedPaths = ["/passes", "/whats-included", "/","/melbourne"];
+
+  const handleOpenLoginModal = () => {
+    if (!user && protectedPaths.includes(location.pathname)) {
+      setLoginOpen(true);
+    }
+    else if (!user) {
+      setIsCityDialogOpen(true); // normal city selection
+    } else if (user) {
+      setActiveUserDropdown(true)
+    }
+  };
 
 
   // More flexible navigation configuration
@@ -642,7 +660,7 @@ export default function Navbar({
                 {/* Enhanced City Card Button with Source Tracking */}
                 <div className="flex items-center gap-3 pl-2">
                   <div className="relative">
-                    {isUserSignedIn && user ? (
+                    {user ? (
                       <Dropdown
                         ref={userRef}
                         isOpen={activeUserDropdown}
@@ -671,9 +689,7 @@ export default function Navbar({
                             label: 'Sign Out',
                             icon: <LogOut className="w-4 h-4" />,
                             action: () => {
-                              if (onSignOutClick) {
-                                onSignOutClick();
-                              }
+                              logout()
                               setActiveUserDropdown(false);
                             }
                           }
@@ -698,10 +714,10 @@ export default function Navbar({
                     ) : (
                       <div
                         className="cursor-pointer"
-                        onClick={handleOpenCityDialogFromCTA}
+                        onClick={handleOpenLoginModal}
                       >
                         <CTAButton
-                          user={null}
+                          user={user}
                           onClick={() => { }}
                           className="hover:scale-105 transition-transform duration-200"
                         />
@@ -887,6 +903,13 @@ export default function Navbar({
         onClose={handleCloseCityDialog}
         onCitySelect={handleCitySelect}
       />
+
+      <LoginModal
+        isOpen={isLoginOpen}
+        onClose={() => {
+          setLoginOpen(false);
+        }}
+      />
     </>
   );
 }