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

Chore/move enter details Approved-by: Anton Gunnarsson
2025-09-11 07:16:24 +00:00
parent 15711cb3a4
commit 7dee6d5083
238 changed files with 1656 additions and 1602 deletions
--- a/packages/booking-flow/lib/components/EnterDetails/Payment/PaymentCallback/TimeoutSpinner/index.tsx
+++ b/packages/booking-flow/lib/components/EnterDetails/Payment/PaymentCallback/TimeoutSpinner/index.tsx
@@ -0,0 +1,48 @@
+"use client"
+
+import { useIntl } from "react-intl"
+
+import { customerService } from "@scandic-hotels/common/constants/routes/customerService"
+import Body from "@scandic-hotels/design-system/Body"
+import Link from "@scandic-hotels/design-system/Link"
+import { LoadingSpinner } from "@scandic-hotels/design-system/LoadingSpinner"
+import Subtitle from "@scandic-hotels/design-system/Subtitle"
+
+import useLang from "../../../../../hooks/useLang"
+
+import styles from "./timeoutSpinner.module.css"
+
+export default function TimeoutSpinner() {
+  const intl = useIntl()
+  const lang = useLang()
+
+  return (
+    <div className={styles.container}>
+      <LoadingSpinner />
+      <Subtitle className={styles.heading}>
+        {intl.formatMessage({
+          defaultMessage: "Taking longer than usual",
+        })}
+      </Subtitle>
+      <Body textAlign="center" className={styles.messageContainer}>
+        {intl.formatMessage(
+          {
+            defaultMessage:
+              "We are still confirming your booking. This is usually a matter of minutes and we do apologise for the wait. Please check your inbox for a booking confirmation email and if you still haven't received it by end of day, please contact our <link>customer support</link>.",
+          },
+          {
+            link: (text) => (
+              <Link
+                href={customerService[lang]}
+                textDecoration="underline"
+                target="_blank"
+              >
+                {text}
+              </Link>
+            ),
+          }
+        )}
+      </Body>
+    </div>
+  )
+}
--- a/packages/booking-flow/lib/components/EnterDetails/Payment/PaymentCallback/TimeoutSpinner/timeoutSpinner.module.css
+++ b/packages/booking-flow/lib/components/EnterDetails/Payment/PaymentCallback/TimeoutSpinner/timeoutSpinner.module.css
@@ -0,0 +1,18 @@
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  min-height: 100vh;
+  padding: var(--Spacing-x2);
+  text-align: center;
+}
+
+.container .heading {
+  margin-bottom: var(--Spacing-x1);
+}
+
+.messageContainer {
+  max-width: 435px;
+  text-align: center;
+}