render()

in src/user-card/card.tsx [60:133]
72 lines of code
11 McCabe index (conditional complexity)

  render() {
    const {children, info, className, user, avatarInfo, ...restProps} = this.props;
    const {translate} = this.context;
    const translations = this.props.translations;

    const classes = classNames(className, {});
    const userActiveStatusClasses = classNames(styles.userActiveStatus, user.online ? styles.online : '');

    return (
      <div {...restProps} className={classes}>
        <div className={styles.userInformationContainer}>
          <div className={styles.userAvatar}>
            <Avatar size={AvatarSize.Size56} url={user.avatarUrl} username={user.name} round />
            {!!avatarInfo && avatarInfo}
          </div>
          <div className={styles.userInformation}>
            <div className={styles.userInformationGeneral}>
              <div className={styles.userNameLine}>
                {user.href && (
                  <Link href={user.href} className={styles.userName} data-test='user-card-link'>
                    {user.name}
                  </Link>
                )}
                {!user.href && <span className={styles.userName}>{user.name}</span>}
                {typeof user.online === 'boolean' && (
                  <span
                    className={userActiveStatusClasses}
                    title={
                      user.online
                        ? (translations?.online ?? translate('online'))
                        : (translations?.offline ?? translate('offline'))
                    }
                  />
                )}
                {!!info && <span className={styles.userNameInfo}>{info}</span>}
                {user.banned && (
                  <Tooltip title={user.banReason}>
                    <Tag tagType={TagType.ERROR}>{translations?.banned ?? translate('banned')}</Tag>
                  </Tooltip>
                )}
              </div>
              <div className={styles.userLogin}>{user.login}</div>
              {user.email && (
                <span className={styles.userEmailWrapper}>
                  <Link
                    href={`mailto:${user.email}`}
                    title={`mailto:${user.email}`}
                    target='_blank'
                    className={styles.userEmail}
                  >
                    {user.email}
                  </Link>
                  {user.unverifiedEmail && (
                    <span className={styles.unverifiedLabel}>
                      {translations?.unverified ?? translate('unverified')}
                    </span>
                  )}
                  <Icon
                    title={translations?.copyToClipboard ?? translate('copyToClipboard')}
                    className={styles.userCopyIcon}
                    onClick={this.copyEmail}
                    glyph={copyIcon}
                    size={IconSize.Size14}
                    suppressSizeWarning
                  />
                </span>
              )}
            </div>
            {children}
          </div>
        </div>
      </div>
    );
  }