Merged in chore/move-enter-details (pull request #2778)

Chore/move enter details

Approved-by: Anton Gunnarsson

packages/booking-flow/lib/components/EnterDetails/Confirm/index.tsx

@@ -0,0 +1,77 @@
+"use client"
+import { useIntl } from "react-intl"
+
+import { Divider } from "@scandic-hotels/design-system/Divider"
+import Checkbox from "@scandic-hotels/design-system/Form/Checkbox"
+import { Typography } from "@scandic-hotels/design-system/Typography"
+
+import TermsAndConditions from "../Payment/TermsAndConditions"
+import Guarantee from "./Guarantee"
+
+import styles from "./confirm.module.css"
+
+import type { CreditCard } from "@scandic-hotels/trpc/types/user"
+
+interface ConfirmBookingProps {
+  savedCreditCards: CreditCard[] | null
+}
+
+export default function ConfirmBooking({
+  savedCreditCards,
+}: ConfirmBookingProps) {
+  const intl = useIntl()
+  return (
+    <div className={styles.container}>
+      <div className={styles.selections}>
+        <Guarantee savedCreditCards={savedCreditCards} />
+        <Divider color="Border/Divider/Default" />
+        <Checkbox name="smsConfirmation">
+          <Typography variant="Body/Supporting text (caption)/smRegular">
+            <span>
+              {intl.formatMessage({
+                defaultMessage:
+                  "I would like to get my booking confirmation via sms",
+              })}
+            </span>
+          </Typography>
+        </Checkbox>
+      </div>
+      <div className={styles.checkboxContainer}>
+        <TermsAndConditions isFlexBookingTerms />
+      </div>
+    </div>
+  )
+}
+
+export function ConfirmBookingRedemption() {
+  const intl = useIntl()
+  return (
+    <div className={styles.container}>
+      <div className={styles.selections}>
+        <Checkbox name="smsConfirmation">
+          <Typography variant="Body/Supporting text (caption)/smRegular">
+            <span>
+              {intl.formatMessage({
+                defaultMessage:
+                  "I would like to get my booking confirmation via sms",
+              })}
+            </span>
+          </Typography>
+        </Checkbox>
+      </div>
+      <div className={styles.guaranteeContainer}>
+        <Typography variant="Body/Supporting text (caption)/smRegular">
+          <p>
+            {intl.formatMessage({
+              defaultMessage:
+                "When you confirm the booking the room will be guaranteed for late arrival. If you fail to arrive without cancelling in advance or if you cancel after 18:00 local time, you will be charged for one reward night.",
+            })}
+          </p>
+        </Typography>
+      </div>
+      <div className={styles.checkboxContainer}>
+        <TermsAndConditions isFlexBookingTerms />
+      </div>
+    </div>
+  )
+}