Merged in feat/BOOK-479-scandic-go-hotels-rm-brf- (pull request #3143)

feat(BOOK-479): Updated breakfast UI for ScandicGo hotels

Approved-by: Erik Tiekstra

packages/booking-flow/lib/components/BookingConfirmation/PriceDetails/index.tsx

@@ -9,15 +9,23 @@ import { mapToPrice } from "./mapToPrice"
 import type { Price } from "../../../types/price"
 
 export default function PriceDetails() {
-  const { bookingCode, currency, fromDate, rooms, vat, toDate } =
-    useBookingConfirmationStore((state) => ({
-      bookingCode: state.bookingCode ?? undefined,
-      currency: state.currencyCode,
-      fromDate: state.fromDate,
-      rooms: state.rooms,
-      toDate: state.toDate,
-      vat: state.vat,
-    }))
+  const {
+    bookingCode,
+    currency,
+    hotelOffersBreakfast,
+    fromDate,
+    rooms,
+    vat,
+    toDate,
+  } = useBookingConfirmationStore((state) => ({
+    bookingCode: state.bookingCode ?? undefined,
+    currency: state.currencyCode,
+    hotelOffersBreakfast: state.hotelOffersBreakfast,
+    fromDate: state.fromDate,
+    rooms: state.rooms,
+    toDate: state.toDate,
+    vat: state.vat,
+  }))
 
   if (!rooms[0]) {
     return null
@@ -135,6 +143,7 @@ export default function PriceDetails() {
       vat={vat}
       defaultCurrency={currency}
       isCampaignRate={isCampaignRate}
+      hotelOffersBreakfast={hotelOffersBreakfast}
     />
   )
 }

packages/booking-flow/lib/components/BookingConfirmation/Receipt/Room/Breakfast/breakfast.module.css

@@ -1,12 +0,0 @@
-.entry {
-  display: flex;
-  justify-content: space-between;
-}
-
-.textDefault {
-  color: var(--Text-Default);
-}
-
-.textSecondary {
-  color: var(--Text-Secondary);
-}

packages/booking-flow/lib/components/BookingConfirmation/Receipt/Room/Breakfast/index.tsx

@@ -1,71 +0,0 @@
-"use client"
-import { useIntl } from "react-intl"
-
-import { formatPrice } from "@scandic-hotels/common/utils/numberFormatting"
-import { Typography } from "@scandic-hotels/design-system/Typography"
-
-import styles from "./breakfast.module.css"
-
-import type { PackageSchema } from "@scandic-hotels/trpc/types/bookingConfirmation"
-
-interface BreakfastProps {
-  breakfast: PackageSchema | false | undefined
-  breakfastIncluded: boolean
-  guests: string
-}
-
-export default function Breakfast({
-  breakfast,
-  breakfastIncluded,
-  guests,
-}: BreakfastProps) {
-  const intl = useIntl()
-
-  const breakfastBuffet = intl.formatMessage({
-    id: "common.breakfastBuffet",
-    defaultMessage: "Breakfast buffet",
-  })
-
-  if (breakfastIncluded || breakfast) {
-    const price = breakfast
-      ? formatPrice(intl, breakfast.totalPrice, breakfast.currency)
-      : intl.formatMessage({
-          id: "common.included",
-          defaultMessage: "Included",
-        })
-    return (
-      <div className={styles.entry}>
-        <div>
-          <Typography variant="Body/Paragraph/mdRegular">
-            <p className={styles.textDefault}>{breakfastBuffet}</p>
-          </Typography>
-          <Typography variant="Body/Supporting text (caption)/smRegular">
-            <p className={styles.textSecondary}>{guests}</p>
-          </Typography>
-        </div>
-        <Typography variant="Body/Paragraph/mdRegular">
-          <p className={styles.textDefault}>{price}</p>
-        </Typography>
-      </div>
-    )
-  }
-
-  if (breakfast === false) {
-    const noBreakfast = intl.formatMessage({
-      id: "common.noBreakfast",
-      defaultMessage: "No breakfast",
-    })
-    return (
-      <div className={styles.entry}>
-        <Typography variant="Body/Paragraph/mdRegular">
-          <p className={styles.textDefault}>{breakfastBuffet}</p>
-        </Typography>
-        <Typography variant="Body/Paragraph/mdRegular">
-          <p className={styles.textDefault}>{noBreakfast}</p>
-        </Typography>
-      </div>
-    )
-  }
-
-  return null
-}

packages/booking-flow/lib/components/BookingConfirmation/Receipt/Room/index.tsx

@@ -15,7 +15,7 @@ import { ChildBedTypeEnum } from "@scandic-hotels/trpc/enums/childBedTypeEnum"
 
 import { useBookingConfirmationStore } from "../../../../stores/booking-confirmation"
 import { getRoomFeatureDescription } from "../../../../utils/getRoomFeatureDescription"
-import Breakfast from "./Breakfast"
+import { SummaryBreakfast } from "../../../SummaryBreakfast"
 import RoomSkeletonLoader from "./RoomSkeletonLoader"
 
 import styles from "./room.module.css"
@@ -36,11 +36,12 @@ export function ReceiptRoom({
   showBookingCodeChip = false,
 }: BookingConfirmationReceiptRoomProps) {
   const intl = useIntl()
-  const { currencyCode, isVatCurrency, bookingCode } =
+  const { currencyCode, isVatCurrency, bookingCode, hotelOffersBreakfast } =
     useBookingConfirmationStore((state) => ({
       currencyCode: state.currencyCode,
       isVatCurrency: state.isVatCurrency,
       bookingCode: state.bookingCode,
+      hotelOffersBreakfast: state.hotelOffersBreakfast,
     }))
 
   if (!room) {
@@ -80,6 +81,11 @@ export function ReceiptRoom({
   const showDiscounted =
     room.rateDefinition.isMemberRate || room.rateDefinition.isCampaignRate
 
+  const breakfastPrice = room.breakfast
+    ? room.breakfast?.totalPrice
+    : room.breakfast
+  const breakfastCurrency = room.breakfast ? room.breakfast?.currency : null
+
   return (
     <>
       <div className={styles.room}>
@@ -275,10 +281,12 @@ export function ReceiptRoom({
             </div>
           </Typography>
         ) : null}
-        <Breakfast
-          breakfast={room.breakfast}
+        <SummaryBreakfast
+          breakfastPrice={breakfastPrice}
+          breakfastCurrency={breakfastCurrency}
           breakfastIncluded={room.breakfastIncluded}
           guests={guests}
+          hotelOffersBreakfast={hotelOffersBreakfast}
         />
 
         {showBookingCodeChip && (

packages/booking-flow/lib/components/BookingConfirmation/index.tsx

@@ -4,6 +4,7 @@ import { AlertTypeEnum } from "@scandic-hotels/common/constants/alert"
 import { dt } from "@scandic-hotels/common/dt"
 import { Alert } from "@scandic-hotels/design-system/Alert"
 import { Divider } from "@scandic-hotels/design-system/Divider"
+import { HotelTypeEnum } from "@scandic-hotels/trpc/enums/hotelType"
 
 import { BookingConfirmationProvider } from "../../providers/BookingConfirmationProvider"
 import { getBookingConfirmation } from "../../trpc/memoizedRequests/getBookingConfirmation"
@@ -51,6 +52,7 @@ export async function BookingConfirmation({
       bookingCode={booking.bookingCode}
       currencyCode={booking.currencyCode}
       fromDate={booking.checkInDate}
+      hotelOffersBreakfast={hotel.hotelType !== HotelTypeEnum.ScandicGo}
       toDate={booking.checkOutDate}
       roomCategories={roomCategories}
       rooms={[