Merged in feat(SW-2084)-disable-options-modify-my-stay (pull request #1662)

feat(SW-2084) logic to disable Manage stay options

* feat(SW-2084) logic to disable Manage stay options

* feat(SW-2084) cleanup logic for checks

* feat(SW-2084) check if date has passed

* feat(SW-2084) change to datetimeIsInThePast


Approved-by: Niclas Edenvin

apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/index.tsx

@@ -1,8 +1,10 @@
 "use client"
 
+import { useMemo } from "react"
 import { useIntl } from "react-intl"
 
 import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { customerService } from "@/constants/currentWebHrefs"
 import { preliminaryReceipt } from "@/constants/routes/myStay"
@@ -20,6 +22,13 @@ import useLang from "@/hooks/useLang"
 import { trackMyStayPageLink } from "@/utils/tracking"
 
 import AddToCalendarButton from "./Actions/AddToCalendarButton"
+import {
+  checkCancelable,
+  checkCanDownloadInvoice,
+  checkDateModifiable,
+  checkGuaranteeable,
+  isDatetimePast,
+} from "./utils"
 
 import styles from "./actionPanel.module.css"
 
@@ -43,14 +52,42 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
     (state) => state.linkedReservationRooms
   )
 
-  const showCancelStayButton =
-    bookedRoom.isCancelable ||
-    linkedReservationRooms.some((room) => room.isCancelable)
-  const showGuaranteeButton =
-    !bookedRoom.guaranteeInfo && !bookedRoom.isCancelled
+  const {
+    confirmationNumber,
+    checkInDate,
+    checkOutDate,
+    createDateTime,
+    canChangeDate,
+    isPrePaid,
+  } = bookedRoom
 
-  const { confirmationNumber, checkInDate, checkOutDate, createDateTime } =
-    bookedRoom
+  const datetimeIsInThePast = useMemo(
+    () => isDatetimePast(checkInDate),
+    [checkInDate]
+  )
+
+  const isDateModifyable = checkDateModifiable({
+    canChangeDate,
+    datetimeIsInThePast,
+    isCancelled: bookedRoom.isCancelled,
+    isPrePaid,
+  })
+
+  const isCancelable = checkCancelable({
+    bookedRoom,
+    linkedReservationRooms,
+    datetimeIsInThePast,
+  })
+
+  const isGuaranteeable = checkGuaranteeable({
+    bookedRoom,
+    datetimeIsInThePast,
+  })
+
+  const canDownloadInvoice = checkCanDownloadInvoice({
+    isCancelled: bookedRoom.isCancelled,
+    isPrePaid,
+  })
 
   const calendarEvent: EventAttributes = {
     busyStatus: "FREE",
@@ -102,48 +139,65 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
           onClick={handleModifyStay}
           intent="text"
           className={styles.button}
+          disabled={!isDateModifyable}
         >
           {intl.formatMessage({ id: "Modify dates" })}
           <MaterialIcon icon="calendar_month" color="CurrentColor" />
         </Button>
-        {showGuaranteeButton && (
-          <Button
-            variant="icon"
-            onClick={handleGuaranteeLateArrival}
-            intent="text"
-            className={styles.button}
-          >
-            {intl.formatMessage({ id: "Guarantee late arrival" })}
-            <MaterialIcon icon="credit_card" color="CurrentColor" />
-          </Button>
-        )}
+
+        <Button
+          variant="icon"
+          onClick={handleGuaranteeLateArrival}
+          intent="text"
+          className={styles.button}
+          disabled={!isGuaranteeable}
+        >
+          {intl.formatMessage({ id: "Guarantee late arrival" })}
+          <MaterialIcon icon="credit_card" color="CurrentColor" />
+        </Button>
+
         <AddToCalendar
           checkInDate={checkInDate}
           event={calendarEvent}
           hotelName={hotel.name}
-          renderButton={(onPress) => <AddToCalendarButton onPress={onPress} />}
+          renderButton={(onPress) => (
+            <AddToCalendarButton
+              onPress={onPress}
+              disabled={datetimeIsInThePast}
+            />
+          )}
         />
-        <Link
-          href={preliminaryReceipt[lang]}
-          target="_blank"
-          keepSearchParams
-          className={styles.actionLink}
-          onClick={handleDownloadInvoice}
-        >
-          {intl.formatMessage({ id: "Download invoice" })}
-          <MaterialIcon icon="download" color="CurrentColor" />
-        </Link>
-        {showCancelStayButton && (
-          <Button
-            variant="icon"
-            onClick={handleCancelStay}
-            intent="text"
-            className={styles.button}
+        {canDownloadInvoice ? (
+          <Link
+            href={preliminaryReceipt[lang]}
+            target="_blank"
+            keepSearchParams
+            className={styles.actionLink}
+            onClick={handleDownloadInvoice}
           >
-            {intl.formatMessage({ id: "Cancel stay" })}
-            <MaterialIcon icon="cancel" color="CurrentColor" />
-          </Button>
+            {intl.formatMessage({ id: "Download invoice" })}
+            <MaterialIcon icon="download" color="CurrentColor" />
+          </Link>
+        ) : (
+          <div className={styles.disabledLink}>
+            <Typography variant="Body/Paragraph/mdBold">
+              <p>{intl.formatMessage({ id: "Download invoice" })}</p>
+            </Typography>
+
+            <MaterialIcon icon="download" color="CurrentColor" />
+          </div>
         )}
+
+        <Button
+          variant="icon"
+          onClick={handleCancelStay}
+          intent="text"
+          className={styles.button}
+          disabled={!isCancelable}
+        >
+          {intl.formatMessage({ id: "Cancel stay" })}
+          <MaterialIcon icon="cancel" color="CurrentColor" />
+        </Button>
       </div>
       <div className={styles.info}>
         <div>