Merged in feature/SW-3515-join-scandic-friends-placeholder (pull request #2883)

feat(SW-3515): display placeholder for join scandic friends

* feat(SW-3515): display placeholder for join scandic friends

* add missing variant config


Approved-by: Linus Flood

packages/booking-flow/lib/components/BookingWidget/BookingWidgetForm/FormContent/BookingCode/index.tsx

@@ -13,6 +13,7 @@ import Switch from "@scandic-hotels/design-system/Switch"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 import { SEARCH_TYPE_REDEMPTION } from "@scandic-hotels/trpc/constants/booking"
 
+import { useBookingFlowConfig } from "../../../../../bookingFlowConfig/bookingFlowConfigContext"
 import BookingFlowInput from "../../../../BookingFlowInput"
 import { getErrorMessage } from "../../../../BookingFlowInput/errors"
 import { Input as BookingWidgetInput } from "../Input"
@@ -282,6 +283,7 @@ function BookingCodeError({
 }) {
   const intl = useIntl()
   const isMultiroomError = isMultiRoomError(codeError.message)
+  const config = useBookingFlowConfig()
 
   return (
     <div className={styles.errorContainer}>
@@ -296,7 +298,7 @@ function BookingCodeError({
             color="Icon/Feedback/Error"
             isFilled={!isDesktop}
           />
-          {getErrorMessage(intl, codeError.message)}
+          {getErrorMessage(intl, config.variant, codeError.message)}
         </span>
       </Typography>
       {isMultiroomError ? (

packages/booking-flow/lib/components/BookingWidget/BookingWidgetForm/FormContent/RewardNight/index.tsx

@@ -2,10 +2,9 @@
 
 import { useCallback, useEffect, useRef } from "react"
 import { useFormContext } from "react-hook-form"
-import { useIntl } from "react-intl"
+import { type IntlShape, useIntl } from "react-intl"
 import { useMediaQuery } from "usehooks-ts"
 
-import { ScandicPartnersEnum } from "@scandic-hotels/common/constants/scandicPartners"
 import Checkbox from "@scandic-hotels/design-system/Form/Checkbox"
 import { IconButton } from "@scandic-hotels/design-system/IconButton"
 import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
@@ -13,10 +12,9 @@ import Modal from "@scandic-hotels/design-system/Modal"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 import { SEARCH_TYPE_REDEMPTION } from "@scandic-hotels/trpc/constants/booking"
 
-import {
-  useBookingFlowConfig,
-  useIsPartner,
-} from "../../../../../bookingFlowConfig/bookingFlowConfigContext"
+import { type BookingFlowConfig } from "../../../../../bookingFlowConfig/bookingFlowConfig"
+import { useBookingFlowConfig } from "../../../../../bookingFlowConfig/bookingFlowConfigContext"
+import { bookingFlowVariants } from "../../../../../bookingFlowConfig/bookingFlowVariants"
 import { getErrorMessage } from "../../../../BookingFlowInput/errors"
 import { RemoveExtraRooms } from "../RemoveExtraRooms/RemoveExtraRooms"
 import { isMultiRoomError } from "../utils"
@@ -28,7 +26,6 @@ import type { BookingWidgetSchema } from "../../../Client"
 export default function RewardNight() {
   const intl = useIntl()
   const config = useBookingFlowConfig()
-  const isPartnerSas = useIsPartner(ScandicPartnersEnum.sas)
   const {
     setValue,
     getValues,
@@ -36,22 +33,9 @@ export default function RewardNight() {
     trigger,
   } = useFormContext<BookingWidgetSchema>()
   const ref = useRef<HTMLDivElement | null>(null)
-  const reward = isPartnerSas
-    ? intl.formatMessage({
-        defaultMessage: "EuroBonus Points",
-      })
-    : intl.formatMessage({
-        defaultMessage: "Reward Night",
-      })
-  const rewardNightTooltip = isPartnerSas
-    ? intl.formatMessage({
-        defaultMessage:
-          "To book with EuroBonus points, make sure you're logged into your SAS EuroBonus account.",
-      })
-    : intl.formatMessage({
-        defaultMessage:
-          "To book a reward night, make sure you're logged in to your Scandic Friends account.",
-      })
+  const reward = getRewardMessage(config, intl)
+  const rewardNightTooltip = getRewardNightTooltipMessage(config, intl)
+
   const redemptionErr = errors[SEARCH_TYPE_REDEMPTION]
   const isDesktop = useMediaQuery("(min-width: 767px)")
 
@@ -149,7 +133,7 @@ export default function RewardNight() {
                 className={styles.errorIcon}
                 isFilled={!isDesktop}
               />
-              {getErrorMessage(intl, redemptionErr.message, config.partner)}
+              {getErrorMessage(intl, config.variant, redemptionErr.message)}
             </span>
           </Typography>
           {isMultiRoomError(redemptionErr.message) ? (
@@ -162,3 +146,42 @@ export default function RewardNight() {
     </div>
   )
 }
+
+function getRewardMessage(config: BookingFlowConfig, intl: IntlShape): string {
+  if (!bookingFlowVariants.includes(config.variant)) {
+    throw new Error("Unknown booking flow variant")
+  }
+
+  switch (config.variant) {
+    case "partner-sas":
+      return intl.formatMessage({
+        defaultMessage: "EuroBonus Points",
+      })
+    case "scandic":
+      return intl.formatMessage({
+        defaultMessage: "Reward Night",
+      })
+  }
+}
+
+function getRewardNightTooltipMessage(
+  config: BookingFlowConfig,
+  intl: IntlShape
+): string {
+  if (!bookingFlowVariants.includes(config.variant)) {
+    throw new Error("Unknown booking flow variant")
+  }
+
+  switch (config.variant) {
+    case "partner-sas":
+      return intl.formatMessage({
+        defaultMessage:
+          "To book with EuroBonus points, make sure you're logged into your SAS EuroBonus account.",
+      })
+    case "scandic":
+      return intl.formatMessage({
+        defaultMessage:
+          "To book a reward night, make sure you're logged in to your Scandic Friends account.",
+      })
+  }
+}