Merge branch 'develop' into feature/sw-561-design-fixes
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import { ArrowRightIcon } from "@/components/Icons"
|
||||
import ManagePreferencesButton from "@/components/Profile/ManagePreferencesButton"
|
||||
import Link from "@/components/TempDesignSystem/Link"
|
||||
import Body from "@/components/TempDesignSystem/Text/Body"
|
||||
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
|
||||
@@ -27,12 +28,7 @@ export default async function CommunicationSlot({
|
||||
})}
|
||||
</Body>
|
||||
</article>
|
||||
<Link href="#" variant="icon">
|
||||
<ArrowRightIcon color="burgundy" />
|
||||
<Body color="burgundy" textTransform="underlined">
|
||||
{formatMessage({ id: "Manage preferences" })}
|
||||
</Body>
|
||||
</Link>
|
||||
<ManagePreferencesButton />
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
import { env } from "@/env/server"
|
||||
import { serverClient } from "@/lib/trpc/server"
|
||||
|
||||
import AddCreditCardButton from "@/components/Profile/AddCreditCardButton"
|
||||
@@ -17,8 +16,6 @@ export default async function CreditCardSlot({ params }: PageArgs<LangParams>) {
|
||||
const { formatMessage } = await getIntl()
|
||||
const creditCards = await serverClient().user.creditCards()
|
||||
|
||||
const { lang } = params
|
||||
|
||||
return (
|
||||
<section className={styles.container}>
|
||||
<article className={styles.content}>
|
||||
|
||||
@@ -15,8 +15,7 @@ export default function ProfileLayout({
|
||||
{profile}
|
||||
<Divider color="burgundy" opacity={8} />
|
||||
{creditCards}
|
||||
{/* TODO: Implement communication preferences flow. Hidden until decided on where to send user. */}
|
||||
{/* {communication} */}
|
||||
{communication}
|
||||
</section>
|
||||
</main>
|
||||
)
|
||||
|
||||
@@ -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" })}
|
||||
|
||||
@@ -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()
|
||||
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
@@ -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>
|
||||
)
|
||||
}
|
||||
4
app/[lang]/(live)/@bookingwidget/loading.module.css
Normal file
4
app/[lang]/(live)/@bookingwidget/loading.module.css
Normal file
@@ -0,0 +1,4 @@
|
||||
.container {
|
||||
height: 76px;
|
||||
width: 100%;
|
||||
}
|
||||
11
app/[lang]/(live)/@bookingwidget/loading.tsx
Normal file
11
app/[lang]/(live)/@bookingwidget/loading.tsx
Normal file
@@ -0,0 +1,11 @@
|
||||
import LoadingSpinner from "@/components/LoadingSpinner"
|
||||
|
||||
import styles from "./loading.module.css"
|
||||
|
||||
export default function LoadingBookingWidget() {
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
<LoadingSpinner />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user