Merged in feat/sw-2879-booking-widget-to-booking-flow-package (pull request #2532)

feat(SW-2879): Move BookingWidget to booking-flow package * Fix lockfile * Fix styling * a tiny little booking widget test * Tiny fixes * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Remove unused scripts * lint:fix * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Tiny lint fixes * update test * Update Input in booking-flow * Clean up comments etc * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Setup tracking context for booking-flow * Add missing use client * Fix temp tracking function * Pass booking to booking-widget * Remove comment * Add use client to booking widget tracking provider * Add use client to tracking functions * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Move debug page * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package Approved-by: Bianca Widstam
2025-08-05 09:20:20 +00:00
parent 03c9244fdf
commit 1bd8fe6821
206 changed files with 1936 additions and 796 deletions
--- a/packages/booking-flow/lib/components/BookingWidget/GuestsRoomsPicker/GuestsRoom/index.tsx
+++ b/packages/booking-flow/lib/components/BookingWidget/GuestsRoomsPicker/GuestsRoom/index.tsx
@@ -0,0 +1,72 @@
+import { useIntl } from "react-intl"
+
+import { Divider } from "@scandic-hotels/design-system/Divider"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
+import { OldDSButton as Button } from "@scandic-hotels/design-system/OldDSButton"
+import Subtitle from "@scandic-hotels/design-system/Subtitle"
+import { ChildBedMapEnum } from "@scandic-hotels/trpc/enums/childBedMapEnum"
+
+import AdultSelector from "../AdultSelector"
+import ChildSelector from "../ChildSelector"
+
+import styles from "../guests-rooms-picker.module.css"
+
+import type { GuestsRoom } from "../.."
+
+export function GuestsRoom({
+  room,
+  index,
+  onRemove,
+}: {
+  room: GuestsRoom
+  index: number
+  onRemove: (index: number) => void
+}) {
+  const intl = useIntl()
+  const roomLabel = intl.formatMessage(
+    {
+      defaultMessage: "Room {roomIndex}",
+    },
+    {
+      roomIndex: index + 1,
+    }
+  )
+
+  const childrenInAdultsBed = room.childrenInRoom.filter(
+    (child) => child.bed === ChildBedMapEnum.IN_ADULTS_BED
+  ).length
+
+  return (
+    <div className={styles.roomContainer}>
+      <section className={styles.roomDetailsContainer}>
+        <Subtitle type="two" className={styles.roomHeading}>
+          {roomLabel}
+        </Subtitle>
+        <AdultSelector roomIndex={index} currentAdults={room.adults} />
+        <ChildSelector
+          roomIndex={index}
+          currentAdults={room.adults}
+          currentChildren={room.childrenInRoom}
+          childrenInAdultsBed={childrenInAdultsBed}
+        />
+        {index !== 0 && (
+          <Button
+            intent="text"
+            variant="icon"
+            wrapping
+            theme="secondaryLight"
+            onPress={() => onRemove(index)}
+            size="small"
+            className={styles.roomActionsButton}
+          >
+            <MaterialIcon icon="delete" color="CurrentColor" />
+            {intl.formatMessage({
+              defaultMessage: "Remove room",
+            })}
+          </Button>
+        )}
+      </section>
+      <Divider color="Border/Divider/Subtle" />
+    </div>
+  )
+}