fix(SW-1143): added safeTry

components/HotelReservation/SelectHotel/index.tsx

@@ -15,6 +15,7 @@ import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { getIntl } from "@/i18n"
+import { safeTry } from "@/utils/safeTry"
 
 import HotelCardListing from "../HotelCardListing"
 import HotelCount from "./HotelCount"
@@ -38,20 +39,23 @@ export default async function SelectHotel({
 
   const intl = await getIntl()
 
-  const hotels = await fetchAvailableHotels({
+  const hotelsPromise = safeTry(
+    fetchAvailableHotels({
       cityId: city.id,
       roomStayStartDate: searchParams.fromDate,
       roomStayEndDate: searchParams.toDate,
       adults: adultsParams,
       children: childrenParams?.toString(),
     })
+  )
+
+  const [hotels] = await hotelsPromise
 
   const isCityWithCountry = (city: any): city is { country: string } =>
     "country" in city
 
-  const validHotels = hotels.filter(
+  const validHotels =
-    (hotel): hotel is HotelData => hotel !== null
+    hotels?.filter((hotel): hotel is HotelData => hotel !== null) || []
-  )
 
   const filterList = getFiltersFromHotels(validHotels)
   const breadcrumbs = [
@@ -76,7 +80,7 @@ export default async function SelectHotel({
     },
   ]
 
-  const isAllUnavailable = hotels.every((hotel) => hotel.price === undefined)
+  const isAllUnavailable = hotels?.every((hotel) => hotel.price === undefined)
 
   return (
     <>
@@ -95,7 +99,7 @@ export default async function SelectHotel({
       </header>
       <main className={styles.main}>
         <div className={styles.sideBar}>
-          {hotels.length > 0 ? ( // TODO: Temp fix until API returns hotels that are not available
+          {hotels && hotels.length > 0 ? ( // TODO: Temp fix until API returns hotels that are not available
             <Link
               className={styles.link}
               color="burgundy"