Merged in chore/next15 (pull request #1999)

chore (SW-834): Upgrade to Next 15

* wip: apply codemod and upgrade swc plugin

* wip: design-system to react 19, fix issues from async (search)params

* wip: fix remaining issues from codemod

serverClient is now async because context use headers()
getLang is now async because it uses headers()

* Minor cleanup

* Inline react-material-symbols package

Package is seemingly not maintained any more and doesn't support
React 19. This copies the package source into `design-system`,
makes the necessary changes for 19 and export it for others to use.

* Fix missing awaits

* Disable modal exit animations

Enabling modal exit animations via isExiting prop is causing
modals to be rendered in "hidden" state and never unmount.
Seems to be an issue with react-aria-components,
see https://github.com/adobe/react-spectrum/issues/7563.
Can probably be fixed by rewriting to a solution similar to
https://react-spectrum.adobe.com/react-aria/examples/framer-modal-sheet.html

* Remove unstable cache implementation and use in memory cache locally

* Fix ref type in SelectFilter

* Use cloneElement to add key prop to element


Approved-by: Linus Flood

apps/scandic-web/app/[lang]/(live)/(protected)/logout/route.ts

@@ -10,7 +10,7 @@ import { signOut } from "@/auth"
 
 export async function GET(
   request: NextRequest,
-  context: { params: { lang: Lang } }
+  context: { params: Promise<{ lang: Lang }> }
 ) {
   const publicURL = getPublicURL(request)
 
@@ -49,7 +49,8 @@ export async function GET(
     try {
       // Initiate the seamless logout flow
       let redirectUrlValue
-      switch (context.params.lang) {
+      const params = await context.params
+      switch (params.lang) {
         case Lang.da:
           redirectUrlValue = env.SEAMLESS_LOGOUT_DA
           break

apps/scandic-web/app/[lang]/(live)/(protected)/my-pages/[...path]/page.tsx

@@ -14,7 +14,8 @@ export { generateMetadata } from "@/utils/generateMetadata"
 export default async function MyPages({}: PageArgs<
   LangParams & { path: string[] }
 >) {
-  const accountPageRes = await serverClient().contentstack.accountPage.get()
+  const caller = await serverClient()
+  const accountPageRes = await caller.contentstack.accountPage.get()
   const intl = await getIntl()
 
   if (!accountPageRes) {

apps/scandic-web/app/[lang]/(live)/(protected)/my-pages/profile/edit/page.tsx

@@ -7,7 +7,8 @@ import TrackingSDK from "@/components/TrackingSDK"
 import styles from "./page.module.css"
 
 export default async function EditProfileSlot() {
-  const accountPage = await serverClient().contentstack.accountPage.get()
+  const caller = await serverClient()
+  const accountPage = await caller.contentstack.accountPage.get()
   const user = await getProfile()
 
   if (!user || "error" in user) {

apps/scandic-web/app/[lang]/(live)/(protected)/my-pages/profile/page.tsx

@@ -8,7 +8,8 @@ import type { LangParams, PageArgs } from "@/types/params"
 export { generateMetadata } from "@/utils/generateMetadata"
 
 export default async function ProfilePage({}: PageArgs<LangParams>) {
-  const accountPage = await serverClient().contentstack.accountPage.get()
+  const caller = await serverClient()
+  const accountPage = await caller.contentstack.accountPage.get()
 
   return (
     <>

apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@preview/page.tsx

@@ -4,10 +4,11 @@ import InitLivePreview from "@/components/LivePreview"
 
 import type { PageArgs, UIDParams } from "@/types/params"
 
-export default function PreviewPage({
-  searchParams,
-  params,
-}: PageArgs<UIDParams, URLSearchParams>) {
+export default async function PreviewPage(
+  props: PageArgs<UIDParams, URLSearchParams>
+) {
+  const params = await props.params
+  const searchParams = await props.searchParams
   const shouldInitializePreview = searchParams.isPreview === "true"
 
   if (searchParams.live_preview) {

apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/content_page/[uid]/page.tsx

@@ -12,8 +12,9 @@ import { isLoggedInUser } from "@/utils/isLoggedInUser"
 export { generateMetadata } from "@/utils/generateMetadata"
 
 export default async function ContentPagePage() {
-  const lang = getLang()
-  const pathname = headers().get("x-pathname") || ""
+  const lang = await getLang()
+  const headersList = await headers()
+  const pathname = headersList.get("x-pathname") || ""
   const isSignupRoute = isSignupPage(pathname)
 
   if (isSignupRoute) {

apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/destination_city_page/[uid]/page.tsx

@@ -10,9 +10,10 @@ import type { PageArgs } from "@/types/params"
 
 export { generateMetadata } from "@/utils/generateMetadata"
 
-export default function DestinationCityPagePage({
-  searchParams,
-}: PageArgs<{}, { view?: "map" }>) {
+export default async function DestinationCityPagePage(
+  props: PageArgs<{}, { view?: "map" }>
+) {
+  const searchParams = await props.searchParams
   if (env.NEW_SITE_LIVE_STATUS === "NOT_LIVE") {
     return notFound()
   }

apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/hotel_page/[uid]/page.tsx

@@ -11,9 +11,10 @@ import type { PageArgs } from "@/types/params"
 
 export { generateMetadata } from "@/utils/generateMetadata"
 
-export default async function HotelPagePage({
-  searchParams,
-}: PageArgs<{}, { subpage?: string; view?: "map" }>) {
+export default async function HotelPagePage(
+  props: PageArgs<{}, { subpage?: string; view?: "map" }>
+) {
+  const searchParams = await props.searchParams
   if (env.NEW_SITE_LIVE_STATUS === "NOT_LIVE") {
     return notFound()
   }

apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/start_page/[uid]/page.tsx

@@ -9,9 +9,10 @@ import type { PageArgs } from "@/types/params"
 
 export { generateMetadata } from "@/utils/generateMetadata"
 
-export default function StartPagePage({
-  searchParams,
-}: PageArgs<{}, BookingWidgetSearchData>) {
+export default async function StartPagePage(
+  props: PageArgs<{}, BookingWidgetSearchData>
+) {
+  const searchParams = await props.searchParams
   if (env.NEW_SITE_LIVE_STATUS === "NOT_LIVE") {
     return notFound()
   }

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(confirmation)/booking-confirmation/page.tsx

@@ -9,22 +9,19 @@ import { decrypt } from "@/utils/encryption"
 
 import type { LangParams, PageArgs } from "@/types/params"
 
-export default async function BookingConfirmationPage({
-  params,
-  searchParams,
-}: PageArgs<
-  LangParams,
-  {
-    RefId?: string
-  }
->) {
+export default async function BookingConfirmationPage(
+  props: PageArgs<LangParams, { RefId?: string }>
+) {
+  const searchParams = await props.searchParams
+  const params = await props.params
   const refId = searchParams.RefId
 
   if (!refId) {
     notFound()
   }
 
-  const sig = cookies().get("bcsig")?.value
+  const cookieStore = await cookies()
+  const sig = cookieStore.get("bcsig")?.value
 
   if (!sig) {
     redirect(`/${params.lang}`)

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/gla-payment-callback/page.tsx

@@ -13,18 +13,19 @@ import LoadingSpinner from "@/components/LoadingSpinner"
 
 import type { LangParams, PageArgs } from "@/types/params"
 
-export default async function GuaranteePaymentCallbackPage({
-  params,
-  searchParams,
-}: PageArgs<
-  LangParams,
-  {
-    status?: PaymentCallbackStatusEnum
-    RefId?: string
-    confirmationNumber?: string
-    ancillary?: string
-  }
->) {
+export default async function GuaranteePaymentCallbackPage(
+  props: PageArgs<
+    LangParams,
+    {
+      status?: PaymentCallbackStatusEnum
+      RefId?: string
+      confirmationNumber?: string
+      ancillary?: string
+    }
+  >
+) {
+  const searchParams = await props.searchParams
+  const params = await props.params
   console.log(`[gla-payment-callback] callback started`)
   const lang = params.lang
   const status = searchParams.status
@@ -57,7 +58,8 @@ export default async function GuaranteePaymentCallbackPage({
 
   if (refId) {
     try {
-      const bookingStatus = await serverClient().booking.status({
+      const caller = await serverClient()
+      const bookingStatus = await caller.booking.status({
         refId,
       })
 

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/page.tsx

@@ -20,17 +20,18 @@ import { isValidSession } from "@/utils/session"
 
 import type { LangParams, PageArgs } from "@/types/params"
 
-export default async function PaymentCallbackPage({
-  params,
-  searchParams,
-}: PageArgs<
-  LangParams,
-  {
-    status?: PaymentCallbackStatusEnum
-    confirmationNumber?: string
-    hotel?: string
-  }
->) {
+export default async function PaymentCallbackPage(
+  props: PageArgs<
+    LangParams,
+    {
+      status?: PaymentCallbackStatusEnum
+      confirmationNumber?: string
+      hotel?: string
+    }
+  >
+) {
+  const searchParams = await props.searchParams
+  const params = await props.params
   console.log(`[payment-callback] callback started`)
   const lang = params.lang
   const status = searchParams.status
@@ -87,7 +88,8 @@ export default async function PaymentCallbackPage({
 
   if (refId) {
     try {
-      const bookingStatus = await serverClient().booking.status({
+      const caller = await serverClient()
+      const bookingStatus = await caller.booking.status({
         refId,
       })
 

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(standard)/alternative-hotels/map/page.tsx

@@ -3,15 +3,21 @@ import { Suspense } from "react"
 import { SelectHotelMapContainer } from "@/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContainer"
 import { SelectHotelMapContainerSkeleton } from "@/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContainerSkeleton"
 import { MapContainer } from "@/components/MapContainer"
+import { convertSearchParamsToObj } from "@/utils/url"
 
 import styles from "./page.module.css"
 
 import type { AlternativeHotelsSearchParams } from "@/types/components/hotelReservation/selectHotel/selectHotelSearchParams"
 import type { LangParams, PageArgs } from "@/types/params"
 
-export default async function SelectHotelMapPage({
-  searchParams,
-}: PageArgs<LangParams, AlternativeHotelsSearchParams>) {
+export default async function SelectHotelMapPage(
+  props: PageArgs<LangParams, AlternativeHotelsSearchParams>
+) {
+  const searchParams = await props.searchParams
+
+  const booking =
+    convertSearchParamsToObj<AlternativeHotelsSearchParams>(searchParams)
+
   return (
     <div className={styles.main}>
       <MapContainer>
@@ -19,10 +25,7 @@ export default async function SelectHotelMapPage({
           key={searchParams.hotel}
           fallback={<SelectHotelMapContainerSkeleton />}
         >
-          <SelectHotelMapContainer
-            searchParams={searchParams}
-            isAlternativeHotels
-          />
+          <SelectHotelMapContainer booking={booking} isAlternativeHotels />
         </Suspense>
       </MapContainer>
     </div>

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(standard)/alternative-hotels/page.tsx

@@ -12,21 +12,26 @@ import { getHotels } from "@/components/HotelReservation/SelectHotel/helpers"
 import { getTracking } from "@/components/HotelReservation/SelectHotel/tracking"
 import TrackingSDK from "@/components/TrackingSDK"
 import { getIntl } from "@/i18n"
-import { setLang } from "@/i18n/serverContext"
 import { getHotelSearchDetails } from "@/utils/hotelSearchDetails"
+import { convertSearchParamsToObj } from "@/utils/url"
 
 import type {
   AlternativeHotelsSearchParams,
   SelectHotelSearchParams,
 } from "@/types/components/hotelReservation/selectHotel/selectHotelSearchParams"
+import { SelectRateSearchParams } from "@/types/components/hotelReservation/selectRate/selectRate"
 import type { LangParams, PageArgs } from "@/types/params"
 
-export default async function AlternativeHotelsPage({
-  params,
-  searchParams,
-}: PageArgs<LangParams, AlternativeHotelsSearchParams>) {
-  setLang(params.lang)
-  const searchDetails = await getHotelSearchDetails({ searchParams }, true)
+export default async function AlternativeHotelsPage(
+  props: PageArgs<LangParams, AlternativeHotelsSearchParams>
+) {
+  const searchParams = await props.searchParams
+  const params = await props.params
+
+  const booking =
+    convertSearchParamsToObj<AlternativeHotelsSearchParams>(searchParams)
+
+  const searchDetails = await getHotelSearchDetails(booking, true)
 
   if (!searchDetails || !searchDetails.hotel || !searchDetails.city) {
     return notFound()
@@ -44,7 +49,7 @@ export default async function AlternativeHotelsPage({
   } = searchDetails
 
   if (bookingCode && FamilyAndFriendsCodes.includes(bookingCode)) {
-    const cookieStore = cookies()
+    const cookieStore = await cookies()
     const isInvalidFNF = cookieStore.get("sc")?.value !== "1"
 
     if (isInvalidFNF) {
@@ -55,7 +60,7 @@ export default async function AlternativeHotelsPage({
   // TODO: This needs to be refactored into its
   // own functions
   const hotels = await getHotels(
-    selectHotelParams as SelectHotelSearchParams,
+    selectHotelParams,
     isAlternativeFor,
     bookingCode,
     city,

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(standard)/details/page.tsx

@@ -27,10 +27,14 @@ import styles from "./page.module.css"
 import type { SelectRateSearchParams } from "@/types/components/hotelReservation/selectRate/selectRate"
 import type { LangParams, PageArgs } from "@/types/params"
 
-export default async function DetailsPage({
-  params: { lang },
-  searchParams,
-}: PageArgs<LangParams, SelectRateSearchParams>) {
+export default async function DetailsPage(
+  props: PageArgs<LangParams, SelectRateSearchParams>
+) {
+  const searchParams = await props.searchParams
+  const params = await props.params
+
+  const { lang } = params
+
   const selectRoomParams = new URLSearchParams(searchParams)
 
   const { errorCode, ...booking } =
@@ -44,7 +48,7 @@ export default async function DetailsPage({
     booking.bookingCode &&
     FamilyAndFriendsCodes.includes(booking.bookingCode)
   ) {
-    const cookieStore = cookies()
+    const cookieStore = await cookies()
     const isInValidFNF = cookieStore.get("sc")?.value !== "1"
 
     if (isInValidFNF) {

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(standard)/page.tsx

@@ -8,7 +8,11 @@ import {
 } from "@/types/components/tracking"
 import type { LangParams, PageArgs } from "@/types/params"
 
-export default function HotelReservationPage({ params }: PageArgs<LangParams>) {
+export default async function HotelReservationPage(
+  props: PageArgs<LangParams>
+) {
+  const params = await props.params
+
   const pageTrackingData: TrackingSDKPageData = {
     pageId: "hotelreservation",
     domainLanguage: params.lang,

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(standard)/select-hotel/map/page.tsx

@@ -4,17 +4,22 @@ import { Suspense } from "react"
 import { SelectHotelMapContainer } from "@/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContainer"
 import { SelectHotelMapContainerSkeleton } from "@/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContainerSkeleton"
 import { MapContainer } from "@/components/MapContainer"
+import { convertSearchParamsToObj } from "@/utils/url"
 
 import styles from "./page.module.css"
 
 import type { SelectHotelSearchParams } from "@/types/components/hotelReservation/selectHotel/selectHotelSearchParams"
 import type { LangParams, PageArgs } from "@/types/params"
 
-export default async function SelectHotelMapPage({
-  searchParams,
-}: PageArgs<LangParams, SelectHotelSearchParams>) {
+export default async function SelectHotelMapPage(
+  props: PageArgs<LangParams, SelectHotelSearchParams>
+) {
+  const searchParams = await props.searchParams
   const suspenseKey = stringify(searchParams)
 
+  const booking =
+    convertSearchParamsToObj<SelectHotelSearchParams>(searchParams)
+
   return (
     <div className={styles.main}>
       <MapContainer>
@@ -22,7 +27,7 @@ export default async function SelectHotelMapPage({
           key={suspenseKey}
           fallback={<SelectHotelMapContainerSkeleton />}
         >
-          <SelectHotelMapContainer searchParams={searchParams} />
+          <SelectHotelMapContainer booking={booking} />
         </Suspense>
       </MapContainer>
     </div>

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(standard)/select-hotel/page.tsx

@@ -11,18 +11,22 @@ import SelectHotel from "@/components/HotelReservation/SelectHotel"
 import { getHotels } from "@/components/HotelReservation/SelectHotel/helpers"
 import { getTracking } from "@/components/HotelReservation/SelectHotel/tracking"
 import TrackingSDK from "@/components/TrackingSDK"
-import { setLang } from "@/i18n/serverContext"
 import { getHotelSearchDetails } from "@/utils/hotelSearchDetails"
+import { convertSearchParamsToObj } from "@/utils/url"
 
 import type { SelectHotelSearchParams } from "@/types/components/hotelReservation/selectHotel/selectHotelSearchParams"
 import type { LangParams, PageArgs } from "@/types/params"
 
-export default async function SelectHotelPage({
-  params,
-  searchParams,
-}: PageArgs<LangParams, SelectHotelSearchParams>) {
-  setLang(params.lang)
-  const searchDetails = await getHotelSearchDetails({ searchParams })
+export default async function SelectHotelPage(
+  props: PageArgs<LangParams, SelectHotelSearchParams>
+) {
+  const searchParams = await props.searchParams
+  const params = await props.params
+
+  const booking =
+    convertSearchParamsToObj<SelectHotelSearchParams>(searchParams)
+
+  const searchDetails = await getHotelSearchDetails(booking)
 
   if (!searchDetails || !searchDetails.city) return notFound()
 
@@ -37,7 +41,7 @@ export default async function SelectHotelPage({
   } = searchDetails
 
   if (bookingCode && FamilyAndFriendsCodes.includes(bookingCode)) {
-    const cookieStore = cookies()
+    const cookieStore = await cookies()
     const isInvalidFNF = cookieStore.get("sc")?.value !== "1"
 
     if (isInvalidFNF) {

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

@@ -13,10 +13,11 @@ const singleRoomRateTypes = combineRegExps(
   "i"
 )
 
-export default async function SelectRatePage({
-  params,
-  searchParams,
-}: PageArgs<LangParams & { section: string }, SelectRateSearchParams>) {
+export default async function SelectRatePage(
+  props: PageArgs<LangParams & { section: string }, SelectRateSearchParams>
+) {
+  const params = await props.params
+  const searchParams = await props.searchParams
   const booking = convertSearchParamsToObj<SelectRateSearchParams>(searchParams)
 
   const isMultiRoom = booking.rooms.length > 1
@@ -35,5 +36,5 @@ export default async function SelectRatePage({
     delete searchParams.bookingCode
   }
 
-  return <SelectRate params={params} searchParams={searchParams} />
+  return <SelectRate lang={params.lang} booking={booking} />
 }

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/layout.tsx

@@ -2,7 +2,8 @@ import { env } from "@/env/server"
 
 import type { LangParams, PageArgs } from "@/types/params"
 
-export async function generateMetadata({ params }: PageArgs<LangParams>) {
+export async function generateMetadata(props: PageArgs<LangParams>) {
+  const params = await props.params;
   return {
     robots: {
       index: env.isLangLive(params.lang),

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/my-stay/page.tsx

@@ -47,10 +47,11 @@ import type { LangParams, PageArgs } from "@/types/params"
 import type { BookingConfirmation } from "@/types/trpc/routers/booking/confirmation"
 import type { SafeUser } from "@/types/user"
 
-export default async function MyStay({
-  params,
-  searchParams,
-}: PageArgs<LangParams, { RefId?: string }>) {
+export default async function MyStay(
+  props: PageArgs<LangParams, { RefId?: string }>
+) {
+  const searchParams = await props.searchParams
+  const params = await props.params
   setLang(params.lang)
   const refId = searchParams.RefId
 
@@ -65,7 +66,8 @@ export default async function MyStay({
 
   const isLoggedIn = await isLoggedInUser()
 
-  const bv = cookies().get("bv")?.value
+  const cookieStore = await cookies()
+  const bv = cookieStore.get("bv")?.value
   let bookingConfirmation
   if (isLoggedIn) {
     bookingConfirmation = await getBookingConfirmation(refId)

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/my-stay/tracking.tsx

@@ -6,8 +6,8 @@ import {
   type TrackingSDKPageData,
 } from "@/types/components/tracking"
 
-export default function Tracking() {
-  const lang = getLang()
+export default async function Tracking() {
+  const lang = await getLang()
 
   const pageTrackingData: TrackingSDKPageData = {
     channel: TrackingChannelEnum.hotels,

apps/scandic-web/app/[lang]/(live)/(public)/login/route.ts

@@ -10,8 +10,9 @@ import { signIn } from "@/auth"
 
 export async function GET(
   request: NextRequest,
-  context: { params: { lang: Lang } }
+  context: { params: Promise<{ lang: Lang }> }
 ) {
+  const contextParams = await context.params
   const publicURL = getPublicURL(request)
 
   let redirectHeaders: Headers | undefined = undefined
@@ -67,7 +68,7 @@ export async function GET(
     try {
       // Initiate the seamless login flow
       let redirectUrlValue
-      switch (context.params.lang) {
+      switch (contextParams.lang) {
         case Lang.da:
           redirectUrlValue = env.SEAMLESS_LOGIN_DA
           break
@@ -115,7 +116,7 @@ export async function GET(
 
     /** Record<string, any> is next-auth typings */
     const params: Record<string, any> = {
-      ui_locales: context.params.lang,
+      ui_locales: contextParams.lang,
       scope: [
         "openid",
         "profile",

apps/scandic-web/app/[lang]/(live)/(public)/verifymagiclink/route.ts

@@ -10,7 +10,7 @@ import type { Lang } from "@/constants/languages"
 
 export async function GET(
   request: NextRequest,
-  context: { params: { lang: Lang } }
+  context: { params: Promise<{ lang: Lang }> }
 ) {
   const publicURL = getPublicURL(request)
 
@@ -52,6 +52,7 @@ export async function GET(
   try {
     console.log(`[verifymagiclink] final redirectUrl: ${redirectTo}`)
 
+    const params = await context.params
     /**
      * Passing `redirect: false` to `signIn` will return the URL instead of
      * automatically redirecting to it inside of `signIn`.
@@ -64,7 +65,7 @@ export async function GET(
         redirect: false,
       },
       {
-        ui_locales: context.params.lang,
+        ui_locales: params.lang,
         scope: [
           "openid",
           "profile",

apps/scandic-web/app/[lang]/(live)/@bookingwidget/(contentTypes)/destination_city_page/[uid]/page.tsx

@@ -6,9 +6,8 @@ import { BookingWidget } from "@/components/BookingWidget"
 import type { BookingWidgetSearchData } from "@/types/components/bookingWidget"
 import type { PageArgs } from "@/types/params"
 
-export default async function BookingWidgetDestinationCityPage({
-  searchParams,
-}: PageArgs<{}, BookingWidgetSearchData>) {
+export default async function BookingWidgetDestinationCityPage(props: PageArgs<{}, BookingWidgetSearchData>) {
+  const searchParams = await props.searchParams;
   if (env.NEW_SITE_LIVE_STATUS === "NOT_LIVE") {
     return null
   }

apps/scandic-web/app/[lang]/(live)/@bookingwidget/(contentTypes)/hotel_page/[uid]/page.tsx

@@ -7,9 +7,10 @@ import { getLang } from "@/i18n/serverContext"
 import type { BookingWidgetSearchData } from "@/types/components/bookingWidget"
 import type { PageArgs } from "@/types/params"
 
-export default async function BookingWidgetHotelPage({
-  searchParams,
-}: PageArgs<{}, BookingWidgetSearchData & { subpage?: string }>) {
+export default async function BookingWidgetHotelPage(
+  props: PageArgs<{}, BookingWidgetSearchData & { subpage?: string }>
+) {
+  const searchParams = await props.searchParams
   if (env.NEW_SITE_LIVE_STATUS === "NOT_LIVE") {
     return null
   }
@@ -19,7 +20,7 @@ export default async function BookingWidgetHotelPage({
   const hotelPageData = await getHotelPage()
   const hotelData = await getHotel({
     hotelId: hotelPageData?.hotel_page_id || "",
-    language: getLang(),
+    language: await getLang(),
     isCardOnlyPayment: false,
   })
 

apps/scandic-web/app/[lang]/(live)/@bookingwidget/hotelreservation/page.tsx

@@ -3,8 +3,10 @@ import { BookingWidget } from "@/components/BookingWidget"
 import type { BookingWidgetSearchData } from "@/types/components/bookingWidget"
 import type { LangParams, PageArgs } from "@/types/params"
 
-export default async function BookingWidgetPage({
-  searchParams,
-}: PageArgs<LangParams, BookingWidgetSearchData>) {
+export default async function BookingWidgetPage(
+  props: PageArgs<LangParams, BookingWidgetSearchData>
+) {
+  const searchParams = await props.searchParams
+
   return <BookingWidget bookingWidgetSearchParams={searchParams} />
 }

apps/scandic-web/app/[lang]/(live)/@bookingwidget/page.tsx

@@ -5,10 +5,9 @@ import { BookingWidget } from "@/components/BookingWidget"
 import type { BookingWidgetSearchData } from "@/types/components/bookingWidget"
 import type { LangParams, PageArgs } from "@/types/params"
 
-export default async function BookingWidgetPage({
-  searchParams,
-  params,
-}: PageArgs<LangParams, BookingWidgetSearchData>) {
+export default async function BookingWidgetPage(props: PageArgs<LangParams, BookingWidgetSearchData>) {
+  const params = await props.params;
+  const searchParams = await props.searchParams;
   if (!env.isLangLive(params.lang)) {
     return null
   }

apps/scandic-web/app/[lang]/(live)/error.tsx

@@ -24,7 +24,7 @@ export default function Error({
   const params = useParams<LangParams>()
   const router = useRouter()
   const searchParams = useSearchParams()
-  const currentSearchParamsRef = useRef<string>()
+  const currentSearchParamsRef = useRef<string>(undefined)
   const isFirstLoadRef = useRef<boolean>(true)
 
   useEffect(() => {

apps/scandic-web/app/[lang]/(live)/layout.tsx

@@ -27,15 +27,20 @@ import { setLang } from "@/i18n/serverContext"
 
 import type { LangParams, LayoutArgs } from "@/types/params"
 
-export default async function RootLayout({
-  bookingwidget,
-  children,
-  params,
-}: React.PropsWithChildren<
-  LayoutArgs<LangParams> & {
-    bookingwidget: React.ReactNode
-  }
->) {
+export default async function RootLayout(
+  props: React.PropsWithChildren<
+    LayoutArgs<LangParams> & {
+      bookingwidget: React.ReactNode
+    }
+  >
+) {
+  const params = await props.params;
+
+  const {
+    bookingwidget,
+    children
+  } = props;
+
   setLang(params.lang)
   const messages = await getMessages(params.lang)
 

apps/scandic-web/app/[lang]/(live)/middleware-error/[status]/page.tsx

@@ -2,13 +2,11 @@ import styles from "./page.module.css"
 
 import type { LangParams, LayoutArgs, StatusParams } from "@/types/params"
 
-export default async function MiddlewareError({
-  params,
-}: LayoutArgs<LangParams & StatusParams>) {
+export default async function MiddlewareError(props: LayoutArgs<LangParams & StatusParams>) {
+  const params = await props.params;
   return (
     // eslint-disable-next-line formatjs/no-literal-string-in-jsx
-    <div className={styles.layout}>
-      Middleware error {params.lang} {params.status}
+    <div className={styles.layout}>Middleware error {params.lang} {params.status}
     </div>
-  )
+  );
 }