feat: SW-2028 Points validation redemption city search

apps/scandic-web/components/HotelReservation/HotelCard/index.tsx

@@ -18,6 +18,7 @@ import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
+import { Tooltip } from "@/components/TempDesignSystem/Tooltip"
 import { mapApiImagesToGalleryImages } from "@/utils/imageGallery"
 import { getSingleDecimal } from "@/utils/numberFormatting"
 
@@ -43,6 +44,7 @@ function HotelCard({
   state = "default",
   type = HotelCardListingTypeEnum.PageListing,
   bookingCode = "",
+  userPoints,
 }: HotelCardProps) {
   const params = useParams()
   const lang = params.lang as Lang
@@ -72,6 +74,15 @@ function HotelCard({
     availability.productType?.member?.rateType === RateTypeEnum.Regular
   const price = availability.productType
 
+  const userHasEnoughPoints =
+    userPoints !== undefined
+      ? !!price?.redemptions?.some(
+          (r) => r.localPrice.pointsPerStay < userPoints
+        )
+      : false
+
+  const notEnoughPointsLabel = intl.formatMessage({ id: "Not enough points" })
+
   return (
     <article
       className={classNames}
@@ -207,21 +218,39 @@ function HotelCard({
                   ))}
                 </div>
               ) : null}
-              <Button
-                asChild
-                theme="base"
-                intent="primary"
-                size="small"
-                className={styles.button}
-              >
-                <Link
-                  href={`${selectRate(lang)}?hotel=${hotel.operaId}`}
-                  color="none"
-                  keepSearchParams
+              {userPoints !== undefined && !userHasEnoughPoints ? (
+                <Tooltip
+                  arrow="left"
+                  position="bottom"
+                  text={notEnoughPointsLabel}
                 >
-                  {intl.formatMessage({ id: "See rooms" })}
-                </Link>
-              </Button>
+                  <Button
+                    theme="base"
+                    intent="primary"
+                    size="small"
+                    className={styles.button}
+                    disabled
+                  >
+                    {notEnoughPointsLabel}
+                  </Button>
+                </Tooltip>
+              ) : (
+                <Button
+                  asChild
+                  theme="base"
+                  intent="primary"
+                  size="small"
+                  className={styles.button}
+                >
+                  <Link
+                    href={`${selectRate(lang)}?hotel=${hotel.operaId}`}
+                    color="none"
+                    keepSearchParams
+                  >
+                    {intl.formatMessage({ id: "See rooms" })}
+                  </Link>
+                </Button>
+              )}
             </>
           )}
         </div>