Merged in feat/SW-1737-design-mystay-multiroom (pull request #1565)

Feat/SW-1737 design mystay multiroom

* feat(SW-1737) Fixed member view of guest details

* feat(SW-1737) fix merge issues

* feat(SW-1737) Fixed price details

* feat(SW-1737) removed unused imports

* feat(SW-1737) removed true as statement

* feat(SW-1737) updated store handling

* feat(SW-1737) fixed bug showing double numbers

* feat(SW-1737) small design fixed

* feat(SW-1737) fixed rebase errors

* feat(SW-1737) fixed create booking error with dates

* feat(SW-1737) fixed view multiroom as singleroom

* feat(SW-1737) fixes for multiroom

* feat(SW-1737) fixed bookingsummary

* feat(SW-1737) dont hide modify dates

* feat(SW-1737) updated breakfast to handle number

* feat(SW-1737) Added red color if member rate

* feat(SW-1737) fix PR comments

* feat(SW-1737) updated member tiers svg

* feat(SW-1737) updated how to handle paymentMethodDescription

* feat(SW-1737) fixes after testing mystay

* feat(SW-1737) updated Room type to just use whats used

* feat(SW-1737) fixed access

* feat(SW-1737) refactor my stay after PR comments

* feat(SW-1737) fix roomNumber translation

* feat(SW-1737) removed log


Approved-by: Arvid Norlin

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

@@ -2,98 +2,90 @@
 
 import { useIntl } from "react-intl"
 
-import { BookingStatusEnum } from "@/constants/booking"
+import { useManageStayStore } from "@/stores/my-stay/manageStayStore"
+import { useMyStayRoomDetailsStore } from "@/stores/my-stay/myStayRoomDetailsStore"
 
 import { ChevronDownIcon } from "@/components/Icons"
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 
 import GuaranteeLateArrival from "../GuaranteeLateArrival"
-import { useManageStayStore } from "../stores/manageStayStore"
 import CancelStay from "./ActionPanel/Actions/CancelStay"
 import ModifyStay from "./ActionPanel/Actions/ModifyStay"
 import ActionPanel from "./ActionPanel"
 
 import type { Hotel } from "@/types/hotel"
-import type { BookingConfirmation } from "@/types/trpc/routers/booking/confirmation"
-import { type CreditCard, type User } from "@/types/user"
+import { type CreditCard } from "@/types/user"
 
 interface ManageStayProps {
-  booking: BookingConfirmation["booking"]
   hotel: Hotel
-  setBookingStatus: (status: BookingStatusEnum) => void
-  bookingStatus: string | null
-  user: User | null
   savedCreditCards: CreditCard[] | null
   refId: string
+  isLoggedIn: boolean
 }
 
 export default function ManageStay({
-  booking,
   hotel,
-  setBookingStatus,
-  bookingStatus,
-  user,
   savedCreditCards,
   refId,
+  isLoggedIn,
 }: ManageStayProps) {
   const intl = useIntl()
   const {
     isOpen,
     activeView,
-    actions: { setIsOpen, handleCloseModal, setActiveView },
+    actions: { setIsOpen, handleCloseModal },
   } = useManageStayStore()
 
-  const showGuaranteeButton =
-    bookingStatus !== BookingStatusEnum.Cancelled && !booking.guaranteeInfo
+  const bookedRoom = useMyStayRoomDetailsStore((state) => state.bookedRoom)
+  const linkedReservationRooms = useMyStayRoomDetailsStore(
+    (state) => state.linkedReservationRooms
+  )
+
+  const allRoomsCancelled =
+    linkedReservationRooms.every((room) => room.isCancelled) &&
+    bookedRoom.isCancelled
 
   function renderContent() {
     switch (activeView) {
       case "cancelStay":
-        return (
-          <CancelStay
-            booking={booking}
-            hotel={hotel}
-            setBookingStatus={() =>
-              setBookingStatus(BookingStatusEnum.Cancelled)
-            }
-          />
-        )
+        return <CancelStay hotel={hotel} />
       case "modifyStay":
-        return <ModifyStay booking={booking} user={user} />
+        return <ModifyStay isLoggedIn={isLoggedIn} />
       case "guaranteeLateArrival":
         return (
           <GuaranteeLateArrival
-            booking={booking}
-            handleCloseModal={handleCloseModal}
-            handleBackToManageStay={() => setActiveView("actionPanel")}
             savedCreditCards={savedCreditCards}
             refId={refId}
           />
         )
       default:
-        return (
-          <ActionPanel
-            booking={booking}
-            hotel={hotel}
-            bookingStatus={bookingStatus}
-            onCancelClick={() => setActiveView("cancelStay")}
-            onGuaranteeClick={() => setActiveView("guaranteeLateArrival")}
-            showGuaranteeButton={showGuaranteeButton}
-          />
-        )
+        return <ActionPanel hotel={hotel} />
     }
   }
 
   return (
     <>
-      <Button variant="icon" fullWidth onClick={() => setIsOpen(true)}>
+      <Button
+        variant="icon"
+        fullWidth
+        onClick={() => setIsOpen(true)}
+        size="small"
+        disabled={allRoomsCancelled}
+      >
         {intl.formatMessage({ id: "Manage stay" })}
         <ChevronDownIcon width={24} height={24} color="burgundy" />
       </Button>
-      <Modal isOpen={isOpen} onToggle={handleCloseModal} withActions hideHeader>
-        {renderContent()}
-      </Modal>
+      {isOpen && (
+        <Modal
+          isOpen={isOpen}
+          onToggle={handleCloseModal}
+          withActions
+          hideHeader
+        >
+          {renderContent()}
+        </Modal>
+      )}
     </>
   )
 }