Files
web/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/ActiveRedeemedBadge.tsx

37 lines
827 B
TypeScript

"use client"
import { motion } from "framer-motion"
import { useIntl } from "react-intl"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import styles from "./redeem.module.css"
export default function ActiveRedeemedBadge() {
const intl = useIntl()
return (
<div className={styles.redeemed}>
<motion.div
animate={{
opacity: [1, 0.4, 1],
}}
transition={{
duration: 2,
repeat: Infinity,
ease: "easeInOut",
}}
>
<MaterialIcon icon="check_circle" color="Icon/Feedback/Success" />
</motion.div>
<Caption>
{intl.formatMessage({
defaultMessage: "Active",
})}
</Caption>
</div>
)
}