fix: replace temp design system components with design system package in surprises

This commit is contained in:
Christian Andolf
2025-05-21 16:34:56 +02:00
parent dfac13f9ad
commit 76994f6e01
7 changed files with 113 additions and 86 deletions

View File

@@ -1,11 +1,12 @@
import { useIntl } from "react-intl"
import Button from "@/components/TempDesignSystem/Button"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import { Button } from "@scandic-hotels/design-system/Button"
import { Typography } from "@scandic-hotels/design-system/Typography"
import Card from "./Card"
import styles from "./surprises.module.css"
import type { InitialProps } from "@/types/components/blocks/surprises"
export default function Initial({ totalSurprises, onOpen }: InitialProps) {
@@ -17,43 +18,47 @@ export default function Initial({ totalSurprises, onOpen }: InitialProps) {
defaultMessage: "Surprise!",
})}
>
<Body textAlign="center">
{totalSurprises > 1 ? (
<>
{intl.formatMessage(
{
defaultMessage:
"You have <b>{amount}</b> gifts waiting for you!",
},
{
amount: totalSurprises,
b: (str) => <b>{str}</b>,
}
)}
<br />
{intl.formatMessage({
defaultMessage: "Hurry up and use them before they expire!",
})}
</>
) : (
intl.formatMessage({
defaultMessage: "We have a special gift waiting for you!",
})
)}
</Body>
<Caption>
{intl.formatMessage({
defaultMessage: "You'll find all your gifts in 'My benefits'",
})}
</Caption>
<Typography variant="Body/Paragraph/mdRegular">
<p className={styles.textCenter}>
{totalSurprises > 1 ? (
<>
{intl.formatMessage(
{
defaultMessage:
"You have <b>{amount}</b> gifts waiting for you!",
},
{
amount: totalSurprises,
b: (str) => <b>{str}</b>,
}
)}
<br />
{intl.formatMessage({
defaultMessage: "Hurry up and use them before they expire!",
})}
</>
) : (
intl.formatMessage({
defaultMessage: "We have a special gift waiting for you!",
})
)}
</p>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<p>
{intl.formatMessage({
defaultMessage: "You'll find all your gifts in 'My benefits'",
})}
</p>
</Typography>
<Button
intent="primary"
variant="Primary"
onPress={onOpen}
size="medium"
theme="base"
fullWidth
size="Medium"
autoFocus
typography="Body/Paragraph/mdBold"
className={styles.widthFull}
>
{intl.formatMessage(
{