Merged in fix/SW-1014-city-not-found-on-map (pull request #973)

fix(SW-1014): Fixed issue where google didn't found city.

Approved-by: Niclas Edenvin

app/[lang]/(live)/(public)/hotelreservation/(standard)/select-hotel/@modal/(.)map/page.tsx

@@ -58,7 +58,10 @@ export default async function SelectHotelMapPage({
 
   const hotelPins = getHotelPins(hotels)
   const filterList = getFiltersFromHotels(hotels)
-  const cityCoordinates = await getCityCoordinates({ city: city.name })
+  const cityCoordinates = await getCityCoordinates({
+    city: city.name,
+    hotel: { address: hotels[0].hotelData.address.streetAddress },
+  })
 
   return (
     <MapModal>

app/[lang]/(live)/(public)/hotelreservation/(standard)/select-hotel/page.tsx

@@ -51,8 +51,12 @@ export default async function SelectHotelPage({
     (location) =>
       location.name.toLowerCase() === searchParams.city.toLowerCase()
   )
+
   if (!city) return notFound()
 
+  const isCityWithCountry = (city: any): city is { country: string } =>
+    "country" in city
+
   const intl = await getIntl()
   const selectHotelParams = new URLSearchParams(searchParams)
   const selectHotelParamsObject =
@@ -124,6 +128,7 @@ export default async function SelectHotelPage({
               <div className={styles.mapContainer}>
                 <StaticMap
                   city={searchParams.city}
+                  country={isCityWithCountry(city) ? city.country : undefined}
                   width={340}
                   height={180}
                   zoomLevel={11}

components/Maps/StaticMap/index.tsx

@@ -7,6 +7,7 @@ import { StaticMapProps } from "@/types/components/maps/staticMap"
 
 export default function StaticMap({
   city,
+  country,
   coordinates,
   width,
   height,
@@ -18,7 +19,9 @@ export default function StaticMap({
   const key = env.GOOGLE_STATIC_MAP_KEY
   const secret = env.GOOGLE_STATIC_MAP_SIGNATURE_SECRET
   const baseUrl = "https://maps.googleapis.com/maps/api/staticmap"
-  const center = coordinates ? `${coordinates.lat},${coordinates.lng}` : city
+  const center = coordinates
+    ? `${coordinates.lat},${coordinates.lng}`
+    : `${city}, ${country}`
 
   if (!center) {
     return null

lib/trpc/memoizedRequests/index.ts

@@ -160,7 +160,10 @@ export const getBookingConfirmation = cache(
 )
 
 export const getCityCoordinates = cache(
-  async function getMemoizedCityCoordinates(input: { city: string }) {
+  async function getMemoizedCityCoordinates(input: {
+    city: string
+    hotel: { address: string }
+  }) {
     return serverClient().hotel.map.city(input)
   }
 )

server/routers/hotels/input.ts

@@ -76,4 +76,7 @@ export const getRoomPackagesInputSchema = z.object({
 })
 export const getCityCoordinatesInputSchema = z.object({
   city: z.string(),
+  hotel: z.object({
+    address: z.string(),
+  }),
 })

server/routers/hotels/query.ts

@@ -1087,14 +1087,37 @@ export const hotelQueryRouter = router({
       .input(getCityCoordinatesInputSchema)
       .query(async function ({ input }) {
         const apiKey = process.env.GOOGLE_STATIC_MAP_KEY
-        const { city } = input
+        const { city, hotel } = input
-        const url = `https://maps.googleapis.com/maps/api/geocode/json?address=${encodeURIComponent(city)}&key=${apiKey}`
 
-        const response = await fetch(url)
+        async function fetchCoordinates(address: string) {
-        const data = await response.json()
+          const url = `https://maps.googleapis.com/maps/api/geocode/json?address=${encodeURIComponent(address)}&key=${apiKey}`
-        const { lat, lng } = data.results[0].geometry.location
+          const response = await fetch(url)
+          const data = await response.json()
 
-        return { lat, lng }
+          if (data.status !== "OK") {
+            console.error(`Geocode error: ${data.status}`)
+            return null
+          }
+
+          const location = data.results[0]?.geometry?.location
+          if (!location) {
+            console.error("No location found in geocode response")
+            return null
+          }
+
+          return location
+        }
+
+        let location = await fetchCoordinates(city)
+        if (!location) {
+          location = await fetchCoordinates(`${city}, ${hotel.address}`)
+        }
+
+        if (!location) {
+          throw new Error("Unable to fetch coordinates")
+        }
+
+        return location
       }),
   }),
 })

types/components/maps/staticMap.ts

@@ -2,6 +2,7 @@ import type { Coordinates } from "./coordinates"
 
 export type StaticMapProps = {
   city?: string
+  country?: string
   coordinates?: Coordinates
   width: number
   height: number