scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in feat/refactor-header-footer-sitewidealert (pull request #1374)

Browse Source 
Refactor: removed parallel routes for header, footer and sidewidealert. Langswitcher and sidewidealert now client components

* feat - removed parallel routes and made sidepeek and sitewidealerts as client components

* Langswitcher as client component

* Fixed lang switcher for current header

* Passing lang when fetching siteconfig

* Merge branch 'master' into feat/refactor-header-footer-sitewidealert

* Refactor

* Removed dead code

* Show only languages that has translation

* Refetch sitewidealert every 60 seconds

* Merge branch 'master' into feat/refactor-header-footer-sitewidealert

* Removed sidepeek parallel route from my-stay

* Added missing env.var to env.test

* Removed console.log


Approved-by: Joakim Jäderberg
This commit is contained in:
Linus Flood
2025-02-19 08:59:24 +00:00
parent c2b7d97ddd
commit 7c0f9084b6
45 changed files with 664 additions and 697 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
app/[lang]/(live)/(public)/hotelreservation/(standard)/@sidePeek/[...paths]/loading.tsx
View File

@@ -1,5 +0,0 @@
import LoadingSpinner from "@/components/LoadingSpinner"
export default function LoadingHotelSidePeek() {
return <LoadingSpinner />
}

22
app/[lang]/(live)/(public)/hotelreservation/(standard)/@sidePeek/[...paths]/page.tsx
View File

@@ -1,22 +0,0 @@
import { getHotel } from "@/lib/trpc/memoizedRequests"
import SidePeek from "@/components/HotelReservation/SidePeek"
import type { LangParams, PageArgs } from "@/types/params"
export default async function HotelSidePeek({
params,
searchParams,
}: PageArgs<LangParams, { hotel: string }>) {
if (!searchParams.hotel) {
return <SidePeek hotel={null} />
}
const hotel = await getHotel({
hotelId: searchParams.hotel,
language: params.lang,
isCardOnlyPayment: false,
})
return <SidePeek hotel={hotel} />
}

3
app/[lang]/(live)/(public)/hotelreservation/(standard)/@sidePeek/page.tsx
View File

@@ -1,3 +0,0 @@
export default function HotelSidePeekSlot() {
return null
}

9
app/[lang]/(live)/(public)/hotelreservation/(standard)/layout.tsx
View File

@@ -1,17 +1,16 @@
import SidePeek from "@/components/HotelReservation/SidePeek"
import styles from "./layout.module.css"
import type { LangParams, LayoutArgs } from "@/types/params"
export default function HotelReservationLayout({
children,
sidePeek,
}: React.PropsWithChildren<LayoutArgs<LangParams>> & {
sidePeek: React.ReactNode
}) {
}: React.PropsWithChildren<LayoutArgs<LangParams>>) {
return (
<div className={styles.layout}>
{children}
{sidePeek}
<SidePeek />
</div>
)
}

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

