feat(SW-2116): RefId instead of confirmationNumber

apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/LinkedReservation/index.tsx

@@ -20,14 +20,16 @@ import { CurrencyEnum } from "@/types/enums/currency"
 export function LinkedReservation({
   checkInTime,
   checkOutTime,
-  confirmationNumber,
+  refId,
   roomIndex,
 }: LinkedReservationProps) {
   const lang = useLang()
-  const { data, refetch, isLoading } = trpc.booking.get.useQuery({
-    confirmationNumber,
+
+  const { data, refetch, isLoading } = trpc.booking.confirmation.useQuery({
+    refId,
     lang,
   })
+
   const {
     setRoom,
     setFormattedTotalCost,
@@ -41,6 +43,7 @@ export function LinkedReservation({
     totalBookingPrice: state.totalBookingPrice,
     totalBookingCheques: state.totalBookingCheques,
   }))
+
   const intl = useIntl()
 
   useEffect(() => {
@@ -78,7 +81,9 @@ export function LinkedReservation({
   if (!data?.room) {
     return <Retry handleRefetch={refetch} />
   }
+
   const { booking, room } = data
+
   return (
     <Room
       checkInDate={booking.checkInDate}
@@ -86,8 +91,8 @@ export function LinkedReservation({
       checkInTime={checkInTime}
       checkOutTime={checkOutTime}
       confirmationNumber={booking.confirmationNumber}
-      guest={booking.guest}
       guaranteeInfo={booking.guaranteeInfo}
+      guest={booking.guest}
       img={room.images[0]}
       rateDefinition={booking.rateDefinition}
       roomName={room.name}

apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/index.tsx

@@ -9,30 +9,35 @@ import styles from "./rooms.module.css"
 
 import type { BookingConfirmationRoomsProps } from "@/types/components/hotelReservation/bookingConfirmation/rooms"
 
+async function RoomTitle({ nr }: { nr: number }) {
+  const intl = await getIntl()
+
+  return (
+    <Typography variant="Title/Subtitle/md">
+      <h2 className={styles.roomTitle}>
+        {intl.formatMessage(
+          {
+            defaultMessage: "Room {roomIndex}",
+          },
+          { roomIndex: nr }
+        )}
+      </h2>
+    </Typography>
+  )
+}
+
 export default async function Rooms({
   booking,
   checkInTime,
   checkOutTime,
   mainRoom,
-  linkedReservations,
 }: BookingConfirmationRoomsProps) {
-  const intl = await getIntl()
+  const { linkedReservations } = booking
 
   return (
     <section className={styles.rooms}>
       <div className={styles.room}>
-        {linkedReservations.length ? (
-          <Typography variant="Title/Subtitle/md">
-            <h2 className={styles.roomTitle}>
-              {intl.formatMessage(
-                {
-                  defaultMessage: "Room {roomIndex}",
-                },
-                { roomIndex: 1 }
-              )}
-            </h2>
-          </Typography>
-        ) : null}
+        {linkedReservations.length ? <RoomTitle nr={1} /> : null}
         <Room
           checkInDate={booking.checkInDate}
           checkOutDate={booking.checkOutDate}
@@ -49,20 +54,11 @@ export default async function Rooms({
 
       {linkedReservations.map((reservation, idx) => (
         <div className={styles.room} key={reservation.confirmationNumber}>
-          <Typography variant="Title/Subtitle/md">
-            <h2 className={styles.roomTitle}>
-              {intl.formatMessage(
-                {
-                  defaultMessage: "Room {roomIndex}",
-                },
-                { roomIndex: idx + 2 }
-              )}
-            </h2>
-          </Typography>
+          <RoomTitle nr={idx + 2} />
           <LinkedReservation
             checkInTime={checkInTime}
             checkOutTime={checkOutTime}
-            confirmationNumber={reservation.confirmationNumber}
+            refId={reservation.refId}
             roomIndex={idx + 1}
           />
         </div>