fix: re-add tracking my-stay
This commit is contained in:
committed by
Simon.Emanuelsson
parent
41acf6ee52
commit
2adb0e92eb
@@ -12,15 +12,21 @@ import styles from "./button.module.css"
|
|||||||
interface ButtonProps extends React.PropsWithChildren {
|
interface ButtonProps extends React.PropsWithChildren {
|
||||||
icon: MaterialIconProps["icon"]
|
icon: MaterialIconProps["icon"]
|
||||||
isDisabled?: boolean
|
isDisabled?: boolean
|
||||||
|
onClick?: () => void
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function Button({
|
export default function Button({
|
||||||
children,
|
children,
|
||||||
icon,
|
icon,
|
||||||
isDisabled = false,
|
isDisabled = false,
|
||||||
|
onClick = () => {},
|
||||||
}: ButtonProps) {
|
}: ButtonProps) {
|
||||||
return (
|
return (
|
||||||
<ButtonRAC className={styles.button} isDisabled={isDisabled}>
|
<ButtonRAC
|
||||||
|
className={styles.button}
|
||||||
|
isDisabled={isDisabled}
|
||||||
|
onPress={onClick}
|
||||||
|
>
|
||||||
<MaterialIcon color="Icon/Interactive/Default" icon={icon} />
|
<MaterialIcon color="Icon/Interactive/Default" icon={icon} />
|
||||||
<Typography variant="Body/Paragraph/mdBold">
|
<Typography variant="Body/Paragraph/mdBold">
|
||||||
<span className={styles.text}>{children}</span>
|
<span className={styles.text}>{children}</span>
|
||||||
|
|||||||
@@ -10,6 +10,7 @@ import { useMyStayStore } from "@/stores/my-stay"
|
|||||||
import Modal from "@/components/HotelReservation/MyStay/Modal"
|
import Modal from "@/components/HotelReservation/MyStay/Modal"
|
||||||
import { toast } from "@/components/TempDesignSystem/Toasts"
|
import { toast } from "@/components/TempDesignSystem/Toasts"
|
||||||
import useLang from "@/hooks/useLang"
|
import useLang from "@/hooks/useLang"
|
||||||
|
import { trackCancelStay } from "@/utils/tracking"
|
||||||
|
|
||||||
import CancelStayPriceContainer from "../CancelStayPriceContainer"
|
import CancelStayPriceContainer from "../CancelStayPriceContainer"
|
||||||
|
|
||||||
@@ -42,6 +43,11 @@ export default function FinalConfirmation({
|
|||||||
|
|
||||||
const cancelBookingsMutation = trpc.booking.cancel.useMutation({
|
const cancelBookingsMutation = trpc.booking.cancel.useMutation({
|
||||||
onSuccess(data, variables) {
|
onSuccess(data, variables) {
|
||||||
|
for (const confirmationNumber of data) {
|
||||||
|
if (confirmationNumber) {
|
||||||
|
trackCancelStay(bookedRoom.hotelId, confirmationNumber)
|
||||||
|
}
|
||||||
|
}
|
||||||
const allCancellationsWentThrough = data.every((cancelled) => cancelled)
|
const allCancellationsWentThrough = data.every((cancelled) => cancelled)
|
||||||
if (allCancellationsWentThrough) {
|
if (allCancellationsWentThrough) {
|
||||||
if (data.length === rooms.length) {
|
if (data.length === rooms.length) {
|
||||||
|
|||||||
@@ -3,6 +3,7 @@ import { Dialog, DialogTrigger } from "react-aria-components"
|
|||||||
import { useIntl } from "react-intl"
|
import { useIntl } from "react-intl"
|
||||||
|
|
||||||
import Modal from "@/components/HotelReservation/MyStay/Modal"
|
import Modal from "@/components/HotelReservation/MyStay/Modal"
|
||||||
|
import { trackMyStayPageLink } from "@/utils/tracking"
|
||||||
|
|
||||||
import Alerts from "./Alerts"
|
import Alerts from "./Alerts"
|
||||||
import Steps from "./Steps"
|
import Steps from "./Steps"
|
||||||
@@ -11,9 +12,14 @@ import styles from "./cancelStay.module.css"
|
|||||||
|
|
||||||
export default function CancelStay() {
|
export default function CancelStay() {
|
||||||
const intl = useIntl()
|
const intl = useIntl()
|
||||||
|
|
||||||
|
function trackCancelStay() {
|
||||||
|
trackMyStayPageLink("cancel booking")
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<DialogTrigger>
|
<DialogTrigger>
|
||||||
<Modal.Button icon="cancel">
|
<Modal.Button icon="cancel" onClick={trackCancelStay}>
|
||||||
{intl.formatMessage({ defaultMessage: "Cancel stay" })}
|
{intl.formatMessage({ defaultMessage: "Cancel stay" })}
|
||||||
</Modal.Button>
|
</Modal.Button>
|
||||||
<Modal>
|
<Modal>
|
||||||
|
|||||||
@@ -5,6 +5,7 @@ import { useIntl } from "react-intl"
|
|||||||
import { useMyStayStore } from "@/stores/my-stay"
|
import { useMyStayStore } from "@/stores/my-stay"
|
||||||
|
|
||||||
import Modal from "@/components/HotelReservation/MyStay/Modal"
|
import Modal from "@/components/HotelReservation/MyStay/Modal"
|
||||||
|
import { trackMyStayPageLink } from "@/utils/tracking"
|
||||||
|
|
||||||
import { dateHasPassed } from "../utils"
|
import { dateHasPassed } from "../utils"
|
||||||
import Alerts from "./Alerts"
|
import Alerts from "./Alerts"
|
||||||
@@ -29,10 +30,18 @@ export default function ChangeDates() {
|
|||||||
!isRewardNight &&
|
!isRewardNight &&
|
||||||
dateHasPassed(checkInDate, checkInTime)
|
dateHasPassed(checkInDate, checkInTime)
|
||||||
|
|
||||||
|
function trackChangeDates() {
|
||||||
|
trackMyStayPageLink("modify dates")
|
||||||
|
}
|
||||||
|
|
||||||
const text = intl.formatMessage({ defaultMessage: "Change dates" })
|
const text = intl.formatMessage({ defaultMessage: "Change dates" })
|
||||||
return (
|
return (
|
||||||
<DialogTrigger>
|
<DialogTrigger>
|
||||||
<Modal.Button icon="edit_calendar" isDisabled={isDisabled}>
|
<Modal.Button
|
||||||
|
icon="edit_calendar"
|
||||||
|
isDisabled={isDisabled}
|
||||||
|
onClick={trackChangeDates}
|
||||||
|
>
|
||||||
{text}
|
{text}
|
||||||
</Modal.Button>
|
</Modal.Button>
|
||||||
<Modal>
|
<Modal>
|
||||||
|
|||||||
@@ -4,12 +4,18 @@ import { useIntl } from "react-intl"
|
|||||||
|
|
||||||
import Modal from "@/components/HotelReservation/MyStay/Modal"
|
import Modal from "@/components/HotelReservation/MyStay/Modal"
|
||||||
import CustomerSupportModal from "@/components/HotelReservation/MyStay/ReferenceCard/Actions/CustomerSupportModal"
|
import CustomerSupportModal from "@/components/HotelReservation/MyStay/ReferenceCard/Actions/CustomerSupportModal"
|
||||||
|
import { trackMyStayPageLink } from "@/utils/tracking"
|
||||||
|
|
||||||
export default function CustomerSupport() {
|
export default function CustomerSupport() {
|
||||||
const intl = useIntl()
|
const intl = useIntl()
|
||||||
|
|
||||||
|
function trackCustomerSupport() {
|
||||||
|
trackMyStayPageLink("customer service")
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<DialogTrigger>
|
<DialogTrigger>
|
||||||
<Modal.Button icon="support_agent">
|
<Modal.Button icon="support_agent" onClick={trackCustomerSupport}>
|
||||||
{intl.formatMessage({ defaultMessage: "Customer support" })}
|
{intl.formatMessage({ defaultMessage: "Customer support" })}
|
||||||
</Modal.Button>
|
</Modal.Button>
|
||||||
<CustomerSupportModal />
|
<CustomerSupportModal />
|
||||||
|
|||||||
@@ -7,6 +7,7 @@ import { Typography } from "@scandic-hotels/design-system/Typography"
|
|||||||
import { useMyStayStore } from "@/stores/my-stay"
|
import { useMyStayStore } from "@/stores/my-stay"
|
||||||
|
|
||||||
import Modal from "@/components/HotelReservation/MyStay/Modal"
|
import Modal from "@/components/HotelReservation/MyStay/Modal"
|
||||||
|
import { trackMyStayPageLink } from "@/utils/tracking"
|
||||||
|
|
||||||
import { dateHasPassed } from "../utils"
|
import { dateHasPassed } from "../utils"
|
||||||
import Form from "./Form"
|
import Form from "./Form"
|
||||||
@@ -37,6 +38,10 @@ export default function GuaranteeLateArrival() {
|
|||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function trackGuaranteeLateArrival() {
|
||||||
|
trackMyStayPageLink("guarantee late arrival")
|
||||||
|
}
|
||||||
|
|
||||||
const arriveLateMsg = intl.formatMessage({
|
const arriveLateMsg = intl.formatMessage({
|
||||||
defaultMessage:
|
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.",
|
"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 (
|
return (
|
||||||
<DialogTrigger>
|
<DialogTrigger>
|
||||||
<Modal.Button icon="check">{text}</Modal.Button>
|
<Modal.Button icon="check" onClick={trackGuaranteeLateArrival}>
|
||||||
|
{text}
|
||||||
|
</Modal.Button>
|
||||||
<Modal>
|
<Modal>
|
||||||
<Dialog className={styles.dialog}>
|
<Dialog className={styles.dialog}>
|
||||||
{({ close }) => (
|
{({ close }) => (
|
||||||
|
|||||||
@@ -163,11 +163,11 @@ export const bookingMutationRouter = router({
|
|||||||
)
|
)
|
||||||
)
|
)
|
||||||
|
|
||||||
const cancelledRoomsSuccessfully = []
|
const cancelledRoomsSuccessfully: (string | null)[] = []
|
||||||
for (const [idx, response] of responses.entries()) {
|
for (const [idx, response] of responses.entries()) {
|
||||||
if (response.status === "fulfilled") {
|
if (response.status === "fulfilled") {
|
||||||
if (response.value) {
|
if (response.value) {
|
||||||
cancelledRoomsSuccessfully.push(true)
|
cancelledRoomsSuccessfully.push(confirmationNumbers[idx])
|
||||||
continue
|
continue
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
@@ -177,7 +177,7 @@ export const bookingMutationRouter = router({
|
|||||||
console.error(response.reason)
|
console.error(response.reason)
|
||||||
}
|
}
|
||||||
|
|
||||||
cancelledRoomsSuccessfully.push(false)
|
cancelledRoomsSuccessfully.push(null)
|
||||||
}
|
}
|
||||||
|
|
||||||
return cancelledRoomsSuccessfully
|
return cancelledRoomsSuccessfully
|
||||||
|
|||||||
Reference in New Issue
Block a user