change the route according to cityName instead of id

src/components/CitySelectionDialog.tsx

@@ -40,7 +40,7 @@ export function CitySelectionDialog({
 
     // ✅ Call the onCitySelect callback if provided (passing cityId)
     if (onCitySelect) {
-      onCitySelect(String(city.id));
+      onCitySelect(String(city.cityName));
     } else {
       // ✅ Default behavior: navigate to passes page
       navigate(`/passes?city=${encodeURIComponent(city.cityName)}`);

src/components/Navbar.tsx

@@ -299,11 +299,11 @@ export default function Navbar({
     setDialogSource('navbar');
   };
 
-  const handleCitySelectFromNavbar = (cityId: string) => {
-    console.log('City selected from navbar:', cityId);
-    onCityChange(cityId);
+  const handleCitySelectFromNavbar = (cityName: string) => {
+    console.log('City selected from navbar:', cityName);
+    onCityChange(cityName);
 
-    if (cityId.toLowerCase() === '1') {
+    if (cityName.toLowerCase() === 'melbourne') {
       setNavigationSource('melbourne');
       navigate('/melbourne');
     } else {
@@ -334,11 +334,11 @@ export default function Navbar({
     handleCloseCityDialog();
   };
 
-  const handleCitySelect = (cityId: string) => {
+  const handleCitySelect = (cityName: string) => {
     if (dialogSource === 'cta') {
-      handleCitySelectFromCTA(cityId);
+      handleCitySelectFromCTA(cityName);
     } else {
-      handleCitySelectFromNavbar(cityId);
+      handleCitySelectFromNavbar(cityName);
     }
   };