Merged in feat/SW-619-signup-non-happy (pull request #1083)

Feat/SW-619 signup non happy

* feat(SW-619): Added tests for Date input

* feat(SW-619): Updated date input to not allow date below 18 years old, also added form validation and tests to cover this change

* fix

* feat(SW-619): add info banner if membership verification fails

* fix(SW-619): update test description


Approved-by: Christel Westerberg
Approved-by: Arvid Norlin

components/HotelReservation/BookingConfirmation/Confirmation/index.tsx

@@ -1,5 +1,6 @@
 "use client"
 import { useRef } from "react"
+import { useIntl } from "react-intl"
 
 import Header from "@/components/HotelReservation/BookingConfirmation/Header"
 import HotelDetails from "@/components/HotelReservation/BookingConfirmation/HotelDetails"
@@ -8,22 +9,40 @@ import Promos from "@/components/HotelReservation/BookingConfirmation/Promos"
 import Receipt from "@/components/HotelReservation/BookingConfirmation/Receipt"
 import Rooms from "@/components/HotelReservation/BookingConfirmation/Rooms"
 import SidePanel from "@/components/HotelReservation/SidePanel"
+import Alert from "@/components/TempDesignSystem/Alert"
 import Divider from "@/components/TempDesignSystem/Divider"
 
 import styles from "./confirmation.module.css"
 
 import type { ConfirmationProps } from "@/types/components/hotelReservation/bookingConfirmation/bookingConfirmation"
+import { AlertTypeEnum } from "@/types/enums/alert"
 
 export default function Confirmation({
   booking,
   hotel,
   room,
 }: ConfirmationProps) {
+  const intl = useIntl()
   const mainRef = useRef<HTMLElement | null>(null)
+
+  const failedToVerifyMembership =
+    booking.rateDefinition.isMemberRate && !booking.guest.membershipNumber
+
   return (
     <main className={styles.main} ref={mainRef}>
       <Header booking={booking} hotel={hotel} mainRef={mainRef} />
       <div className={styles.booking}>
+        {failedToVerifyMembership && (
+          <Alert
+            type={AlertTypeEnum.Info}
+            heading={intl.formatMessage({
+              id: "booking.confirmation.membershipInfo.heading",
+            })}
+            text={intl.formatMessage({
+              id: "booking.confirmation.membershipInfo.text",
+            })}
+          />
+        )}
         <Rooms booking={booking} room={room} />
         <PaymentDetails booking={booking} />
         <Divider color="primaryLightSubtle" />