render()

in frontend/src/components/dropdown.js [55:122]

• 68 lines of code
• 10 McCabe index (conditional complexity)

  render() {
    return (
      <div
        className={`db tl mt1 ba b--grey-light br1 absolute shadow-1 z-5 flex flex-column${
          this.props.toTop ? ' bottom-3' : ''
        }${this.props.options.length > 9 ? ' h5 overflow-y-scroll' : ''}`}
      >
        {this.props.options.map((i, k) => (
          <span
            key={k}
            onClick={this.handleClick.bind(null, i)}
            className="pa3 nowrap bg-animate bg-white hover-bg-tan"
          >
            {this.props.multi && (
              <input
                data-label={i.label}
                data-payload={JSON.stringify(i)}
                type="checkbox"
                checked={this.isActive(i)}
                value={i.label}
                className="mr2"
              />
            )}
            {i.href ? (
              i.internalLink ? (
                <>
                  {i.label}
                  {this.isActive(i) && <CheckIcon className="red pl4" />}
                </>
              ) : (
                <a
                  target={'_blank'}
                  href={i.href}
                  onClick={this.props.toggleDropdown}
                  rel="noopener noreferrer"
                  className="link blue-grey"
                >
                  {i.label}
                  {this.isActive(i) && <CheckIcon className="primary pl4" />}
                </a>
              )
            ) : (
              <span onClick={this.props.toggleDropdown}>
                {i.label}
                {this.isActive(i) && (
                  <span className="primary pl4">
                    <CheckIcon />
                  </span>
                )}
              </span>
            )}
            {this.props.deletable && (
              <span
                onClick={(e) => {
                  e.preventDefault();
                  e.stopPropagation();
                  this.props.toggleDropdown();
                  this.props.deletable(i.value);
                }}
              >
                x
              </span>
            )}
          </span>
        ))}
      </div>
    );
  }