import Image from "@/components/Image"

import styles from "./friend.module.css"

import type { FriendProps } from "@/types/components/myPages/myPage/friend"

export default function Friend({ user }: FriendProps) {
  return (
    <section className={styles.friend}>
      <p className={styles.level}>Current level:</p>
      <Image
        alt="Good Friend"
        className={styles.image}
        height={70}
        src="/_static/icons/good-friend.svg"
        width={228}
      />
      <h3 className={styles.name}>{user.name}</h3>
      <div className={styles.membershipContainer}>
        <p className={styles.membershipId}>
          {user.membership ? user.membership.membershipNumber : "N/A"}
        </p>
      </div>
    </section>
  )
}
