This repository has been archived on 2024-10-29. You can view files and clone it, but cannot push or open issues or pull requests.
website/components/Application/Members/Member.tsx

49 lines
1.4 KiB
TypeScript
Raw Normal View History

import { memo } from "react"
import Image from "next/image"
import Link from "next/link"
import type { MemberWithPublicUser } from "../../../models/Member"
import { Emoji } from "../../Emoji"
export interface MemberProps {
member: MemberWithPublicUser
}
2022-08-30 21:30:06 +02:00
const MemberMemo: React.FC<MemberProps> = (props) => {
const { member } = props
return (
<Link href={`/application/users/${member.user.id}`}>
<div className="flex cursor-pointer items-center overflow-hidden px-6 py-2 pr-10 hover:bg-gray-300 dark:hover:bg-gray-900">
<div className="flex min-w-[50px] rounded-full">
2022-12-13 11:38:07 +01:00
<Image
src={
member.user.logo == null
? "/images/data/user-default.png"
2022-12-13 11:38:07 +01:00
: member.user.logo
}
alt={"Users's profil picture"}
height={50}
width={50}
draggable={false}
className="rounded-full"
2022-12-13 11:38:07 +01:00
/>
</div>
<div className="ml-5">
<p data-cy="member-user-name" className="flex truncate font-bold">
2022-12-13 11:38:07 +01:00
{member.user.name}
{member.isOwner && (
<span className="ml-4">
<Emoji value=":crown:" size={18} />
2022-12-13 11:38:07 +01:00
</span>
)}
</p>
{member.user.status != null && member.user.status}
</div>
</div>
</Link>
)
}
2022-08-30 21:30:06 +02:00
export const Member = memo(MemberMemo)