Files
web/apps/scandic-web/components/Profile/CreditCardRow/index.tsx
Anton Gunnarsson 75a377b59e Merged in chore/sw-3145-move-body (pull request #2505)
chore(SW-3145): Move Body component to design-system

* Move Body component to design-system


Approved-by: Joakim Jäderberg
2025-07-03 08:04:36 +00:00

23 lines
850 B
TypeScript

import Body from "@scandic-hotels/design-system/Body"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import DeleteCreditCardConfirmation from "../DeleteCreditCardConfirmation"
import styles from "./creditCardRow.module.css"
import type { CreditCardRowProps } from "@/types/components/myPages/myProfile/creditCards"
export default function CreditCardRow({ card }: CreditCardRowProps) {
const maskedCardNumber = `**** ${card.truncatedNumber.slice(-4)}`
return (
<div className={styles.card}>
<MaterialIcon icon="credit_card" color="Icon/Intense" />
<Body textTransform="bold">{card.type}</Body>
<Caption color="textMediumContrast">{maskedCardNumber}</Caption>
<DeleteCreditCardConfirmation card={card} />
</div>
)
}