feat(BOOK-463): Fetching hotel filters from CMS and using these inside the destination pages and select hotel page

* feat(BOOK-463): Fetching hotel filters from CMS and using these inside the destination pages

* fix(BOOK-698): fetch hotel filters from CMS on select hotel page

Approved-by: Bianca Widstam

packages/trpc/lib/routers/contentstack/metadata/utils.ts

@@ -1,16 +1,13 @@
 import { ApiCountry } from "../../../types/country"
 import { HotelSortOption } from "../../../types/hotel"
-import {
-  getFiltersFromHotels,
-  mergeHotelFiltersAndSeoFilters,
-} from "../../../utils/getFiltersFromHotels"
 import { getSortedCities } from "../../../utils/getSortedCities"
+import { mergeHotelFiltersAndSeoFilters } from "../../../utils/mergeHotelFiltersAndSeoFilters"
+import { getHotelFilters } from "../../hotels/filters/utils"
 import {
   getCityByCityIdentifier,
   getHotelIdsByCityIdentifier,
 } from "../../hotels/services/getCityByCityIdentifier"
 import { getHotelIdsByCountry } from "../../hotels/services/getHotelIdsByCountry"
-import { getHotelsByHotelIds } from "../../hotels/services/getHotelsByHotelIds"
 import { getCityPages } from "../destinationCountryPage/utils"
 import { transformDestinationFiltersResponse } from "../schemas/destinationFilters"
 
@@ -62,11 +59,9 @@ export async function getCityData(
         serviceToken
       )
 
