feat(LOY-63): add promo code badge to campaign redeem

2025-01-08 16:05:07 +01:00
parent 6941c1d006
commit 9452f24df9
4 changed files with 15 additions and 14 deletions
@@ -5,23 +5,17 @@ import { useIntl } from "react-intl"
 import CopyIcon from "@/components/Icons/Copy"
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
+import Caption from "@/components/TempDesignSystem/Text/Caption"
 import Title from "@/components/TempDesignSystem/Text/Title"
 import { toast } from "@/components/TempDesignSystem/Toasts"

 import { RewardIcon } from "../../RewardIcon"
-import MembershipNumberBadge from "../MembershipNumberBadge"

 import styles from "../redeem.module.css"

 import type { RewardWithRedeem } from "@/server/routers/contentstack/reward/output"

-export default function Campaign({
-  reward,
-  membershipNumber,
-}: {
-  reward: RewardWithRedeem
-  membershipNumber: string
-}) {
+export default function Campaign({ reward }: { reward: RewardWithRedeem }) {
  const intl = useIntl()

  function handleCopy() {
@@ -37,9 +31,14 @@ export default function Campaign({
          {reward.label}
        </Title>
        <Body textAlign="center">{reward.description}</Body>
-        {membershipNumber && (
-          <MembershipNumberBadge membershipNumber={membershipNumber} />
-        )}
+        <div className={styles.rewardBadge}>
+          <Caption textAlign="center" color="uiTextHighContrast" type="bold">
+            {intl.formatMessage({ id: "Promo code" })}
+          </Caption>
+          <Caption textAlign="center" color="uiTextHighContrast">
+            {reward.operaRewardId}
+          </Caption>
+        </div>
      </div>
      <footer className={styles.modalFooter}>
        <Button