Merged in fix/LOY-369-Redeem-tier-rewards (pull request #2822)

fix(LOY-369): Able to redeem tier rewards

* fix(LOY-369): able to redeem on site tier rewards

* fix(LOY-369): single mutation call

* fix(LOY-369): apply coupon check for all tier rewards


Approved-by: Linus Flood
Approved-by: Matilda Landström

apps/scandic-web/components/Blocks/DynamicContent/Rewards/CurrentRewards/Client.tsx

@@ -2,7 +2,7 @@
 
 import { useRef, useState } from "react"
 
-import Title from "@scandic-hotels/design-system/Title"
+import { Typography } from "@scandic-hotels/design-system/Typography"
 import { trpc } from "@scandic-hotels/trpc/client"
 import { type Reward } from "@scandic-hotels/trpc/types/rewards"
 
@@ -75,14 +75,9 @@ export default function ClientCurrentRewards({
               <div className={styles.content}>
                 <RewardIcon rewardId={reward.reward_id} />
                 {showRedeem && <ScriptedRewardText reward={reward} />}
-                <Title
-                  as="h4"
-                  level="h3"
-                  textAlign="center"
-                  textTransform="regular"
-                >
-                  {reward.label}
-                </Title>
+                <Typography variant="Title/smLowCase">
+                  <h4 className={styles.title}>{reward.label}</h4>
+                </Typography>
                 {earliestExpirationDate ? (
                   <ExpirationDate expirationDate={earliestExpirationDate} />
                 ) : null}

apps/scandic-web/components/Blocks/DynamicContent/Rewards/CurrentRewards/current.module.css

@@ -24,6 +24,11 @@
   padding: var(--Spacing-x3);
 }
 
+.title {
+  color: var(--Text-Heading);
+  text-align: center;
+}
+
 .btnContainer {
   padding: 0 var(--Spacing-x3) var(--Spacing-x3);
 }