From 9801f1cae5ca43826356ee116f5380961f10456b Mon Sep 17 00:00:00 2001
From: Linus Flood <linus.flood@scandichotels.com>
Date: Wed, 14 May 2025 05:58:48 +0000
Subject: [PATCH] Merged in hotfix/b-code-button (pull request #2083)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

hotfix: removed link button and show a normal button instead

* hotfix: removed link button and show a normal button instead


Approved-by: Joakim Jäderberg
---
 .../BookingCode/booking-code.module.css       |  6 ++++
 .../FormContent/BookingCode/index.tsx         | 32 +++++++------------
 2 files changed, 18 insertions(+), 20 deletions(-)

diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css
index c51f67809..76609930c 100644
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css
@@ -11,6 +11,11 @@
   padding: var(--Spacing-x1) var(--Spacing-x-one-and-half);
 }
 
+.bookingCodeErrorContainer {
+  display: flex;
+  flex-direction: column;
+}
+
 .bookingCodeLabel {
   display: flex;
   align-items: center;
@@ -54,6 +59,7 @@
 
 .bookingCodeError {
   white-space: normal;
+  margin-bottom: 1rem;
 }
 @media screen and (max-width: 767px) {
   .hideOnMobile {
diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx
index 1108b9e15..3981fe836 100644
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx
@@ -8,13 +8,13 @@ import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
 
 import { REDEMPTION } from "@/constants/booking"
 
+import ButtonLink from "@/components/ButtonLink"
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Checkbox from "@/components/TempDesignSystem/Form/Checkbox"
 import Input from "@/components/TempDesignSystem/Form/Input"
 import { getErrorMessage } from "@/components/TempDesignSystem/Form/Input/errors"
 import Switch from "@/components/TempDesignSystem/Form/Switch"
-import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
@@ -292,26 +292,18 @@ function BookingCodeError({ codeError }: { codeError: FieldError }) {
           className={styles.errorIcon}
         />
         {codeError.message === bookingWidgetErrors.BOOKING_CODE_ONLY_ENGLISH ? (
-          // eslint-disable-next-line formatjs/no-literal-string-in-jsx
-          <span className={styles.bookingCodeError}>
-            {
-              /* eslint-disable-next-line formatjs/no-literal-string-in-jsx */
-              "Dieser Code ist nur auf unserer "
-            }
-            <Link
-              color="burgundy"
-              href="https://www.scandichotels.com"
-              size="small"
-              target="_blank"
-            >
+          <div className={styles.bookingCodeErrorContainer}>
+            <span className={styles.bookingCodeError}>
+              {
+                /* eslint-disable-next-line formatjs/no-literal-string-in-jsx */
+                "Dieser Code ist nur auf unserer englischen Website gültig"
+              }
+            </span>
+            <ButtonLink href="https://www.scandichotels.com" variant="Tertiary">
               {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
-              {"englischen Website"}
-            </Link>
-            {
-              /* eslint-disable-next-line formatjs/no-literal-string-in-jsx */
-              " gültig"
-            }
-          </span>
+              {"Englischen Website"}
+            </ButtonLink>
+          </div>
         ) : (
           getErrorMessage(intl, codeError.message)
         )}