@@ -1,32 +1,12 @@
import { differenceInCalendarDays, format, isWeekend } from "date-fns"
import stringify from "json-stable-stringify-without-jsonify"
import { notFound } from "next/navigation"
import { Suspense } from "react"
import { getHotel } from "@/lib/trpc/memoizedRequests"
import HotelInfoCard, {
HotelInfoCardSkeleton,
} from "@/components/HotelReservation/SelectRate/HotelInfoCard"
import {
preload,
RoomsContainer,
} from "@/components/HotelReservation/SelectRate/RoomsContainer"
import SelectRate from "@/components/HotelReservation/SelectRate"
import { HotelInfoCardSkeleton } from "@/components/HotelReservation/SelectRate/HotelInfoCard"
import { RoomsContainerSkeleton } from "@/components/HotelReservation/SelectRate/RoomsContainer/RoomsContainerSkeleton"
import TrackingSDK from "@/components/TrackingSDK"
import { setLang } from "@/i18n/serverContext"
import { convertSearchParamsToObj } from "@/utils/url"
import { getHotelSearchDetails } from "../utils"
import { getValidDates } from "./getValidDates"
import { ChildBedMapEnum } from "@/types/components/bookingWidget/enums"
import type { SelectRateSearchParams } from "@/types/components/hotelReservation/selectRate/selectRate"
import {
TrackingChannelEnum,
type TrackingSDKHotelInfo,
type TrackingSDKPageData,
} from "@/types/components/tracking"
import type { LangParams, PageArgs } from "@/types/params"
export default async function SelectRatePage({
@@ -34,93 +14,20 @@ export default async function SelectRatePage({
searchParams,
}: PageArgs<LangParams & { section: string }, SelectRateSearchParams>) {
setLang(params.lang)
const searchDetails = await getHotelSearchDetails({ searchParams })
if (!searchDetails?.hotel) {
return notFound()
}
const { hotel, adultsInRoom, childrenInRoom, selectHotelParams } =
searchDetails
const { fromDate, toDate } = getValidDates(
selectHotelParams.fromDate,
selectHotelParams.toDate
)
preload(
hotel.id,
params.lang,
fromDate.format("YYYY-MM-DD"),
toDate.format("YYYY-MM-DD"),
adultsInRoom,
childrenInRoom
)
const hotelData = await getHotel({
hotelId: hotel.id,
isCardOnlyPayment: false,
language: params.lang,
})
const arrivalDate = fromDate.toDate()
const departureDate = toDate.toDate()
const pageTrackingData: TrackingSDKPageData = {
pageId: "select-rate",
domainLanguage: params.lang,
channel: TrackingChannelEnum["hotelreservation"],
pageName: "hotelreservation|select-rate",
siteSections: "hotelreservation|select-rate",
pageType: "bookingroomsandratespage",
siteVersion: "new-web",
}
const hotelsTrackingData: TrackingSDKHotelInfo = {
searchTerm: selectHotelParams.city ?? hotel?.name,
arrivalDate: format(arrivalDate, "yyyy-MM-dd"),
departureDate: format(departureDate, "yyyy-MM-dd"),
noOfAdults: adultsInRoom[0], // TODO: Handle multiple rooms
noOfChildren: childrenInRoom?.length,
ageOfChildren: childrenInRoom?.map((c) => c.age).join(","),
childBedPreference: childrenInRoom
?.map((c) => ChildBedMapEnum[c.bed])
.join("|"),
noOfRooms: 1, // // TODO: Handle multiple rooms
duration: differenceInCalendarDays(departureDate, arrivalDate),
leadTime: differenceInCalendarDays(arrivalDate, new Date()),
searchType: "hotel",
bookingTypeofDay: isWeekend(arrivalDate) ? "weekend" : "weekday",
country: hotelData?.hotel.address.country,
hotelID: hotel?.id,
region: hotelData?.hotel.address.city,
}
const hotelId = +hotel.id
const booking = convertSearchParamsToObj<SelectRateSearchParams>(searchParams)
const suspenseKey = stringify(searchParams)
return (
<>
<Suspense fallback={<HotelInfoCardSkeleton />}>
<HotelInfoCard hotelData={hotelData} />
</Suspense>
<Suspense key={suspenseKey} fallback={<RoomsContainerSkeleton />}>
<RoomsContainer
adultArray={adultsInRoom}
booking={booking}
childArray={childrenInRoom}
fromDate={arrivalDate}
hotelId={hotelId}
lang={params.lang}
toDate={departureDate}
/>
</Suspense>
<Suspense key={suspenseKey} fallback={null}>
<TrackingSDK
pageData={pageTrackingData}
hotelInfo={hotelsTrackingData}
/>
</Suspense>
</>
return (
<Suspense
key={suspenseKey}
fallback={
<>
<HotelInfoCardSkeleton />
<RoomsContainerSkeleton />
</>
}
>
<SelectRate params={params} searchParams={searchParams} />
</Suspense>
)
}

22
app/[lang]/(live)/(public)/hotelreservation/my-stay/[refId]/@sidePeek/page.tsx
View File

@@ -1,22 +0,0 @@
import { getHotel } from "@/lib/trpc/memoizedRequests"
import SidePeek from "@/components/HotelReservation/SidePeek"
import type { LangParams, PageArgs } from "@/types/params"
export default async function HotelSidePeek({
params,
searchParams,
}: PageArgs<LangParams, { hotel: string }>) {
if (!searchParams.hotel) {
return <SidePeek hotel={null} />
}
const hotel = await getHotel({
hotelId: searchParams.hotel,
language: params.lang,
isCardOnlyPayment: false,
})
return <SidePeek hotel={hotel} />
}

9
app/[lang]/(live)/(public)/hotelreservation/my-stay/[refId]/layout.tsx
View File

@@ -1,15 +1,14 @@
import SidePeek from "@/components/HotelReservation/SidePeek"
import type { LangParams, LayoutArgs } from "@/types/params"
export default function HotelReservationLayout({
children,
sidePeek,
}: React.PropsWithChildren<LayoutArgs<LangParams>> & {
sidePeek: React.ReactNode
}) {
}: React.PropsWithChildren<LayoutArgs<LangParams>>) {
return (
<div>
{children}
{sidePeek}
<SidePeek />
</div>
)
}

1
app/[lang]/(live)/@footer/[...path]/page.tsx
View File

@@ -1 +0,0 @@
export { default } from "../page"

17
app/[lang]/(live)/@footer/loading.tsx
View File

@@ -1,17 +0,0 @@
import { env } from "@/env/server"
import CurrentLoadingSpinner from "@/components/Current/LoadingSpinner"
import { FooterDetailsSkeleton } from "@/components/Footer/Details"
import { FooterNavigationSkeleton } from "@/components/Footer/Navigation"
export default function LoadingFooter() {
if (env.HIDE_FOR_NEXT_RELEASE) {
return <CurrentLoadingSpinner />
}
return (
<footer>
<FooterNavigationSkeleton />
<FooterDetailsSkeleton />
</footer>
)
}

19
app/[lang]/(live)/@footer/page.tsx
View File

@@ -1,19 +0,0 @@
import { env } from "@/env/server"
import CurrentFooter from "@/components/Current/Footer"
import Footer, { preload } from "@/components/Footer"
import { setLang } from "@/i18n/serverContext"
import type { LangParams, PageArgs } from "@/types/params"
export default function FooterSlot({ params }: PageArgs<LangParams>) {
setLang(params.lang)
if (env.HIDE_FOR_NEXT_RELEASE) {
return <CurrentFooter />
}
preload()
return <Footer />
}

1
app/[lang]/(live)/@header/[...path]/page.tsx
View File

@@ -1 +0,0 @@
export { default } from "../page"

24
app/[lang]/(live)/@header/page.tsx
View File

@@ -1,24 +0,0 @@
import { Suspense } from "react"
import { env } from "@/env/server"
import CurrentHeader from "@/components/Current/Header"
import HeaderFallback from "@/components/Current/Header/HeaderFallback"
import Header from "@/components/Header"
import { setLang } from "@/i18n/serverContext"
import type { LangParams, PageArgs } from "@/types/params"
export default function HeaderPage({ params }: PageArgs<LangParams>) {
setLang(params.lang)
if (env.HIDE_FOR_NEXT_RELEASE) {
return (
<Suspense fallback={<HeaderFallback />}>
<CurrentHeader />
</Suspense>
)
}
return <Header />
}

1
app/[lang]/(live)/@sitewidealert/[...path]/page.tsx
View File

@@ -1 +0,0 @@
export { default } from "../page"

23
app/[lang]/(live)/@sitewidealert/page.tsx
View File

@@ -1,23 +0,0 @@
import { Suspense } from "react"
import { env } from "@/env/server"
import SitewideAlert, { preload } from "@/components/SitewideAlert"
import { setLang } from "@/i18n/serverContext"
import type { LangParams, PageArgs } from "@/types/params"
export default function SitewideAlertPage({ params }: PageArgs<LangParams>) {
if (!env.SHOW_SITE_WIDE_ALERT) {
return null
}
setLang(params.lang)
void preload()
return (
<Suspense>
<SitewideAlert />
</Suspense>
)
}

15
app/[lang]/(live)/layout.tsx
View File

@@ -9,7 +9,10 @@ import TrpcProvider from "@/lib/trpc/Provider"
import { SessionRefresher } from "@/components/Auth/TokenRefresher"
import CookieBotConsent from "@/components/CookieBot"
import Footer from "@/components/Footer"
import Header from "@/components/Header"
import StorageCleaner from "@/components/HotelReservation/EnterDetails/StorageCleaner"
import SitewideAlert from "@/components/SitewideAlert"
import { ToastHandler } from "@/components/TempDesignSystem/Toasts"
import { preloadUserTracking } from "@/components/TrackingSDK"
import AdobeSDKScript from "@/components/TrackingSDK/AdobeSDKScript"
@@ -24,16 +27,10 @@ import type { LangParams, LayoutArgs } from "@/types/params"
export default async function RootLayout({
bookingwidget,
children,
footer,
header,
sitewidealert,
params,
}: React.PropsWithChildren<
LayoutArgs<LangParams> & {
bookingwidget: React.ReactNode
footer: React.ReactNode
header: React.ReactNode
sitewidealert: React.ReactNode
}
>) {
setLang(params.lang)
@@ -62,11 +59,11 @@ export default async function RootLayout({
<ServerIntlProvider intl={{ defaultLocale, locale, messages }}>
<TrpcProvider>
<RouterTracking />
{sitewidealert}
{header}
<SitewideAlert />
<Header />
{bookingwidget}
{children}
{footer}
<Footer />
<ToastHandler />
<SessionRefresher />
<StorageCleaner />