feat(SW-1710): add access checks to my stay page for viewing booking

apps/scandic-web/components/HotelReservation/MyStay/index.tsx

@@ -1,3 +1,4 @@
+import { cookies } from "next/headers"
 import { notFound } from "next/navigation"
 import { Suspense } from "react"
 
@@ -9,12 +10,20 @@ import {
   getBookingConfirmation,
   getProfileSafely,
 } from "@/lib/trpc/memoizedRequests"
+import { decrypt } from "@/server/routers/utils/encryption"
 
 import Image from "@/components/Image"
+import Body from "@/components/TempDesignSystem/Text/Body"
 import { getIntl } from "@/i18n"
 import { getLang } from "@/i18n/serverContext"
 
+import AdditionalInfoForm from "../FindMyBooking/AdditionalInfoForm"
 import LinkedReservationSkeleton from "./LinkedReservation/LinkedReservationSkeleton"
+import accessBooking, {
+  ACCESS_GRANTED,
+  ERROR_BAD_REQUEST,
+  ERROR_UNAUTHORIZED,
+} from "./accessBooking"
 import { Ancillaries } from "./Ancillaries"
 import BookingSummary from "./BookingSummary"
 import { Header } from "./Header"
@@ -25,83 +34,120 @@ import { Room } from "./Room"
 
 import styles from "./myStay.module.css"
 
-export async function MyStay({ reservationId }: { reservationId: string }) {
-  const bookingConfirmation = await getBookingConfirmation(reservationId)
+export async function MyStay({ refId }: { refId: string }) {
+  const value = decrypt(refId)
+  if (!value) {
+    return notFound()
+  }
+  const [confirmationNumber, lastName] = value.split(",")
+  const bookingConfirmation = await getBookingConfirmation(confirmationNumber)
   if (!bookingConfirmation) {
     return notFound()
   }
 
   const { booking, hotel, room } = bookingConfirmation
-
-  const linkedBookingPromises = booking.linkedReservations
-    ? booking.linkedReservations.map((linkedBooking) => {
-        return getBookingConfirmation(linkedBooking.confirmationNumber)
-      })
-    : []
-
-  const userResponse = await getProfileSafely()
-  const user = userResponse && !("error" in userResponse) ? userResponse : null
+  const user = await getProfileSafely()
+  const cookie = cookies()
+  const bv = cookie.get("bv")?.value
   const intl = await getIntl()
-  const lang = getLang()
-  const homeUrl = homeHrefs[env.NODE_ENV][lang]
-  const fromDate = dt(booking.checkInDate).format("YYYY-MM-DD")
-  const toDate = dt(booking.checkOutDate).format("YYYY-MM-DD")
-  const hotelId = hotel.operaId
-  const ancillaryInput = { fromDate, hotelId, toDate }
-  const ancillaryPackages = await getAncillaryPackages(ancillaryInput)
 
-  return (
-    <main className={styles.main}>
-      <div className={styles.imageContainer}>
-        <div className={styles.blurOverlay} />
+  const access = accessBooking(booking.guest, lastName, user, bv)
+  if (access.status === ACCESS_GRANTED.status) {
+    const linkedBookingPromises = booking.linkedReservations
+      ? booking.linkedReservations.map((linkedBooking) => {
+          return getBookingConfirmation(linkedBooking.confirmationNumber)
+        })
+      : []
 
-        <Image
-          className={styles.image}
-          src={
-            hotel.gallery?.heroImages[0]?.imageSizes.large ??
-            hotel.galleryImages[0]?.imageSizes.large ??
-            ""
-          }
-          alt={hotel.name}
-          fill
-        />
-      </div>
-      <div className={styles.content}>
-        <div className={styles.headerContainer}>
-          <Header hotel={hotel} />
-          <ReferenceCard booking={booking} hotel={hotel} />
-        </div>
-        {booking.showAncillaries && (
-          <Ancillaries
-            ancillaries={ancillaryPackages}
-            booking={booking}
-            user={user}
+    const lang = getLang()
+    const ancillaryPackages = await getAncillaryPackages({
+      fromDate: dt(booking.checkInDate).format("YYYY-MM-DD"),
+      hotelId: hotel.operaId,
+      toDate: dt(booking.checkOutDate).format("YYYY-MM-DD"),
+    })
+
+    return (
+      <main className={styles.main}>
+        <div className={styles.imageContainer}>
+          <div className={styles.blurOverlay} />
+
+          <Image
+            className={styles.image}
+            src={
+              hotel.gallery?.heroImages[0]?.imageSizes.large ??
+              hotel.galleryImages[0]?.imageSizes.large ??
+              ""
+            }
+            alt={hotel.name}
+            fill
           />
-        )}
-        <div>
-          <Room booking={booking} room={room} hotel={hotel} user={user} />
-          {booking.linkedReservations.map((linkedRes, index) => (
-            <Suspense
-              key={linkedRes.confirmationNumber}
-              fallback={<LinkedReservationSkeleton />}
-            >
-              <LinkedReservation
-                bookingPromise={linkedBookingPromises[index]}
-                index={index}
-              />
-            </Suspense>
-          ))}
         </div>
-        <BookingSummary booking={booking} hotel={hotel} room={room} />
-        <Promo
-          buttonText={intl.formatMessage({ id: "Book another stay" })}
-          href={`${homeUrl}?hotel=${hotel.operaId}`}
-          text={intl.formatMessage({
-            id: "Get inspired and start dreaming beyond your next trip. Explore more Scandic destinations.",
-          })}
-          title={intl.formatMessage({ id: "Book your next stay" })}
-        />
-      </div>
-    </main>
-  )
+        <div className={styles.content}>
+          <div className={styles.headerContainer}>
+            <Header hotel={hotel} />
+            <ReferenceCard booking={booking} hotel={hotel} />
+          </div>
+          {booking.showAncillaries && (
+            <Ancillaries
+              ancillaries={ancillaryPackages}
+              booking={booking}
+              user={user}
+            />
+          )}
+          <div>
+            <Room booking={booking} room={room} hotel={hotel} user={user} />
+            {booking.linkedReservations.map((linkedRes, index) => (
+              <Suspense
+                key={linkedRes.confirmationNumber}
+                fallback={<LinkedReservationSkeleton />}
+              >
+                <LinkedReservation
+                  bookingPromise={linkedBookingPromises[index]}
+                  index={index}
+                />
+              </Suspense>
+            ))}
+          </div>
+          <BookingSummary booking={booking} hotel={hotel} room={room} />
+          <Promo
+            buttonText={intl.formatMessage({ id: "Book another stay" })}
+            href={`${homeHrefs[env.NODE_ENV][lang]}?hotel=${hotel.operaId}`}
+            text={intl.formatMessage({
+              id: "Get inspired and start dreaming beyond your next trip. Explore more Scandic destinations.",
+            })}
+            title={intl.formatMessage({ id: "Book your next stay" })}
+          />
+        </div>
+      </main>
+    )
+  }
+
+  if (access.status === ERROR_BAD_REQUEST.status) {
+    return (
+      <main className={styles.main}>
+        <div className={styles.form}>
+          <AdditionalInfoForm
+            confirmationNumber={confirmationNumber}
+            lastName={lastName}
+          />
+        </div>
+      </main>
+    )
+  }
+
+  if (access.status === ERROR_UNAUTHORIZED.status) {
+    return (
+      <main className={styles.main}>
+        <div className={styles.logIn}>
+          <Body textAlign="center">
+            {intl.formatMessage({
+              id: "In order to view your booking, please log in.",
+            })}
+          </Body>
+        </div>
+      </main>
+    )
+  }
+
+  return notFound()
 }