From 6083eea5cc0282ea79aa97b1a4fc6fb1eafb01af Mon Sep 17 00:00:00 2001 From: Christel Westerberg Date: Fri, 7 Nov 2025 06:43:13 +0000 Subject: [PATCH] Merged in fix/STAY-65-manage-stay (pull request #3089) Fix/STAY-65 manage stay * fix: Disable manage stay for past bookings * fix: handle past and cancelled stay the same * fix: indentify past booking * fix: refactor to use design system components Approved-by: Erik Tiekstra --- .../Actions/Cancelled/cancelled.module.css | 18 ----- .../ReferenceCard/Actions/Cancelled/index.tsx | 31 --------- .../ManageStay/manageStay.module.css | 63 ------------------ .../Actions/NotCancelled/index.tsx | 37 ----------- .../NotCancelled/notCancelled.module.css | 10 --- .../CustomerSupport.tsx | 8 ++- .../Actions/NotUpcoming/index.tsx | 65 +++++++++++++++++++ .../ActionsButton/actionsButton.module.css | 0 .../Actions/ActionsButton/index.tsx | 0 .../AddToCalendar/AddToCalendarButton.tsx | 0 .../Actions/AddToCalendar/index.tsx | 0 .../ManageStay/Actions/CancelStay/Alerts.tsx | 0 .../Steps/CancelStayPriceContainer.tsx | 0 .../Steps/Confirmation/Multiroom/index.tsx | 0 .../Multiroom/multiroom.module.css | 0 .../Confirmation/confirmation.module.css | 0 .../CancelStay/Steps/Confirmation/index.tsx | 0 .../finalConfirmation.module.css | 0 .../Steps/FinalConfirmation/index.tsx | 0 .../Actions/CancelStay/Steps/index.tsx | 0 .../Actions/CancelStay/cancelStay.module.css | 0 .../ManageStay/Actions/CancelStay/index.tsx | 0 .../ChangeDates/Alerts/CannotChangeDate.tsx | 0 .../ChangeDates/Alerts/MultiRoomBooking.tsx | 0 .../ChangeDates/Alerts/NotMainRoom.tsx | 0 .../Actions/ChangeDates/Alerts/index.tsx | 0 .../Steps/Confirmation/PriceAndDate/index.tsx | 0 .../PriceAndDate/priceAndDate.module.css | 0 .../Confirmation/confirmation.module.css | 0 .../ChangeDates/Steps/Confirmation/index.tsx | 0 .../Steps/Form/Alerts/NoAvailability.tsx | 0 .../ChangeDates/Steps/Form/NewDates/index.tsx | 0 .../Steps/Form/NewDates/newDates.module.css | 0 .../Actions/ChangeDates/Steps/Form/index.tsx | 0 .../Actions/ChangeDates/Steps/index.tsx | 0 .../ManageStay/Actions/ChangeDates/index.tsx | 0 .../Actions/CustomerSupport/index.tsx | 0 .../GuaranteeLateArrival/Form/form.module.css | 0 .../GuaranteeLateArrival/Form/index.tsx | 0 .../GuaranteeLateArrival/Form/schema.ts | 0 .../GuaranteeLateArrival/guarantee.module.css | 0 .../Actions/GuaranteeLateArrival/index.tsx | 0 .../Actions/ResendConfirmationEmail/index.tsx | 0 .../Actions/ViewAndPrintReceipt/index.tsx | 0 .../ViewAndPrintReceipt/view.module.css | 0 .../ManageStay/Actions/actions.module.css | 0 .../ManageStay/Actions/index.tsx | 0 .../ManageStay/Actions/utils.ts | 0 .../ManageStay/Info/index.tsx | 0 .../ManageStay/Info/info.module.css | 0 .../ManageStay/index.tsx | 37 ++++------- .../Upcoming/ManageStay/manageStay.module.css | 32 +++++++++ .../ReferenceCard/Actions/Upcoming/index.tsx | 38 +++++++++++ .../MyStay/ReferenceCard/Actions/index.tsx | 9 ++- apps/scandic-web/providers/MyStay.tsx | 8 +++ apps/scandic-web/stores/my-stay/index.ts | 2 + apps/scandic-web/types/stores/my-stay.ts | 8 ++- 57 files changed, 178 insertions(+), 188 deletions(-) delete mode 100644 apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Cancelled/cancelled.module.css delete mode 100644 apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Cancelled/index.tsx delete mode 100644 apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/manageStay.module.css delete mode 100644 apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/index.tsx delete mode 100644 apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/notCancelled.module.css rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{Cancelled => NotUpcoming}/CustomerSupport.tsx (73%) create mode 100644 apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotUpcoming/index.tsx rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ActionsButton/actionsButton.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ActionsButton/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/AddToCalendar/AddToCalendarButton.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/AddToCalendar/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CancelStay/Alerts.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CancelStay/Steps/CancelStayPriceContainer.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CancelStay/Steps/Confirmation/Multiroom/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CancelStay/Steps/Confirmation/Multiroom/multiroom.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CancelStay/Steps/Confirmation/confirmation.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CancelStay/Steps/Confirmation/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CancelStay/Steps/FinalConfirmation/finalConfirmation.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CancelStay/Steps/FinalConfirmation/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CancelStay/Steps/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CancelStay/cancelStay.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CancelStay/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Alerts/CannotChangeDate.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Alerts/MultiRoomBooking.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Alerts/NotMainRoom.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Alerts/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Steps/Confirmation/PriceAndDate/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Steps/Confirmation/PriceAndDate/priceAndDate.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Steps/Confirmation/confirmation.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Steps/Confirmation/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Steps/Form/Alerts/NoAvailability.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Steps/Form/NewDates/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Steps/Form/NewDates/newDates.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Steps/Form/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/Steps/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ChangeDates/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/CustomerSupport/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/GuaranteeLateArrival/Form/form.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/GuaranteeLateArrival/Form/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/GuaranteeLateArrival/Form/schema.ts (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/GuaranteeLateArrival/guarantee.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/GuaranteeLateArrival/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ResendConfirmationEmail/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ViewAndPrintReceipt/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/ViewAndPrintReceipt/view.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/actions.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Actions/utils.ts (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Info/index.tsx (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/Info/info.module.css (100%) rename apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/{NotCancelled => Upcoming}/ManageStay/index.tsx (59%) create mode 100644 apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Upcoming/ManageStay/manageStay.module.css create mode 100644 apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Upcoming/index.tsx diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Cancelled/cancelled.module.css b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Cancelled/cancelled.module.css deleted file mode 100644 index 630fa03ce..000000000 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Cancelled/cancelled.module.css +++ /dev/null @@ -1,18 +0,0 @@ -div a.link { - align-items: center; - background-color: var(--Component-Button-Brand-Tertiary-Fill-Default); - border: 2px solid var(--Component-Button-Brand-Tertiary-Border-Default); - border-radius: var(--Corner-radius-rounded); - color: var(--Text-Inverted); - cursor: pointer; - display: flex; - gap: var(--Space-x1); - height: 48px; - justify-content: center; - padding: var(--Space-x2) var(--Space-x4); - transition: background-color 200ms ease; - - &:hover { - background-color: var(--Component-Button-Brand-Tertiary-Fill-Hover); - } -} diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Cancelled/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Cancelled/index.tsx deleted file mode 100644 index 18d6ba478..000000000 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Cancelled/index.tsx +++ /dev/null @@ -1,31 +0,0 @@ -"use client" -import { usePathname } from "next/navigation" -import { useIntl } from "react-intl" - -import Link from "@scandic-hotels/design-system/OldDSLink" - -import { isWebview } from "@/constants/routes/webviews" - -import CustomerSupport from "./CustomerSupport" - -import styles from "./cancelled.module.css" - -export default function Cancelled() { - const intl = useIntl() - const pathname = usePathname() - return ( - <> - {/* (S) TODO - Link to where?? */} - {!isWebview(pathname) && ( - - {intl.formatMessage({ - defaultMessage: "Rebook", - id: "myStay.referenceCard.actions.rebook", - })} - - )} - - - - ) -} diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/manageStay.module.css b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/manageStay.module.css deleted file mode 100644 index ccc30714c..000000000 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/manageStay.module.css +++ /dev/null @@ -1,63 +0,0 @@ -.trigger { - align-items: center; - background-color: var(--Component-Button-Brand-Tertiary-Fill-Default); - border: 2px solid var(--Component-Button-Brand-Tertiary-Border-Default); - border-radius: var(--Corner-radius-rounded); - color: var(--Text-Inverted); - cursor: pointer; - display: flex; - gap: var(--Space-x1); - height: 48px; - justify-content: center; - padding: var(--Space-x2) var(--Space-x4); - transition: background-color 200ms ease; - - &:hover { - background-color: var(--Component-Button-Brand-Tertiary-Fill-Hover); - } - - &:disabled { - background-color: var(--Component-Button-Brand-Tertiary-Fill-Disabled); - cursor: not-allowed; - } -} - -.dialog { - display: grid; - flex: 1; - gap: var(--Space-x2); -} - -.header { - align-items: center; - display: flex; - gap: var(--Space-x2); - justify-content: space-between; -} - -.title { - color: var(--Text-Default); -} - -.close { - background: none; - border: none; - cursor: pointer; - padding: 0; -} - -.content { - display: grid; - gap: var(--Space-x2); -} - -@media screen and (min-width: 768px) { - .dialog { - gap: var(--Space-x3); - } - - .content { - gap: var(--Space-x3); - grid-template-columns: 1fr 1fr; - } -} diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/index.tsx deleted file mode 100644 index 77a4dd5ad..000000000 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/index.tsx +++ /dev/null @@ -1,37 +0,0 @@ -"use client" -import Link from "next/link" -import { useIntl } from "react-intl" - -import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon" -import { Typography } from "@scandic-hotels/design-system/Typography" - -import { useMyStayStore } from "@/stores/my-stay" - -import ManageStay from "./ManageStay" - -import styles from "./notCancelled.module.css" - -export default function NotCancelled() { - const intl = useIntl() - const { hotel } = useMyStayStore((state) => state) - - const directionsUrl = `https://www.google.com/maps/dir/?api=1&destination=${encodeURIComponent( - `${hotel.name}, ${hotel.address.streetAddress}, ${hotel.address.zipCode} ${hotel.address.city}` - )}` - return ( - <> - - - - - {intl.formatMessage({ - id: "myStay.referenceCard.actions.findUs", - defaultMessage: "Find us", - })} - - - - - - ) -} diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/notCancelled.module.css b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/notCancelled.module.css deleted file mode 100644 index b73bcdb3c..000000000 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/notCancelled.module.css +++ /dev/null @@ -1,10 +0,0 @@ -.link { - align-items: center; - border: 2px solid var(--Component-Button-Brand-Secondary-Border-Default); - border-radius: var(--Corner-radius-rounded); - color: var(--Text-Interactive-Default); - display: flex; - height: 48px; - justify-content: center; - text-decoration: none; -} diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Cancelled/CustomerSupport.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotUpcoming/CustomerSupport.tsx similarity index 73% rename from apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Cancelled/CustomerSupport.tsx rename to apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotUpcoming/CustomerSupport.tsx index 7b4b7c519..ca7dc6101 100644 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Cancelled/CustomerSupport.tsx +++ b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotUpcoming/CustomerSupport.tsx @@ -2,7 +2,7 @@ import { DialogTrigger } from "react-aria-components" import { useIntl } from "react-intl" -import { OldDSButton as Button } from "@scandic-hotels/design-system/OldDSButton" +import { Button } from "@scandic-hotels/design-system/Button" import CustomerSupportModal from "@/components/HotelReservation/MyStay/ReferenceCard/Actions/CustomerSupportModal" @@ -11,7 +11,11 @@ export default function CustomerSupport() { return ( - {({ close }) => ( @@ -49,9 +40,9 @@ export default function ManageStay() { {manageStay} - - - + + +
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Upcoming/ManageStay/manageStay.module.css b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Upcoming/ManageStay/manageStay.module.css new file mode 100644 index 000000000..8c6732f27 --- /dev/null +++ b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Upcoming/ManageStay/manageStay.module.css @@ -0,0 +1,32 @@ +.dialog { + display: grid; + flex: 1; + gap: var(--Space-x2); +} + +.header { + align-items: center; + display: flex; + gap: var(--Space-x2); + justify-content: space-between; +} + +.title { + color: var(--Text-Default); +} + +.content { + display: grid; + gap: var(--Space-x2); +} + +@media screen and (min-width: 768px) { + .dialog { + gap: var(--Space-x3); + } + + .content { + gap: var(--Space-x3); + grid-template-columns: 1fr 1fr; + } +} diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Upcoming/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Upcoming/index.tsx new file mode 100644 index 000000000..84d9a010c --- /dev/null +++ b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/Upcoming/index.tsx @@ -0,0 +1,38 @@ +"use client" +import { useIntl } from "react-intl" + +import ButtonLink from "@scandic-hotels/design-system/ButtonLink" +import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon" + +import { useMyStayStore } from "@/stores/my-stay" + +import ManageStay from "./ManageStay" + +export default function Upcoming() { + const intl = useIntl() + const hotel = useMyStayStore((state) => state.hotel) + + const directionsUrl = `https://www.google.com/maps/dir/?api=1&destination=${encodeURIComponent( + `${hotel.name}, ${hotel.address.streetAddress}, ${hotel.address.zipCode} ${hotel.address.city}` + )}` + return ( + <> + + + + {intl.formatMessage({ + id: "myStay.referenceCard.actions.findUs", + defaultMessage: "Find us", + })} + + + + + ) +} diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/index.tsx index 504a67c86..90b3580ff 100644 --- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/index.tsx +++ b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/index.tsx @@ -1,16 +1,19 @@ "use client" import { useMyStayStore } from "@/stores/my-stay" -import Cancelled from "./Cancelled" -import NotCancelled from "./NotCancelled" +import NotUpcoming from "./NotUpcoming" +import Upcoming from "./Upcoming" import styles from "./actions.module.css" export default function Actions() { const isCancelled = useMyStayStore((state) => state.bookedRoom.isCancelled) + const isPastBooking = useMyStayStore((state) => state.isPastBooking) + + const isActionable = !isCancelled && !isPastBooking return (
- {isCancelled ? : } + {isActionable ? : }
) } diff --git a/apps/scandic-web/providers/MyStay.tsx b/apps/scandic-web/providers/MyStay.tsx index c9fcc3aa9..795101d50 100644 --- a/apps/scandic-web/providers/MyStay.tsx +++ b/apps/scandic-web/providers/MyStay.tsx @@ -3,6 +3,7 @@ import { notFound } from "next/navigation" import { use, useRef } from "react" import { useIntl } from "react-intl" +import { dt } from "@scandic-hotels/common/dt" import { trpc } from "@scandic-hotels/trpc/client" import { createMyStayStore } from "@/stores/my-stay" @@ -91,9 +92,15 @@ export default function MyStayProvider({ const rooms = [data.booking, ...linkedReservations] + // Following the API logic for determining if booking is in the past. + // This is the same logic as used for separating stays in /future and /past endpoints on the API + const now = dt() + const isPastBooking = dt(data.booking.checkInDate).isBefore(now, "day") + const hasInvalidatedQueryAndRefetched = (isFetchedAfterMount && data) || (linkedReservationsIsFetchedAfterMount && linkedReservations) + if (!storeRef.current || hasInvalidatedQueryAndRefetched) { storeRef.current = createMyStayStore({ breakfastPackages, @@ -104,6 +111,7 @@ export default function MyStayProvider({ rooms, savedCreditCards, isLoggedIn, + isPastBooking, }) } diff --git a/apps/scandic-web/stores/my-stay/index.ts b/apps/scandic-web/stores/my-stay/index.ts index 05e7713e3..2393c9b90 100644 --- a/apps/scandic-web/stores/my-stay/index.ts +++ b/apps/scandic-web/stores/my-stay/index.ts @@ -25,6 +25,7 @@ export function createMyStayStore({ rooms, savedCreditCards, isLoggedIn, + isPastBooking, }: InitialState) { const rates = { change: intl.formatMessage({ @@ -79,6 +80,7 @@ export function createMyStayStore({ savedCreditCards, totalPoints, totalPrice, + isPastBooking, actions: { closeManageStay() { diff --git a/apps/scandic-web/types/stores/my-stay.ts b/apps/scandic-web/types/stores/my-stay.ts index 5c07c49d9..364f1ba0a 100644 --- a/apps/scandic-web/types/stores/my-stay.ts +++ b/apps/scandic-web/types/stores/my-stay.ts @@ -57,12 +57,18 @@ export interface MyStayState { savedCreditCards: CreditCard[] | null totalPoints: number totalPrice: string + isPastBooking: boolean } export interface InitialState extends Pick< MyStayState, - "breakfastPackages" | "hotel" | "refId" | "savedCreditCards" | "isLoggedIn" + | "breakfastPackages" + | "hotel" + | "refId" + | "savedCreditCards" + | "isLoggedIn" + | "isPastBooking" > { intl: IntlShape roomCategories: RoomCategories