diff --git a/apps/scandic-web/components/HotelReservation/MyStay/Modal/Button/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/Modal/Button/index.tsx index 2febd8701..09e16c3dd 100644 --- a/apps/scandic-web/components/HotelReservation/MyStay/Modal/Button/index.tsx +++ b/apps/scandic-web/components/HotelReservation/MyStay/Modal/Button/index.tsx @@ -12,15 +12,21 @@ import styles from "./button.module.css" interface ButtonProps extends React.PropsWithChildren { icon: MaterialIconProps["icon"] isDisabled?: boolean + onClick?: () => void } export default function Button({ children, icon, isDisabled = false, + onClick = () => {}, }: ButtonProps) { return ( - + {children} diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CancelStay/Steps/FinalConfirmation/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CancelStay/Steps/FinalConfirmation/index.tsx index 3f8197023..38ed77b3d 100644 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CancelStay/Steps/FinalConfirmation/index.tsx +++ b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CancelStay/Steps/FinalConfirmation/index.tsx @@ -10,6 +10,7 @@ import { useMyStayStore } from "@/stores/my-stay" import Modal from "@/components/HotelReservation/MyStay/Modal" import { toast } from "@/components/TempDesignSystem/Toasts" import useLang from "@/hooks/useLang" +import { trackCancelStay } from "@/utils/tracking" import CancelStayPriceContainer from "../CancelStayPriceContainer" @@ -42,6 +43,11 @@ export default function FinalConfirmation({ const cancelBookingsMutation = trpc.booking.cancel.useMutation({ onSuccess(data, variables) { + for (const confirmationNumber of data) { + if (confirmationNumber) { + trackCancelStay(bookedRoom.hotelId, confirmationNumber) + } + } const allCancellationsWentThrough = data.every((cancelled) => cancelled) if (allCancellationsWentThrough) { if (data.length === rooms.length) { diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CancelStay/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CancelStay/index.tsx index 697944dd9..28ac3d9ff 100644 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CancelStay/index.tsx +++ b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CancelStay/index.tsx @@ -3,6 +3,7 @@ import { Dialog, DialogTrigger } from "react-aria-components" import { useIntl } from "react-intl" import Modal from "@/components/HotelReservation/MyStay/Modal" +import { trackMyStayPageLink } from "@/utils/tracking" import Alerts from "./Alerts" import Steps from "./Steps" @@ -11,9 +12,14 @@ import styles from "./cancelStay.module.css" export default function CancelStay() { const intl = useIntl() + + function trackCancelStay() { + trackMyStayPageLink("cancel booking") + } + return ( - + {intl.formatMessage({ defaultMessage: "Cancel stay" })} diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/ChangeDates/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/ChangeDates/index.tsx index 6a66d954d..ab82e2528 100644 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/ChangeDates/index.tsx +++ b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/ChangeDates/index.tsx @@ -5,6 +5,7 @@ import { useIntl } from "react-intl" import { useMyStayStore } from "@/stores/my-stay" import Modal from "@/components/HotelReservation/MyStay/Modal" +import { trackMyStayPageLink } from "@/utils/tracking" import { dateHasPassed } from "../utils" import Alerts from "./Alerts" @@ -29,10 +30,18 @@ export default function ChangeDates() { !isRewardNight && dateHasPassed(checkInDate, checkInTime) + function trackChangeDates() { + trackMyStayPageLink("modify dates") + } + const text = intl.formatMessage({ defaultMessage: "Change dates" }) return ( - + {text} diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CustomerSupport/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CustomerSupport/index.tsx index c5a11af1f..f395a614b 100644 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CustomerSupport/index.tsx +++ b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CustomerSupport/index.tsx @@ -4,12 +4,18 @@ import { useIntl } from "react-intl" import Modal from "@/components/HotelReservation/MyStay/Modal" import CustomerSupportModal from "@/components/HotelReservation/MyStay/ReferenceCard/Actions/CustomerSupportModal" +import { trackMyStayPageLink } from "@/utils/tracking" export default function CustomerSupport() { const intl = useIntl() + + function trackCustomerSupport() { + trackMyStayPageLink("customer service") + } + return ( - + {intl.formatMessage({ defaultMessage: "Customer support" })} diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/GuaranteeLateArrival/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/GuaranteeLateArrival/index.tsx index 1c9aa33b1..9867e000c 100644 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/GuaranteeLateArrival/index.tsx +++ b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/GuaranteeLateArrival/index.tsx @@ -7,6 +7,7 @@ import { Typography } from "@scandic-hotels/design-system/Typography" import { useMyStayStore } from "@/stores/my-stay" import Modal from "@/components/HotelReservation/MyStay/Modal" +import { trackMyStayPageLink } from "@/utils/tracking" import { dateHasPassed } from "../utils" import Form from "./Form" @@ -37,6 +38,10 @@ export default function GuaranteeLateArrival() { return null } + function trackGuaranteeLateArrival() { + trackMyStayPageLink("guarantee late arrival") + } + const arriveLateMsg = intl.formatMessage({ defaultMessage: "Planning to arrive after 18.00? Secure your room by guaranteeing it with a credit card. Without the guarantee and in case of no-show, the room might be reallocated after 18:00.", @@ -47,7 +52,9 @@ export default function GuaranteeLateArrival() { return ( - {text} + + {text} + {({ close }) => ( diff --git a/apps/scandic-web/server/routers/booking/mutation.ts b/apps/scandic-web/server/routers/booking/mutation.ts index c53f302dd..376cd828f 100644 --- a/apps/scandic-web/server/routers/booking/mutation.ts +++ b/apps/scandic-web/server/routers/booking/mutation.ts @@ -163,11 +163,11 @@ export const bookingMutationRouter = router({ ) ) - const cancelledRoomsSuccessfully = [] + const cancelledRoomsSuccessfully: (string | null)[] = [] for (const [idx, response] of responses.entries()) { if (response.status === "fulfilled") { if (response.value) { - cancelledRoomsSuccessfully.push(true) + cancelledRoomsSuccessfully.push(confirmationNumbers[idx]) continue } } else { @@ -177,7 +177,7 @@ export const bookingMutationRouter = router({ console.error(response.reason) } - cancelledRoomsSuccessfully.push(false) + cancelledRoomsSuccessfully.push(null) } return cancelledRoomsSuccessfully