Files
web/components/MyPages/Blocks/Overview/Friend/index.tsx
Christel Westerberg 4233ecae42 fix: update ui
2024-06-19 16:15:33 +02:00

48 lines
1.5 KiB
TypeScript

import { membershipLevels } from "@/constants/membershipLevels"
import BiroScript from "@/components/TempDesignSystem/Text/BiroScript"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Title from "@/components/TempDesignSystem/Text/Title"
import { getIntl } from "@/i18n"
import { getMembership } from "@/utils/user"
import MembershipLevel from "./MemberShipLevel"
import styles from "./friend.module.css"
import type { UserProps } from "@/types/components/myPages/user"
export default async function Friend({ user }: UserProps) {
const { formatMessage } = await getIntl()
const membership = getMembership(user.memberships)
if (!membership?.membershipLevel) {
return null
}
return (
<section className={styles.friend}>
<header className={styles.header}>
<BiroScript className={styles.levelLabel} color="pale">
{formatMessage({ id: "Current level" })}:
</BiroScript>
{membership ? (
<MembershipLevel
level={membershipLevels[membership.membershipLevel]}
/>
) : null}
</header>
<div className={styles.membership}>
<Title className={styles.name} color="pale" level="h3">
{user.name}
</Title>
<div className={styles.membershipContainer}>
<Caption color="pale">
{formatMessage({ id: "Membership ID" })}:{" "}
{membership ? membership.membershipNumber : "N/A"}
</Caption>
</div>
</div>
</section>
)
}