Merged in fix/SW-2051-add-correct-links-to-cards (pull request #2013)

fix(SW-2051): add correct url to promocards on confirmation page

* fix(SW-2051): add correct url to promocards on confirmation page


Approved-by: Christian Andolf
This commit is contained in:
Bianca Widstam
2025-05-08 14:03:16 +00:00
parent c5d4895b6d
commit 8d864df5b3
3 changed files with 21 additions and 23 deletions

View File

@@ -1,9 +1,8 @@
"use client" "use client"
import { useEffect } from "react"
import { useIntl } from "react-intl" import { useIntl } from "react-intl"
import { homeHrefs } from "@/constants/homeHrefs" import { myStay } from "@/constants/routes/myStay"
import { myBooking } from "@/constants/myBooking"
import { env } from "@/env/client"
import useLang from "@/hooks/useLang" import useLang from "@/hooks/useLang"
@@ -13,22 +12,30 @@ import styles from "./promos.module.css"
import type { PromosProps } from "@/types/components/hotelReservation/bookingConfirmation/promos" import type { PromosProps } from "@/types/components/hotelReservation/bookingConfirmation/promos"
export default function Promos({ export default function Promos({ booking }: PromosProps) {
confirmationNumber,
hotelId,
lastName,
}: PromosProps) {
const intl = useIntl() const intl = useIntl()
const lang = useLang() const lang = useLang()
const homeUrl = homeHrefs[env.NEXT_PUBLIC_NODE_ENV][lang] const { refId, confirmationNumber, hotelId } = booking
const myBookingUrl = myBooking[env.NEXT_PUBLIC_NODE_ENV][lang] const { email, firstName, lastName } = booking.guest
useEffect(() => {
// Setting the `bv` cookie allows direct access to My stay without prompting for more information.
const value = new URLSearchParams({
email,
firstName,
lastName,
confirmationNumber,
}).toString()
document.cookie = `bv=${encodeURIComponent(value)}; Path=/; Max-Age=600; Secure; SameSite=Strict`
}, [confirmationNumber, email, firstName, lastName])
const myStayURL = `${myStay[lang]}?RefId=${encodeURIComponent(refId)}`
return ( return (
<div className={styles.promos}> <div className={styles.promos}>
<Promo <Promo
buttonText={intl.formatMessage({ buttonText={intl.formatMessage({
defaultMessage: "View and buy add-ons", defaultMessage: "View and buy add-ons",
})} })}
href={`${myBookingUrl}?bookingId=${confirmationNumber}&lastName=${lastName}`} href={myStayURL}
text={intl.formatMessage({ text={intl.formatMessage({
defaultMessage: defaultMessage:
"Discover the little extra touches to make your upcoming stay even more unforgettable.", "Discover the little extra touches to make your upcoming stay even more unforgettable.",
@@ -41,7 +48,7 @@ export default function Promos({
buttonText={intl.formatMessage({ buttonText={intl.formatMessage({
defaultMessage: "Book another stay", defaultMessage: "Book another stay",
})} })}
href={`${homeUrl}?hotel=${hotelId}`} href={`/${lang}?hotel=${hotelId}`}
text={intl.formatMessage({ text={intl.formatMessage({
defaultMessage: defaultMessage:
"Get inspired and start dreaming beyond your next trip. Explore more Scandic destinations.", "Get inspired and start dreaming beyond your next trip. Explore more Scandic destinations.",

View File

@@ -85,11 +85,7 @@ export default async function BookingConfirmation({
/> />
</div> </div>
))} ))}
<Promos <Promos booking={booking} />
confirmationNumber={booking.confirmationNumber}
hotelId={hotel.operaId}
lastName={booking.guest.lastName}
/>
<div className={styles.mobileReceipt}> <div className={styles.mobileReceipt}>
<Receipt /> <Receipt />
</div> </div>

View File

@@ -1,8 +1,3 @@
import type { BookingConfirmation } from "@/types/trpc/routers/booking/confirmation" import type { BookingConfirmation } from "@/types/trpc/routers/booking/confirmation"
export interface PromosProps export interface PromosProps extends Pick<BookingConfirmation, "booking"> {}
extends Pick<
BookingConfirmation["booking"],
"confirmationNumber" | "hotelId"
>,
Pick<BookingConfirmation["booking"]["guest"], "lastName"> {}