Merged in fix/SW-933-incorrect-ratecode (pull request #947)

Fix/SW-933 incorrect ratecode when creating booking as a member

* fix(SW-933): Added check if member to select correct rate code in create booking

* fix(SW-933): set member price in summary when "join" is true

* fix(SW-933): change "price" -> "amount" and fix bool expression

* fix(SW-933): added check for membership number in summary


Approved-by: Christel Westerberg

components/HotelReservation/EnterDetails/Payment/index.tsx

@@ -51,6 +51,7 @@ function isPaymentMethodEnum(value: string): value is PaymentMethodEnum {
 }
 
 export default function Payment({
+  user,
   roomPrice,
   otherPaymentOptions,
   savedCreditCards,
@@ -185,7 +186,8 @@ export default function Payment({
           age: child.age,
           bedType: bedTypeMap[parseInt(child.bed.toString())],
         })),
-        rateCode: room.rateCode,
+        rateCode:
+          user || join || membershipNo ? room.counterRateCode : room.rateCode,
         roomTypeCode: bedType!.roomTypeCode, // A selection has been made in order to get to this step.
         guest: {
           title: "",

components/HotelReservation/EnterDetails/Summary/BottomSheet/index.tsx

@@ -38,7 +38,7 @@ export function SummaryBottomSheet({ children }: PropsWithChildren) {
             {intl.formatMessage(
               { id: "{amount} {currency}" },
               {
-                amount: intl.formatNumber(totalPrice.local.price),
+                amount: intl.formatNumber(totalPrice.local.amount),
                 currency: totalPrice.local.currency,
               }
             )}

components/HotelReservation/EnterDetails/Summary/index.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { useEffect, useState } from "react"
+import { useEffect, useRef, useState } from "react"
 import { ChevronDown } from "react-feather"
 import { useIntl } from "react-intl"
 
@@ -33,6 +33,8 @@ function storeSelector(state: DetailsState) {
     toggleSummaryOpen: state.actions.toggleSummaryOpen,
     setTotalPrice: state.actions.setTotalPrice,
     totalPrice: state.totalPrice,
+    join: state.data.join,
+    membershipNo: state.data.membershipNo,
   }
 }
 
@@ -51,6 +53,8 @@ export default function Summary({ showMemberPrice, room }: SummaryProps) {
     toDate,
     toggleSummaryOpen,
     totalPrice,
+    join,
+    membershipNo,
   } = useDetailsStore(storeSelector)
 
   const diff = dt(toDate).diff(fromDate, "days")
@@ -60,10 +64,8 @@ export default function Summary({ showMemberPrice, room }: SummaryProps) {
     { totalNights: diff }
   )
 
-  let color: "uiTextHighContrast" | "red" = "uiTextHighContrast"
-  if (showMemberPrice) {
-    color = "red"
-  }
+  const color = useRef<"uiTextHighContrast" | "red">("uiTextHighContrast")
+  const [price, setPrice] = useState(room.prices.public)
 
   const additionalPackageCost = room.packages?.reduce(
     (acc, curr) => {
@@ -74,11 +76,23 @@ export default function Summary({ showMemberPrice, room }: SummaryProps) {
     { local: 0, euro: 0 }
   ) || { local: 0, euro: 0 }
 
-  const roomsPriceLocal = room.localPrice.price + additionalPackageCost.local
-  const roomsPriceEuro = room.euroPrice
-    ? room.euroPrice.price + additionalPackageCost.euro
+  const roomsPriceLocal = price.local.amount + additionalPackageCost.local
+  const roomsPriceEuro = price.euro
+    ? price.euro.amount + additionalPackageCost.euro
     : undefined
 
+  useEffect(() => {
+    if (showMemberPrice || join || membershipNo) {
+      color.current = "red"
+      if (room.prices.member) {
+        setPrice(room.prices.member)
+      }
+    } else {
+      color.current = "uiTextHighContrast"
+      setPrice(room.prices.public)
+    }
+  }, [showMemberPrice, join, membershipNo, room.prices])
+
   useEffect(() => {
     setChosenBed(bedType)
 
@@ -87,30 +101,30 @@ export default function Summary({ showMemberPrice, room }: SummaryProps) {
       if (breakfast === false) {
         setTotalPrice({
           local: {
-            price: roomsPriceLocal,
-            currency: room.localPrice.currency,
+            amount: roomsPriceLocal,
+            currency: price.local.currency,
           },
           euro:
-            room.euroPrice && roomsPriceEuro
+            price.euro && roomsPriceEuro
               ? {
-                  price: roomsPriceEuro,
-                  currency: room.euroPrice.currency,
+                  amount: roomsPriceEuro,
+                  currency: price.euro.currency,
                 }
               : undefined,
         })
       } else {
         setTotalPrice({
           local: {
-            price: roomsPriceLocal + parseInt(breakfast.localPrice.totalPrice),
-            currency: room.localPrice.currency,
+            amount: roomsPriceLocal + parseInt(breakfast.localPrice.totalPrice),
+            currency: price.local.currency,
           },
           euro:
-            room.euroPrice && roomsPriceEuro
+            price.euro && roomsPriceEuro
               ? {
-                  price:
+                  amount:
                     roomsPriceEuro +
                     parseInt(breakfast.requestedPrice.totalPrice),
-                  currency: room.euroPrice.currency,
+                  currency: price.euro.currency,
                 }
               : undefined,
         })
@@ -120,8 +134,8 @@ export default function Summary({ showMemberPrice, room }: SummaryProps) {
     bedType,
     breakfast,
     roomsPriceLocal,
-    room.localPrice.currency,
-    room.euroPrice,
+    price.local.currency,
+    price.euro,
     roomsPriceEuro,
     setTotalPrice,
   ])
@@ -151,12 +165,12 @@ export default function Summary({ showMemberPrice, room }: SummaryProps) {
         <div>
           <div className={styles.entry}>
             <Body color="uiTextHighContrast">{room.roomType}</Body>
-            <Caption color={color}>
+            <Caption color={color.current}>
               {intl.formatMessage(
                 { id: "{amount} {currency}" },
                 {
-                  amount: intl.formatNumber(room.localPrice.price),
-                  currency: room.localPrice.currency,
+                  amount: intl.formatNumber(price.local.amount),
+                  currency: price.local.currency,
                 }
               )}
             </Caption>
@@ -229,7 +243,7 @@ export default function Summary({ showMemberPrice, room }: SummaryProps) {
             <Caption color="uiTextHighContrast">
               {intl.formatMessage(
                 { id: "{amount} {currency}" },
-                { amount: "0", currency: room.localPrice.currency }
+                { amount: "0", currency: price.local.currency }
               )}
             </Caption>
           </div>
@@ -243,7 +257,7 @@ export default function Summary({ showMemberPrice, room }: SummaryProps) {
             <Caption color="uiTextMediumContrast">
               {intl.formatMessage(
                 { id: "{amount} {currency}" },
-                { amount: "0", currency: room.localPrice.currency }
+                { amount: "0", currency: price.local.currency }
               )}
             </Caption>
           </div>
@@ -279,22 +293,24 @@ export default function Summary({ showMemberPrice, room }: SummaryProps) {
             </Link>
           </div>
           <div>
-            <Body textTransform="bold">
-              {intl.formatMessage(
-                { id: "{amount} {currency}" },
-                {
-                  amount: intl.formatNumber(totalPrice.local.price),
-                  currency: totalPrice.local.currency,
-                }
-              )}
-            </Body>
-            {totalPrice.euro && (
+            {totalPrice.local.amount > 0 && (
+              <Body textTransform="bold">
+                {intl.formatMessage(
+                  { id: "{amount} {currency}" },
+                  {
+                    amount: intl.formatNumber(totalPrice.local.amount),
+                    currency: totalPrice.local.currency,
+                  }
+                )}
+              </Body>
+            )}
+            {totalPrice.euro && totalPrice.euro.amount > 0 && (
               <Caption color="uiTextMediumContrast">
                 {intl.formatMessage({ id: "Approx." })}{" "}
                 {intl.formatMessage(
                   { id: "{amount} {currency}" },
                   {
-                    amount: intl.formatNumber(totalPrice.euro.price),
+                    amount: intl.formatNumber(totalPrice.euro.amount),
                     currency: totalPrice.euro.currency,
                   }
                 )}