Function UserModal

apps/web/ui/UserModal/index.tsx:15–36

({
  open,
  close,
  user,
  isUserActive,
  children,
}: Props)

}

export default function UserModal({
  open,
  close,
  user,
  isUserActive,
  children,
}: Props) {
  return (
    <Modal open={open} close={close}>
      <div className={styles.container}>
        <Avatar src={user.profileImageUrl} text={user.displayName} size="xl" />
        <div className={styles.header}>
          <div className={styles.title}>
            <div className={styles.username}>{user.displayName}</div>
            <div className={styles.role}>{user.role}</div>
          </div>
        </div>
        {children && <div className={styles.content}>{children}</div>}
      </div>
    </Modal>
  );
}