renderWorkTypes()

in src/app/work-items-edit-form.js [299:350]
29 lines of code
6 McCabe index (conditional complexity)

  renderWorkTypes() {
    const {allWorkTypes} = this.state;

    const toSelectItemShort = it => it && {
      id: it.id,
      key: it.id,
      label: it.name,
      model: it,
      description: it.description
    };

    let selectedWorkTypes = filter.workTypes || [];
    if (filter.withoutWorkType) {
      selectedWorkTypes = selectedWorkTypes.concat([WorkItemsEditForm.getWithoutTypeOption()]);
    }

    const placeholder = filter.workTypes.length ? i18n('Add work type') : i18n('All work types');

    return (
      <div className="ring-form__group">
        <TagsInput
          tags={(selectedWorkTypes || []).map(toSelectItemShort)}
          maxPopupHeight={150}
          dataSource={getWorkItemsOptions}
          onAddTag={this.onAddWorkType}
          onRemoveTag={this.onRemoveWorkType}
          filter={{fn: saveClearOptionAtTheTop}}
          placeholder={placeholder}
          disabled={!this.props.editable}
        />
      </div>
    );

    function getWorkItemsOptions() {
      const options = [];
      if ((filter.workTypes || []).length || filter.withoutWorkType) {
        options.push(WorkItemsEditForm.getAllTypesOption());
        options.push({
          rgItemType: List.ListProps.Type.SEPARATOR
        });
      }
      if (!filter.withoutWorkType) {
        options.push(WorkItemsEditForm.getWithoutTypeOption());
      }
      return options.concat((allWorkTypes || []).map(toSelectItemShort));
    }

    function saveClearOptionAtTheTop(tag, query) {
      return tag.id === WorkItemsEditForm.getAllTypesOption().id ||
        !tag.label || !query || tag.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
    }
  }