Merged in feat/SW-1149-handle-status-polling (pull request #1562)

Feat/SW-1149 handle status polling

* feat(SW-1149): move terms and conditions sections to separate component and added copy

* feat(SW-1149): Added client component to handle success callback for payment flow

* fix: check for bookingCompleted status as well

* feat(SW-1587): use alert instead of toast for showing payment errors

* fix: added enum for payment callback status

* fix: proper way of checking for multiple statuses

* fix: update schema type

* fix: use localised link to customer service

* fix: update to use enum for status strings


Approved-by: Arvid Norlin

apps/scandic-web/components/HotelReservation/EnterDetails/Payment/TermsAndConditions/index.tsx

@@ -0,0 +1,70 @@
+import { useIntl } from "react-intl"
+
+import {
+  bookingTermsAndConditions,
+  privacyPolicy,
+} from "@/constants/currentWebHrefs"
+
+import Checkbox from "@/components/TempDesignSystem/Form/Checkbox"
+import Link from "@/components/TempDesignSystem/Link"
+import Caption from "@/components/TempDesignSystem/Text/Caption"
+import useLang from "@/hooks/useLang"
+
+import styles from "../payment.module.css"
+
+export default function TermsAndConditions() {
+  const intl = useIntl()
+  const lang = useLang()
+
+  return (
+    <>
+      <Caption>
+        {intl.formatMessage(
+          {
+            id: "By paying with any of the payment methods available, I accept the terms for this booking and the general <termsAndConditionsLink>Terms & Conditions</termsAndConditionsLink>, and understand that Scandic will process my personal data for this booking in accordance with <privacyPolicyLink>Scandic's Privacy policy</privacyPolicyLink>. I also accept that Scandic require a valid credit card during my visit in case anything is left unpaid.",
+          },
+          {
+            termsAndConditionsLink: (str) => (
+              <Link
+                className={styles.link}
+                variant="underscored"
+                href={bookingTermsAndConditions[lang]}
+                target="_blank"
+                weight="bold"
+                size="small"
+              >
+                {str}
+              </Link>
+            ),
+            privacyPolicyLink: (str) => (
+              <Link
+                className={styles.link}
+                variant="underscored"
+                href={privacyPolicy[lang]}
+                target="_blank"
+                weight="bold"
+                size="small"
+              >
+                {str}
+              </Link>
+            ),
+          }
+        )}
+      </Caption>
+      <Checkbox name="termsAndConditions">
+        <Caption>
+          {intl.formatMessage({
+            id: "I accept the terms and conditions",
+          })}
+        </Caption>
+      </Checkbox>
+      <Checkbox name="smsConfirmation">
+        <Caption>
+          {intl.formatMessage({
+            id: "I would like to get my booking confirmation via sms",
+          })}
+        </Caption>
+      </Checkbox>
+    </>
+  )
+}