-      const hotels = await getHotelsByHotelIds({ hotelIds, lang, serviceToken })
-
       let filterType
       if (filter) {
-        const hotelFilters = getFiltersFromHotels(hotels, lang)
+        const hotelFilters = await getHotelFilters(lang)
         const allFilters = mergeHotelFiltersAndSeoFilters(
           hotelFilters,
           seoFilters
@@ -104,6 +99,7 @@ export async function getCountryData(
   lang: Lang
 ) {
   const country = data.destination_settings?.country
+  const seoFilters = transformDestinationFiltersResponse(data.seo_filters)
   const filter = input.filterFromUrl
 
   if (country) {
@@ -117,10 +113,13 @@ export async function getCountryData(
       serviceToken,
     })
 
-    const hotels = await getHotelsByHotelIds({ hotelIds, lang, serviceToken })
-
     if (filter) {
-      const allFilters = getFiltersFromHotels(hotels, lang)
+      const hotelFilters = await getHotelFilters(lang)
+      const allFilters = mergeHotelFiltersAndSeoFilters(
+        hotelFilters,
+        seoFilters
+      )
+
       const facilityFilter = allFilters.facilityFilters.find(
         (f) => f.slug === filter
       )

packages/trpc/lib/routers/contentstack/schemas/destinationFilters.ts

@@ -1,10 +1,10 @@
 import { z } from "zod"
 
-import { FacilityEnum } from "@scandic-hotels/common/constants/facilities"
 import { isDefined } from "@scandic-hotels/common/utils/isDefined"
 
 import { DestinationFilterBlocksEnum } from "../../../types/destinationsData"
 import { discriminatedUnionArray } from "../../../utils/discriminatedUnion"
+import { hotelFilterSchema } from "../../hotels/filters/output"
 import { accordionSchema } from "./blocks/accordion"
 import { contentSchema } from "./blocks/content"
 import { systemSchema } from "./system"
@@ -37,12 +37,7 @@ export const destinationFilterSchema = z.object({
   filterConnection: z.object({
     edges: z.array(
       z.object({
-        node: z.object({
-          title: z.string(),
-          facility_id: z.nativeEnum(FacilityEnum).catch(FacilityEnum.UNKNOWN),
-          category: z.string(),
-          slug: z.string(),
-        }),
+        node: hotelFilterSchema,
       })
     ),
   }),
@@ -84,13 +79,7 @@ export function transformDestinationFiltersResponse(
         heading,
         preamble,
         blocks,
-        filter: {
-          id: filter.facility_id,
-          name: filter.title,
-          filterType: filter.category,
-          slug: filter.slug,
-          sortOrder: 0,
-        },
+        filter,
       }
     })
     .filter(isDefined)

packages/trpc/lib/routers/hotels/filters/get.ts

@@ -0,0 +1,6 @@
+import { contentstackBaseProcedure } from "../../../procedures"
+import { getHotelFilters } from "./utils"
+
+export const get = contentstackBaseProcedure.query(async ({ ctx }) => {
+  return getHotelFilters(ctx.lang)
+})

packages/trpc/lib/routers/hotels/filters/index.ts

@@ -0,0 +1,6 @@
+import { router } from "../../.."
+import { get } from "./get"
+
+export const filtersRouter = router({
+  get,
+})

packages/trpc/lib/routers/hotels/filters/output.ts

@@ -0,0 +1,61 @@
+import { z } from "zod"
+
+import { Lang } from "@scandic-hotels/common/constants/language"
+
+import { getCountryFilters } from "./utils"
+
+export const FILTER_TYPES = ["surroundings", "facility", "country"] as const
+export type FilterType = (typeof FILTER_TYPES)[number]
+
+export const hotelFilterSchema = z
+  .object({
+    category: z.enum(FILTER_TYPES),
+    facility_id: z.number().transform((id) => id.toString()),
+    slug: z.string(),
+    title: z.string(),
+    sort_order: z.number().nullish(),
+  })
+  .transform(({ facility_id, title, category, slug, sort_order }) => ({
+    id: facility_id,
+    name: title,
+    filterType: category,
+    slug,
+    sortOrder: sort_order ?? 0,
+    hotelCount: 0,
+    cityCount: 0,
+  }))
+
+export const hotelFiltersSchema = z
+  .object({
+    all_hotel_filter: z.object({
+      items: z.array(hotelFilterSchema),
+    }),
+    lang: z.nativeEnum(Lang),
+  })
+  .transform((data) => {
+    const filters = data.all_hotel_filter.items
+
+    if (!filters?.length) {
+      return {
+        facilityFilters: [],
+        surroundingsFilters: [],
+        countryFilters: [],
+      }
+    }
+
+    const facilityFilters = filters.filter(
+      (filter) => filter.filterType === "facility"
+    )
+    const surroundingsFilters = filters.filter(
+      (filter) => filter.filterType === "surroundings"
+    )
+
+    return {
+      facilityFilters,
+      surroundingsFilters,
+      countryFilters: getCountryFilters(data.lang),
+    }
+  })
+
+export type HotelFilters = z.output<typeof hotelFiltersSchema>
+export type HotelFilter = HotelFilters[keyof HotelFilters][number]

packages/trpc/lib/routers/hotels/filters/utils.ts

@@ -0,0 +1,98 @@
+import { CountryCode } from "@scandic-hotels/common/constants/country"
+import { getCacheClient } from "@scandic-hotels/common/dataCache"
+import { createCounter } from "@scandic-hotels/common/telemetry"
+
+import { GetHotelFilters } from "../../../graphql/Query/HotelFilters.graphql"
+import { request } from "../../../graphql/request"
+import { hotelFiltersSchema } from "./output"
+
+import type { Lang } from "@scandic-hotels/common/constants/language"
+
+import type { FilterType, HotelFilter } from "./output"
+
+export async function getHotelFilters(lang: Lang) {
+  const cacheClient = await getCacheClient()
+  const cacheKey = `${lang}:getHotelFilters`
+
+  return await cacheClient.cacheOrGet(
+    cacheKey,
+    async () => {
+      const getHotelFiltersCounter = createCounter(
+        "trpc.contentstack.hotelFilters.getAll"
+      )
+      const metricsGetHotelFilters = getHotelFiltersCounter.init({ lang })
+
+      metricsGetHotelFilters.start()
+
+      const response = await request<unknown>(
+        GetHotelFilters,
+        { locale: lang },
+        { key: `${lang}:hotel_filters`, ttl: "1d" }
+      )
+
+      if (!response.data) {
+        metricsGetHotelFilters.noDataError()
+        return {
+          facilityFilters: [],
+          surroundingsFilters: [],
+          countryFilters: [],
+        }
+      }
+
+      const validatedResponse = hotelFiltersSchema.safeParse({
+        ...response.data,
+        lang,
+      })
+      if (!validatedResponse.success) {
+        metricsGetHotelFilters.validationError(validatedResponse.error)
+        return {
+          facilityFilters: [],
+          surroundingsFilters: [],
+          countryFilters: [],
+        }
+      }
+
+      metricsGetHotelFilters.success()
+
+      const { facilityFilters, surroundingsFilters, countryFilters } =
+        validatedResponse.data
+      return {
+        facilityFilters: sortFilters(facilityFilters),
+        surroundingsFilters: sortFilters(surroundingsFilters),
+        countryFilters: sortFilters(countryFilters),
+      }
+    },
+    "1d"
+  )
+}
+
+export function getCountryFilters(lang: Lang) {
+  const countryCodes = Object.values(CountryCode)
+  const localizedCountries = new Intl.DisplayNames([lang], { type: "region" })
+  return [...countryCodes]
+    .map((countryCode) => {
+      const localizedCountryName = localizedCountries.of(countryCode)
+
+      return localizedCountryName
+        ? {
+            id: countryCode,
+            name: localizedCountryName,
+            slug: countryCode.toLowerCase(),
+            filterType: "country" as FilterType,
+            sortOrder: 0,
+            hotelCount: 0,
+            cityCount: 0,
+          }
+        : null
+    })
+    .filter((filter) => !!filter)
+}
+
+// First sort by sortOrder descending. The higher the sortOrder, the earlier it appears.
+// If sortOrder is the same, sort by name as secondary criterion
+export function sortFilters(filters: HotelFilter[]) {
+  return [...filters].sort((a, b) => {
+    const orderDiff = b.sortOrder - a.sortOrder
+    return orderDiff === 0 ? a.name.localeCompare(b.name) : orderDiff
+  })
+}

packages/trpc/lib/routers/hotels/query.ts

@@ -47,6 +47,7 @@ import { getHotelsByHotelIds } from "./services/getHotelsByHotelIds"
 import { getLocationsByCountries } from "./services/getLocationsByCountries"
 import { getPackages } from "./services/getPackages"
 import { availability } from "./availability"
+import { filtersRouter } from "./filters"
 import { locationsRouter } from "./locations"
 
 import type { HotelListingHotelData } from "../../types/hotel"
@@ -331,6 +332,7 @@ export const hotelQueryRouter = router({
         env.CACHE_TIME_HOTELS
       )
     }),
+  filters: filtersRouter,
   locations: locationsRouter,
   map: router({
     city: serviceProcedure