Merge branch 'develop' into feature/sw-561-design-fixes

app/[lang]/(live)/(public)/hotelreservation/[section]/page.tsx

@@ -1,13 +1,13 @@
 import { notFound } from "next/navigation"
 
+import { getProfileSafely } from "@/lib/trpc/memoizedRequests"
 import { serverClient } from "@/lib/trpc/server"
 
+import BedType from "@/components/HotelReservation/EnterDetails/BedType"
+import Breakfast from "@/components/HotelReservation/EnterDetails/Breakfast"
+import Details from "@/components/HotelReservation/EnterDetails/Details"
 import HotelSelectionHeader from "@/components/HotelReservation/HotelSelectionHeader"
-import BedSelection from "@/components/HotelReservation/SelectRate/BedSelection"
-import BreakfastSelection from "@/components/HotelReservation/SelectRate/BreakfastSelection"
-import Details from "@/components/HotelReservation/SelectRate/Details"
 import Payment from "@/components/HotelReservation/SelectRate/Payment"
-import RoomSelection from "@/components/HotelReservation/SelectRate/RoomSelection"
 import SectionAccordion from "@/components/HotelReservation/SelectRate/SectionAccordion"
 import Summary from "@/components/HotelReservation/SelectRate/Summary"
 import { getIntl } from "@/i18n"
@@ -79,6 +79,7 @@ export default async function SectionsPage({
   searchParams,
 }: PageArgs<LangParams & { section: string }, SectionPageProps>) {
   setLang(params.lang)
+  const profile = await getProfileSafely()
 
   const hotel = await serverClient().hotel.hotelData.get({
     hotelId: "811",
@@ -114,6 +115,11 @@ export default async function SectionsPage({
 
   const currentSearchParams = new URLSearchParams(searchParams).toString()
 
+  let user = null
+  if (profile && !("error" in profile)) {
+    user = profile
+  }
+
   return (
     <div>
       <HotelSelectionHeader hotel={hotel.data.attributes} />
@@ -131,47 +137,26 @@ export default async function SectionsPage({
                 : undefined
             }
             path={`select-rate?${currentSearchParams}`}
-          >
-            {params.section === "select-rate" && (
-              <RoomSelection
-                alternatives={rooms}
-                nextPath="select-bed"
-                // TODO: Get real value
-                nrOfNights={1}
-                // TODO: Get real value
-                nrOfAdults={1}
-              />
-            )}
-          </SectionAccordion>
+          ></SectionAccordion>
           <SectionAccordion
             header={intl.formatMessage({ id: "Bed type" })}
             selection={selectedBed}
             path={`select-bed?${currentSearchParams}`}
           >
-            {params.section === "select-bed" && (
-              <BedSelection
-                nextPath="breakfast"
-                alternatives={bedAlternatives}
-              />
-            )}
+            {params.section === "select-bed" ? <BedType /> : null}
           </SectionAccordion>
           <SectionAccordion
             header={intl.formatMessage({ id: "Breakfast" })}
             selection={selectedBreakfast}
             path={`breakfast?${currentSearchParams}`}
           >
-            {params.section === "breakfast" && (
-              <BreakfastSelection
-                alternatives={breakfastAlternatives}
-                nextPath="details"
-              />
-            )}
+            {params.section === "breakfast" ? <Breakfast /> : null}
           </SectionAccordion>
           <SectionAccordion
             header={intl.formatMessage({ id: "Your details" })}
             path={`details?${currentSearchParams}`}
           >
-            {params.section === "details" && <Details nextPath="payment" />}
+            {params.section === "details" ? <Details user={user} /> : null}
           </SectionAccordion>
           <SectionAccordion
             header={intl.formatMessage({ id: "Payment info" })}

app/[lang]/(live)/(public)/hotelreservation/select-hotel/utils.ts

@@ -9,7 +9,7 @@ import { Filter } from "@/types/components/hotelReservation/selectHotel/hotelFil
 export async function fetchAvailableHotels(
   input: AvailabilityInput
 ): Promise<HotelData[]> {
-  const availableHotels = await serverClient().hotel.availability.get(input)
+  const availableHotels = await serverClient().hotel.availability.hotels(input)
 
   if (!availableHotels) throw new Error()
 

app/[lang]/(live)/(public)/hotelreservation/select-rate/page.module.css

@@ -0,0 +1,25 @@
+.page {
+  min-height: 100dvh;
+  padding-top: var(--Spacing-x6);
+  padding-left: var(--Spacing-x2);
+  padding-right: var(--Spacing-x2);
+  background-color: var(--Scandic-Brand-Warm-White);
+}
+
+.content {
+  max-width: 1134px;
+  margin-top: var(--Spacing-x5);
+  margin-left: auto;
+  margin-right: auto;
+  display: flex;
+  justify-content: space-between;
+  gap: var(--Spacing-x7);
+}
+
+.main {
+  flex-grow: 1;
+}
+
+.summary {
+  max-width: 340px;
+}

app/[lang]/(live)/(public)/hotelreservation/select-rate/page.tsx

@@ -0,0 +1,53 @@
+import { serverClient } from "@/lib/trpc/server"
+import tempHotelData from "@/server/routers/hotels/tempHotelData.json"
+
+import RoomSelection from "@/components/HotelReservation/SelectRate/RoomSelection"
+import { getIntl } from "@/i18n"
+import { setLang } from "@/i18n/serverContext"
+
+import styles from "./page.module.css"
+
+import { SelectRateSearchParams } from "@/types/components/hotelReservation/selectRate/selectRate"
+import { LangParams, PageArgs } from "@/types/params"
+
+export default async function SelectRatePage({
+  params,
+  searchParams,
+}: PageArgs<LangParams & { section: string }, SelectRateSearchParams>) {
+  setLang(params.lang)
+
+  // TODO: Use real endpoint.
+  const hotel = tempHotelData.data.attributes
+
+  const rates = await serverClient().hotel.rates.get({
+    // TODO: pass the correct hotel ID and all other parameters that should be included in the search
+    hotelId: searchParams.hotel,
+  })
+
+  // const rates = await serverClient().hotel.availability.getForHotel({
+  // hotelId: 811,
+  // roomStayStartDate: "2024-11-02",
+  // roomStayEndDate: "2024-11-03",
+  // adults: 1,
+  // })
+  const intl = await getIntl()
+
+  return (
+    <div>
+      {/* TODO: Add Hotel Listing Card */}
+      <div>Hotel Listing Card TBI</div>
+
+      <div className={styles.content}>
+        <div className={styles.main}>
+          <RoomSelection
+            rates={rates}
+            // TODO: Get real value
+            nrOfNights={1}
+            // TODO: Get real value
+            nrOfAdults={1}
+          />
+        </div>
+      </div>
+    </div>
+  )
+}