replace the citySelected condition from local to session storage

This commit is contained in:
aryabenade
2026-04-22 23:20:26 +05:30
parent ef15941484
commit 351c767104
2 changed files with 10 additions and 52 deletions

View File

@@ -45,6 +45,7 @@ export function CitySelectionDialog({
navigate(`/${slugify(city.cityName)}`);
localStorage.setItem("cityId", String(city.id))
localStorage.setItem("cityName", String(city.cityName))
sessionStorage.setItem("citySelected", String(city.cityName))
onClose();
};

View File

@@ -2,12 +2,10 @@ import { useState, useEffect, useRef, forwardRef } from 'react';
import { Menu, X, ShoppingBag, ChevronDown, Globe, User, Settings, LogOut } from 'lucide-react';
import { motion, AnimatePresence } from 'motion/react';
import { Link, useLocation, useNavigate } from 'react-router-dom';
import Frame1597884853 from '../imports/Frame1597884853';
import { Button } from './ui/button';
import { ImageWithFallback } from './figma/ImageWithFallback';
import { CTAButton } from './CTAButton';
import logoImage from '../assets/cit-logo.png';
import melbourneLogo from '../assets/melbourne-logo.png';
import { CitySelectionDialog, slugify } from './CitySelectionDialog';
import { useAuth } from '../context/AuthContext';
import { LoginModal } from './LoginModal';
@@ -62,15 +60,12 @@ interface NavigationItem {
export default function Navbar({
activeCity,
onCityChange,
onSignInClick,
onSignOutClick,
isUserSignedIn = false,
// user
}: NavbarProps) {
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
const [isScrolled, setIsScrolled] = useState(false);
const [activeLanguageDropdown, setActiveLanguageDropdown] = useState(false);
const [activeCartDropdown, setActiveCartDropdown] = useState(false);
const [activeUserDropdown, setActiveUserDropdown] = useState(false);
const [activeCityDropdown, setActiveCityDropdown] = useState(false);
const [isCityDialogOpen, setIsCityDialogOpen] = useState(false);
@@ -79,7 +74,6 @@ export default function Navbar({
const [dialogSource, setDialogSource] = useState<'navbar' | 'cta'>('navbar');
const languageRef = useRef<HTMLDivElement>(null);
const cartRef = useRef<HTMLDivElement>(null);
const userRef = useRef<HTMLDivElement>(null);
const cityRef = useRef<HTMLDivElement>(null);
@@ -96,7 +90,7 @@ export default function Navbar({
const cityName = localStorage.getItem("cityName")
// const citySelected = location.pathname.includes(slugify(cityName) || "")
const citySelected = cityName
const citySelected = sessionStorage.getItem("citySelected")
const baseUrl = import.meta.env.VITE_BASE_URL;
@@ -137,15 +131,6 @@ export default function Navbar({
path: '/whats-included',
isShared: false
},
// Position 4 - Shared item
// {
// label: 'Your Card',
// path: '/passes',
// isShared: true,
// landingLabel: 'Your Card',
// melbourneLabel: 'Your Card'
// },
// Position 5
{
label: 'FAQ',
path: '/faq',
@@ -159,7 +144,7 @@ export default function Navbar({
melbourneLabel: 'Your Postcard'
}
],
melbourne: [
citySelected: [
// Position 1
{
label: 'Attractions',
@@ -240,20 +225,20 @@ export default function Navbar({
}, [location.pathname]);
// ✅ Determine which navbar to show
const getAutoNavigationSource = (): 'landing' | 'melbourne' => {
const getAutoNavigationSource = () => {
const path = location.pathname;
// Explicit routes
if (path.startsWith('/melbourne')) return 'melbourne';
// if (path.startsWith('/melbourne')) return 'melbourne';
if (path === '/' || path.startsWith('/explore')) return 'landing';
// Shared routes
if (['/passes', '/how-it-works'].includes(path)) {
return lastKnownCity; // ← remembers where user came from
}
// if (['/passes', '/how-it-works'].includes(path)) {
// return lastKnownCity; // ← remembers where user came from
// }
// Fallback
return lastKnownCity;
return citySelected;
};
@@ -261,7 +246,7 @@ export default function Navbar({
const getNavigationItems = (): NavigationItem[] => {
const currentSource = getAutoNavigationSource();
const items = currentSource === 'landing' ?
navigationConfig.landing : navigationConfig.melbourne;
navigationConfig.landing : navigationConfig.citySelected;
return items.map((item, index) => ({
...item,
@@ -370,34 +355,6 @@ export default function Navbar({
{ id: '2', name: 'Melbourne Premium Pass', price: '$129', quantity: 1 },
];
// Calculate cart total
const cartTotal = cartItems.reduce((total, item) => {
const price = parseFloat(item.price.replace('$', ''));
return total + (price * item.quantity);
}, 0);
// Cart dropdown items with proper navigation for checkout
const cartDropdownItems: DropdownItem[] = [
...cartItems.map(item => ({
id: item.id,
label: `${item.name} - ${item.price}`,
badge: `${item.quantity}x`
})),
{
id: 'total',
label: `Total: $${cartTotal.toFixed(2)}`,
icon: <ShoppingBag className="w-4 h-4" />
},
{
id: 'checkout',
label: 'Proceed to Checkout',
action: () => {
navigate('/checkout');
setActiveCartDropdown(false);
}
}
];
const closeMobileMenu = () => {
setIsMobileMenuOpen(false);
};