Merged in feat/SW-1090-amenities-meetings-sidepeeks (pull request #1114)

Feat/SW-1090: Sidepeek amenities and meetings

Approved-by: Erik Tiekstra
Approved-by: Fredrik Thorsson

components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Breakfast/index.tsx

@@ -1,9 +1,15 @@
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import { getIntl } from "@/i18n"
 
+import OpeningHours from "../../../OpeningHours"
+
+import type { BreakfastAmenityProps } from "@/types/components/hotelPage/sidepeek/amenities"
 import { IconName } from "@/types/components/icon"
 
-export default async function BreakfastAmenity() {
+export default async function BreakfastAmenity({
+  openingHours,
+  alternateOpeningHours,
+}: BreakfastAmenityProps) {
   const intl = await getIntl()
   return (
     <AccordionItem
@@ -11,7 +17,12 @@ export default async function BreakfastAmenity() {
       icon={IconName.CoffeeAlt}
       variant="sidepeek"
     >
-      {/* TODO: breakfast to be implemented */}
+      <OpeningHours
+        openingHours={openingHours}
+        alternateOpeningHours={alternateOpeningHours}
+        heading={intl.formatMessage({ id: "Opening hours" })}
+        type="amenities"
+      />
     </AccordionItem>
   )
 }

components/ContentType/HotelPage/SidePeeks/Amenities/index.tsx

@@ -21,6 +21,7 @@ export default async function AmenitiesSidePeek({
   parking,
   checkInInformation,
   accessibility,
+  restaurants,
 }: AmenitiesSidePeekProps) {
   const lang = getLang()
   const intl = await getIntl()
@@ -40,6 +41,17 @@ export default async function AmenitiesSidePeek({
     (amenity) => !amenitiesToRemove.includes(amenity.id)
   )
 
+  const breakfastOpeningHours = restaurants
+    ?.map((restaurant) => {
+      const breakfastDetail = restaurant.openingDetails.find(
+        (details) =>
+          details.openingHours.name === "Breakfast" ||
+          details.openingHours.name === intl.formatMessage({ id: "Breakfast" })
+      )
+      return breakfastDetail
+    })
+    .filter(Boolean)[0]
+
   return (
     <SidePeek
       contentKey={amenities[lang]}
@@ -47,7 +59,13 @@ export default async function AmenitiesSidePeek({
     >
       <Accordion>
         {parking.length ? <ParkingAmenity parking={parking} /> : null}
-        <BreakfastAmenity />
+
+        {breakfastOpeningHours && (
+          <BreakfastAmenity
+            openingHours={breakfastOpeningHours.openingHours}
+            alternateOpeningHours={breakfastOpeningHours.alternateOpeningHours}
+          />
+        )}
         <CheckInAmenity checkInInformation={checkInInformation} />
         {accessibility && (
           <AccessibilityAmenity accessibility={accessibility} />

components/ContentType/HotelPage/SidePeeks/MeetingsAndConferences/index.tsx

@@ -1,4 +1,5 @@
 import { meetingsAndConferences } from "@/constants/routes/hotelPageParams"
+import { getMeetingRooms } from "@/lib/trpc/memoizedRequests"
 
 import Image from "@/components/Image"
 import Button from "@/components/TempDesignSystem/Button"
@@ -10,6 +11,8 @@ import Title from "@/components/TempDesignSystem/Text/Title"
 import { getIntl } from "@/i18n"
 import { getLang } from "@/i18n/serverContext"
 
+import { getConferenceRoomTexts } from "./util"
+
 import styles from "./meetingsAndConferences.module.css"
 
 import type { MeetingsAndConferencesSidePeekProps } from "@/types/components/hotelPage/sidepeek/meetingsAndConferences"
@@ -17,10 +20,17 @@ import type { MeetingsAndConferencesSidePeekProps } from "@/types/components/hot
 export default async function MeetingsAndConferencesSidePeek({
   meetingFacilities,
   descriptions,
+  hotelId,
   link,
 }: MeetingsAndConferencesSidePeekProps) {
   const lang = getLang()
-  const intl = await getIntl()
+  const [intl, meetingRooms] = await Promise.all([
+    getIntl(),
+    getMeetingRooms({ hotelId, language: lang }),
+  ])
+
+  const { seatingText, roomText } = await getConferenceRoomTexts(meetingRooms)
+
   const fallbackAlt = intl.formatMessage({ id: "Creative spaces for meetings" })
 
   const primaryImage = meetingFacilities?.heroImages[0]?.imageSizes.medium
@@ -65,6 +75,14 @@ export default async function MeetingsAndConferencesSidePeek({
         {descriptions?.medium && (
           <Body color="uiTextHighContrast">{descriptions.medium}</Body>
         )}
+        {roomText || seatingText ? (
+          <Body color="uiTextMediumContrast">
+            {roomText}
+            {roomText && seatingText && <br />}
+            {seatingText}
+          </Body>
+        ) : null}
+
         {link && (
           <div className={styles.buttonContainer}>
             <Button fullWidth theme="base" intent="secondary" asChild>

components/ContentType/HotelPage/SidePeeks/MeetingsAndConferences/util.ts

@@ -0,0 +1,70 @@
+import { getIntl } from "@/i18n"
+
+import type { MeetingRooms } from "@/types/components/hotelPage/meetingRooms"
+
+export async function getConferenceRoomTexts(
+  meetingRooms: MeetingRooms | null
+) {
+  if (!meetingRooms) {
+    return { seatingText: null, roomText: null }
+  }
+  const roomSizes = meetingRooms.map((room) => room.attributes.size)
+  const roomSeating = meetingRooms
+    .map((room) => {
+      return room.attributes.seatings.map((seating) => seating.capacity)
+    })
+    .flat()
+
+  const seatingText = await getSeatingText(roomSeating)
+  const roomText = await getRoomText(roomSizes)
+
+  return { seatingText, roomText }
+}
+
+export async function getRoomText(roomSizes: number[]) {
+  const largestRoom = Math.max(...roomSizes)
+  const smallestRoom = Math.min(...roomSizes)
+  const intl = await getIntl()
+
+  let roomText
+  if (largestRoom === smallestRoom) {
+    roomText = intl.formatMessage(
+      { id: "{number} square meters" },
+      { number: largestRoom }
+    )
+  } else if (smallestRoom != null && largestRoom) {
+    {
+      roomText = intl.formatMessage(
+        {
+          id: "{number} to {number} square meters",
+        },
+        { largest: largestRoom, smallest: smallestRoom }
+      )
+    }
+  }
+  return roomText
+}
+
+export async function getSeatingText(roomSeating: number[]) {
+  const biggestSeating = Math.max(...roomSeating)
+  const smallestSeating = Math.min(...roomSeating)
+  const intl = await getIntl()
+
+  let seatingText
+  if (biggestSeating === smallestSeating) {
+    seatingText = intl.formatMessage(
+      { id: "{number} persons" },
+      { number: biggestSeating }
+    )
+  } else if (smallestSeating != null && biggestSeating) {
+    {
+      seatingText = intl.formatMessage(
+        {
+          id: "{number} to {number} persons",
+        },
+        { highest: biggestSeating, lowest: smallestSeating }
+      )
+    }
+  }
+  return seatingText
+}

components/ContentType/HotelPage/SidePeeks/OpeningHours/index.tsx

@@ -4,16 +4,16 @@ import { getIntl } from "@/i18n"
 
 import styles from "./openingHours.module.css"
 
-import {
-  DaysEnum,
-  type RestaurantBarOpeningHoursProps,
-} from "@/types/components/hotelPage/sidepeek/restaurantBar"
+import type { OpeningHoursProps } from "@/types/components/hotelPage/sidepeek/openingHours"
+import { DaysEnum } from "@/types/components/hotelPage/sidepeek/restaurantBar"
 import type { RestaurantOpeningHoursDay } from "@/types/hotel"
 
 export default async function OpeningHours({
   openingHours,
   alternateOpeningHours,
-}: RestaurantBarOpeningHoursProps) {
+  heading,
+  type = "default",
+}: OpeningHoursProps) {
   const intl = await getIntl()
 
   const closed = intl.formatMessage({ id: "Closed" })
@@ -58,9 +58,9 @@ export default async function OpeningHours({
   }
 
   return (
-    <div className={styles.wrapper}>
+    <div className={type === "default" ? styles.wrapper : ""}>
       <Body textTransform="bold" asChild>
-        <h5>{openingHours.name}</h5>
+        <h5>{heading ?? openingHours.name}</h5>
       </Body>
       {Object.entries(groupedOpeningHours).map(([time, days]) => {
         return (

components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/index.tsx

@@ -7,7 +7,7 @@ import Link from "@/components/TempDesignSystem/Link"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { getIntl } from "@/i18n"
 
-import OpeningHours from "../OpeningHours"
+import OpeningHours from "../../OpeningHours"
 
 import styles from "./restaurantBarItem.module.css"
 
@@ -49,7 +49,7 @@ export default async function RestaurantBarItem({
       {openingDetails.length ? (
         <div className={styles.content}>
           <Subtitle type="two" asChild>
-            <h4>{intl.formatMessage({ id: "Opening Hours" })}</h4>
+            <h4>{intl.formatMessage({ id: "Opening hours" })}</h4>
           </Subtitle>
           {openingDetails.map((details) => (
             <OpeningHours

components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/Facility/index.tsx

@@ -31,7 +31,7 @@ export default async function Facility({ data }: FacilityProps) {
         </Subtitle>
         <div>
           <Subtitle type="two" color="uiTextHighContrast">
-            {intl.formatMessage({ id: "Opening Hours" })}
+            {intl.formatMessage({ id: "Opening hours" })}
           </Subtitle>
           <div className={styles.openingHours}>
             <Body color="uiTextHighContrast">

components/ContentType/HotelPage/index.tsx

@@ -9,7 +9,6 @@ import Breadcrumbs from "@/components/Breadcrumbs"
 import SidePeekProvider from "@/components/SidePeeks/SidePeekProvider"
 import Alert from "@/components/TempDesignSystem/Alert"
 import BreadcrumbsSkeleton from "@/components/TempDesignSystem/Breadcrumbs/BreadcrumbsSkeleton"
-import { getIntl } from "@/i18n"
 import { getLang } from "@/i18n/serverContext"
 import { getRestaurantHeading } from "@/utils/facilityCards"
 import { generateHotelSchema } from "@/utils/jsonSchemas"
@@ -49,8 +48,7 @@ import type {
 
 export default async function HotelPage({ hotelId }: HotelPageProps) {
   const lang = getLang()
-  const [intl, hotelPageData, hotelData] = await Promise.all([
-    getIntl(),
+  const [hotelPageData, hotelData] = await Promise.all([
     getHotelPage(),
     getHotelData({ hotelId, language: lang }),
   ])
@@ -84,6 +82,7 @@ export default async function HotelPage({ hotelId }: HotelPageProps) {
   } = hotelData.data.attributes
   const roomCategories = hotelData.included?.rooms || []
   const restaurants = hotelData.included?.restaurants || []
+
   const images = gallery?.smallerImages
   const description = hotelContent.texts.descriptions.medium
 
@@ -200,6 +199,7 @@ export default async function HotelPage({ hotelId }: HotelPageProps) {
           parking={parking}
           checkInInformation={hotelFacts.checkin}
           accessibility={hotelFacts.hotelInformation.accessibility}
+          restaurants={restaurants}
         />
         <AboutTheHotelSidePeek
           hotelAddress={address}
@@ -222,6 +222,7 @@ export default async function HotelPage({ hotelId }: HotelPageProps) {
         <MeetingsAndConferencesSidePeek
           meetingFacilities={conferencesAndMeetings}
           descriptions={hotelContent.texts.meetingDescription}
+          hotelId={hotelId}
         />
         {roomCategories.map((room) => (
           <RoomSidePeek key={room.name} room={room} />

i18n/dictionaries/da.json

@@ -295,7 +295,7 @@
   "Open language menu": "Åbn sprogmenuen",
   "Open menu": "Åbn menuen",
   "Open my pages menu": "Åbn mine sider menuen",
-  "Opening Hours": "Åbningstider",
+  "Opening hours": "Åbningstider",
   "Outdoor": "Udendørs",
   "OutdoorPool": "Udendørs pool",
   "Overview": "Oversigt",
@@ -549,5 +549,9 @@
   "uppercase letter": "stort bogstav",
   "{amount} out of {total}": "{amount} ud af {total}",
   "{card} ending with {cardno}": "{card} slutter med {cardno}",
-  "{difference}{amount} {currency}": "{difference}{amount} {currency}"
+  "{difference}{amount} {currency}": "{difference}{amount} {currency}",
+  "{number} persons": "{number} Personen",
+  "{number} square meters": "{number} Quadratmeter",
+  "{number} to {number} persons": "{lowest} bis {highest} Personen",
+  "{number} to {number} square meters": "{smallest} bis {largest} Quadratmeter"
 }

i18n/dictionaries/de.json

@@ -294,7 +294,7 @@
   "Open language menu": "Sprachmenü öffnen",
   "Open menu": "Menü öffnen",
   "Open my pages menu": "Meine Seiten Menü öffnen",
-  "Opening Hours": "Öffnungszeiten",
+  "Opening hours": "Öffnungszeiten",
   "Outdoor": "Im Freien",
   "OutdoorPool": "Außenpool",
   "Overview": "Übersicht",
@@ -548,5 +548,9 @@
   "uppercase letter": "großbuchstabe",
   "{amount} out of {total}": "{amount} von {total}",
   "{card} ending with {cardno}": "{card} endet mit {cardno}",
-  "{difference}{amount} {currency}": "{difference}{amount} {currency}"
+  "{difference}{amount} {currency}": "{difference}{amount} {currency}",
+  "{number} persons": "{number} personer",
+  "{number} square meters": "{number} kvadratmeter",
+  "{number} to {number} persons": "{lowest} til {highest} personer",
+  "{number} to {number} square meters": "{smallest} til {largest} kvadratmeter"
 }

i18n/dictionaries/en.json

@@ -318,7 +318,7 @@
   "Open language menu": "Open language menu",
   "Open menu": "Open menu",
   "Open my pages menu": "Open my pages menu",
-  "Opening Hours": "Opening Hours",
+  "Opening hours": "Opening hours",
   "Outdoor": "Outdoor",
   "OutdoorPool": "Outdoor pool",
   "Overview": "Overview",
@@ -598,5 +598,9 @@
   "uppercase letter": "uppercase letter",
   "{amount} out of {total}": "{amount} out of {total}",
   "{card} ending with {cardno}": "{card} ending with {cardno}",
-  "{difference}{amount} {currency}": "{difference}{amount} {currency}"
+  "{difference}{amount} {currency}": "{difference}{amount} {currency}",
+  "{number} persons": "{number} persons",
+  "{number} square meters": "{number} square meters",
+  "{number} to {number} persons": "{lowest} to {highest} persons",
+  "{number} to {number} square meters": "{smallest} to {largest} square meters"
 }

i18n/dictionaries/fi.json

@@ -295,7 +295,7 @@
   "Open language menu": "Avaa kielivalikko",
   "Open menu": "Avaa valikko",
   "Open my pages menu": "Avaa omat sivut -valikko",
-  "Opening Hours": "Aukioloajat",
+  "Opening hours": "Aukioloajat",
   "Outdoor": "Ulkona",
   "OutdoorPool": "Ulkouima-allas",
   "Overview": "Yleiskatsaus",
@@ -547,5 +547,9 @@
   "uppercase letter": "iso kirjain",
   "{amount} out of {total}": "{amount}/{total}",
   "{card} ending with {cardno}": "{card} päättyen {cardno}",
-  "{difference}{amount} {currency}": "{difference}{amount} {currency}"
+  "{difference}{amount} {currency}": "{difference}{amount} {currency}",
+  "{number} persons": "{number} henkilöä",
+  "{number} square meters": "{number} neliömetriä",
+  "{number} to {number} persons": "{lowest} - {highest} henkilöä",
+  "{number} to {number} square meters": "{smallest} - {largest} neliömetriä"
 }

i18n/dictionaries/no.json

@@ -294,7 +294,7 @@
   "Open language menu": "Åpne språkmenyen",
   "Open menu": "Åpne menyen",
   "Open my pages menu": "Åpne mine sider menyen",
-  "Opening Hours": "Åpningstider",
+  "Opening hours": "Åpningstider",
   "Outdoor": "Utendørs",
   "OutdoorPool": "Utendørs basseng",
   "Overview": "Oversikt",
@@ -547,5 +547,9 @@
   "uppercase letter": "stor bokstav",
   "{amount} out of {total}": "{amount} av {total}",
   "{card} ending with {cardno}": "{card} slutter med {cardno}",
-  "{difference}{amount} {currency}": "{difference}{amount} {currency}"
+  "{difference}{amount} {currency}": "{difference}{amount} {currency}",
+  "{number} persons": "{number} personer",
+  "{number} square meters": "{number} kvadratmeter",
+  "{number} to {number} persons": "{lowest} til {highest} personer",
+  "{number} to {number} square meters": "{smallest} til {largest} kvadratmeter"
 }

i18n/dictionaries/sv.json

@@ -294,7 +294,7 @@
   "Open language menu": "Öppna språkmenyn",
   "Open menu": "Öppna menyn",
   "Open my pages menu": "Öppna mina sidor menyn",
-  "Opening Hours": "Öppettider",
+  "Opening hours": "Öppettider",
   "Outdoor": "Utomhus",
   "OutdoorPool": "Utomhuspool",
   "Overview": "Översikt",
@@ -549,5 +549,9 @@
   "uppercase letter": "stor bokstav",
   "{amount} out of {total}": "{amount} av {total}",
   "{card} ending with {cardno}": "{card} som slutar på {cardno}",
-  "{difference}{amount} {currency}": "{difference}{amount} {currency}"
+  "{difference}{amount} {currency}": "{difference}{amount} {currency}",
+  "{number} persons": "{number} personer",
+  "{number} square meters": "{number} kvadratmeter",
+  "{number} to {number} persons": "{lowest} till {highest} personer",
+  "{number} to {number} square meters": "{smallest} till {largest} kvadratmeter"
 }

lib/trpc/memoizedRequests/index.ts

@@ -161,3 +161,12 @@ export const getCurrentRewards = cache(
     return serverClient().contentstack.rewards.current()
   }
 )
+
+export const getMeetingRooms = cache(
+  async function getMemoizedMeetingRooms(input: {
+    hotelId: string
+    language: Lang
+  }) {
+    return serverClient().hotel.meetingRooms(input)
+  }
+)

server/routers/hotels/input.ts

@@ -93,3 +93,8 @@ export const getCityCoordinatesInputSchema = z.object({
     address: z.string().optional(),
   }),
 })
+
+export const getMeetingRoomsInputSchema = z.object({
+  hotelId: z.string(),
+  language: z.string(),
+})

server/routers/hotels/output.ts

@@ -889,3 +889,49 @@ export const getHotelIdsByCityIdSchema = z
     ),
   })
   .transform((data) => data.data.map((hotel) => hotel.id))
+
+export const getMeetingRoomsSchema = z.object({
+  data: z.array(
+    z.object({
+      attributes: z.object({
+        name: z.string(),
+        email: z.string().optional(),
+        phoneNumber: z.string(),
+        size: z.number(),
+        doorWidth: z.number(),
+        doorHeight: z.number(),
+        length: z.number(),
+        width: z.number(),
+        height: z.number(),
+        floorNumber: z.number(),
+        content: z.object({
+          images: z.array(imageSchema),
+          texts: z.object({
+            facilityInformation: z.string().optional(),
+            surroundingInformation: z.string().optional(),
+            descriptions: z.object({
+              short: z.string().optional(),
+              medium: z.string().optional(),
+            }),
+            meetingDescription: z
+              .object({
+                short: z.string().optional(),
+                medium: z.string().optional(),
+              })
+              .optional(),
+          }),
+        }),
+        seatings: z.array(
+          z.object({
+            type: z.string(),
+            capacity: z.number(),
+          })
+        ),
+        lighting: z.string(),
+        sortOrder: z.number().optional(),
+      }),
+      id: z.string(),
+      type: z.string(),
+    })
+  ),
+})

server/routers/hotels/query.ts

@@ -21,6 +21,7 @@ import {
   getHotelDataInputSchema,
   getHotelsAvailabilityInputSchema,
   getHotelsInput,
+  getMeetingRoomsInputSchema,
   getRatesInputSchema,
   getRoomPackagesInputSchema,
   getRoomsAvailabilityInputSchema,
@@ -31,6 +32,7 @@ import {
   breakfastPackagesSchema,
   getHotelDataSchema,
   getHotelsAvailabilitySchema,
+  getMeetingRoomsSchema,
   getRatesSchema,
   getRoomPackagesSchema,
   getRoomsAvailabilitySchema,
@@ -51,6 +53,9 @@ import {
   hotelsAvailabilityCounter,
   hotelsAvailabilityFailCounter,
   hotelsAvailabilitySuccessCounter,
+  meetingRoomsCounter,
+  meetingRoomsFailCounter,
+  meetingRoomsSuccessCounter,
   roomsAvailabilityCounter,
   roomsAvailabilityFailCounter,
   roomsAvailabilitySuccessCounter,
@@ -1168,4 +1173,82 @@ export const hotelQueryRouter = router({
         return location
       }),
   }),
+  meetingRooms: safeProtectedServiceProcedure
+    .input(getMeetingRoomsInputSchema)
+    .query(async function ({ ctx, input }) {
+      const { hotelId, language } = input
+
+      const params: Record<string, string | string[]> = {
+        hotelId,
+        language,
+      }
+      const metricsData = { ...params, hotelId: input.hotelId }
+      meetingRoomsCounter.add(1, metricsData)
+      console.info(
+        "api.hotels.meetingRooms start",
+        JSON.stringify({ query: { hotelId, params } })
+      )
+
+      const apiResponse = await api.get(
+        api.endpoints.v1.Hotel.Hotels.meetingRooms(input.hotelId),
+        {
+          cache: undefined,
+          headers: {
+            Authorization: `Bearer ${ctx.serviceToken}`,
+          },
+          next: {
+            revalidate: TWENTYFOUR_HOURS,
+          },
+        },
+        params
+      )
+
+      if (!apiResponse.ok) {
+        const text = await apiResponse.text()
+        meetingRoomsFailCounter.add(1, {
+          ...metricsData,
+          error_type: "http_error",
+          error: JSON.stringify({
+            status: apiResponse.status,
+            statusText: apiResponse.statusText,
+            text,
+          }),
+        })
+        console.error(
+          "api.hotels.meetingRooms error",
+          JSON.stringify({
+            query: { params },
+            error: {
+              status: apiResponse.status,
+              statusText: apiResponse.statusText,
+              text,
+            },
+          })
+        )
+        return null
+      }
+
+      const apiJson = await apiResponse.json()
+      const validatedMeetingRooms = getMeetingRoomsSchema.safeParse(apiJson)
+
+      if (!validatedMeetingRooms.success) {
+        console.error(
+          "api.hotels.meetingRooms validation error",
+          JSON.stringify({
+            query: { params },
+            error: validatedMeetingRooms.error,
+          })
+        )
+        throw badRequestError()
+      }
+      meetingRoomsSuccessCounter.add(1, {
+        hotelId,
+      })
+      console.info(
+        "api.hotels.meetingRooms success",
+        JSON.stringify({ query: { params } })
+      )
+
+      return validatedMeetingRooms.data.data
+    }),
 })

server/routers/hotels/telemetry.ts

@@ -72,3 +72,13 @@ export const getHotelIdsSuccessCounter = meter.createCounter(
 export const getHotelIdsFailCounter = meter.createCounter(
   "trpc.hotel.hotel-ids.get-fail"
 )
+
+export const meetingRoomsCounter = meter.createCounter(
+  "trpc.hotels.meetingRooms"
+)
+export const meetingRoomsSuccessCounter = meter.createCounter(
+  "trpc.hotels.meetingRooms-success"
+)
+export const meetingRoomsFailCounter = meter.createCounter(
+  "trpc.hotels.meetingRooms-fail"
+)

types/components/hotelPage/meetingRooms.ts

@@ -0,0 +1,6 @@
+import type { z } from "zod"
+
+import type { getMeetingRoomsSchema } from "@/server/routers/hotels/output"
+
+export type MeetingRoomData = z.infer<typeof getMeetingRoomsSchema>
+export type MeetingRooms = MeetingRoomData["data"]

types/components/hotelPage/sidepeek/amenities.ts

@@ -1,12 +1,22 @@
-import type { Hotel } from "@/types/hotel"
+import type {
+  Hotel,
+  RestaurantData,
+  RestaurantOpeningHours,
+} from "@/types/hotel"
 
 export type AmenitiesSidePeekProps = {
   amenitiesList: Hotel["detailedFacilities"]
   parking: Hotel["parking"]
   checkInInformation: Hotel["hotelFacts"]["checkin"]
   accessibility: Hotel["hotelFacts"]["hotelInformation"]["accessibility"]
+  restaurants: RestaurantData[]
 }
 
 export type FilteredAmenitiesProps = {
   filteredAmenities: Hotel["detailedFacilities"]
 }
+
+export interface BreakfastAmenityProps {
+  openingHours: RestaurantOpeningHours
+  alternateOpeningHours?: RestaurantOpeningHours
+}

types/components/hotelPage/sidepeek/meetingsAndConferences.ts

@@ -3,5 +3,6 @@ import type { Hotel } from "@/types/hotel"
 export type MeetingsAndConferencesSidePeekProps = {
   meetingFacilities: Hotel["conferencesAndMeetings"]
   descriptions: Hotel["hotelContent"]["texts"]["meetingDescription"]
+  hotelId: string
   link?: string
 }

types/components/hotelPage/sidepeek/openingHours.ts

@@ -0,0 +1,6 @@
+import type { BreakfastAmenityProps } from "./amenities"
+
+export interface OpeningHoursProps extends BreakfastAmenityProps {
+  heading?: string
+  type?: "amenities" | "default"
+}

types/components/hotelPage/sidepeek/restaurantBar.ts

@@ -1,4 +1,4 @@
-import type { RestaurantData, RestaurantOpeningHours } from "@/types/hotel"
+import type { RestaurantData } from "@/types/hotel"
 
 export enum DaysEnum {
   Monday = "monday",
@@ -17,8 +17,3 @@ export interface RestaurantBarSidePeekProps {
 export interface RestaurantBarItemProps {
   restaurant: RestaurantData
 }
-
-export interface RestaurantBarOpeningHoursProps {
-  openingHours: RestaurantOpeningHours
-  alternateOpeningHours?: RestaurantOpeningHours
-}

utils/facilityCards.ts

@@ -31,9 +31,9 @@ export function isFacilityImage(card: FacilityCardType): card is FacilityImage {
 
 function setCardProps(
   theme: CardProps["theme"],
-  heading: string,
   buttonText: string,
   href: string,
+  heading: string,
   scriptedTopTitle?: string
 ): FacilityCard {
   return {