cleanup profile page html to be valid replace old temp design system components with new ones divider is now correctly an hr element less section elements to be valid html
39 lines
1.2 KiB
TypeScript
39 lines
1.2 KiB
TypeScript
import { Typography } from "@scandic-hotels/design-system/Typography"
|
|
|
|
import { serverClient } from "@/lib/trpc/server"
|
|
|
|
import AddCreditCardButton from "@/components/Profile/AddCreditCardButton"
|
|
import CreditCardList from "@/components/Profile/CreditCardList"
|
|
import { getIntl } from "@/i18n"
|
|
|
|
import styles from "./creditCards.module.css"
|
|
|
|
export default async function CreditCardSlot() {
|
|
const intl = await getIntl()
|
|
const creditCards = await serverClient().user.creditCards()
|
|
|
|
return (
|
|
<section className={styles.container}>
|
|
<div className={styles.content}>
|
|
<Typography variant="Title/Subtitle/md">
|
|
<h3>
|
|
{intl.formatMessage({
|
|
defaultMessage: "My payment cards",
|
|
})}
|
|
</h3>
|
|
</Typography>
|
|
<Typography variant="Body/Paragraph/mdRegular">
|
|
<p>
|
|
{intl.formatMessage({
|
|
defaultMessage:
|
|
"Check out the credit cards saved to your profile. Pay with a saved card when signed in for a smoother web experience.",
|
|
})}
|
|
</p>
|
|
</Typography>
|
|
</div>
|
|
<CreditCardList initialData={creditCards} />
|
|
<AddCreditCardButton />
|
|
</section>
|
|
)
|
|
}
|