Merged in feat/price-details-modal-multiroom (pull request #1232)

feat: adjust price detail modal to handle multi room and removed dependency of enter details store

* feat: adjust price detail modal to handle multi room and removed dependency of enter details store

* fix: remove div from table

* fix: added room translation


Approved-by: Pontus Dreij

components/HotelReservation/PriceDetailsModal/index.tsx

@@ -0,0 +1,62 @@
+import { useIntl } from "react-intl"
+
+import ChevronRightSmallIcon from "@/components/Icons/ChevronRightSmall"
+import Modal from "@/components/Modal"
+import Button from "@/components/TempDesignSystem/Button"
+import Caption from "@/components/TempDesignSystem/Text/Caption"
+
+import PriceDetailsTable from "./PriceDetailsTable"
+
+import type { BedTypeSchema } from "@/types/components/hotelReservation/enterDetails/bedType"
+import type { BreakfastPackage } from "@/types/components/hotelReservation/enterDetails/breakfast"
+import type { Child } from "@/types/components/hotelReservation/selectRate/selectRate"
+import type { Price, RoomPrice } from "@/types/stores/enter-details"
+
+interface PriceDetailsModalProps {
+  fromDate: string
+  toDate: string
+  rooms: {
+    adults: number
+    childrenInRoom: Child[] | undefined
+    roomType: string
+    roomPrice: RoomPrice
+    bedType: BedTypeSchema | undefined
+    breakfast: BreakfastPackage | false | undefined
+  }[]
+  totalPrice: Price
+  vat: number
+  toggleModal: () => void
+}
+
+export default function PriceDetailsModal({
+  fromDate,
+  toDate,
+  rooms,
+  totalPrice,
+  vat,
+  toggleModal,
+}: PriceDetailsModalProps) {
+  const intl = useIntl()
+
+  return (
+    <Modal
+      title={intl.formatMessage({ id: "Price details" })}
+      trigger={
+        <Button intent="text" onPress={toggleModal}>
+          <Caption color="burgundy">
+            {intl.formatMessage({ id: "Price details" })}
+          </Caption>
+          <ChevronRightSmallIcon color="burgundy" height="20px" width="20px" />
+        </Button>
+      }
+    >
+      <PriceDetailsTable
+        fromDate={fromDate}
+        toDate={toDate}
+        rooms={rooms}
+        totalPrice={totalPrice}
+        vat={vat}
+      />
+    </Modal>
+  )
+}