render()

in public/pages/CreateMonitor/containers/AnomalyDetectors/AnomalyDetectors.js [73:124]

• 51 lines of code
• 4 McCabe index (conditional complexity)

  render() {
    const { detectorOptions } = this.state;
    const { values, detectorId } = this.props;
    //Default to empty
    let selectedOptions = [];
    if (detectorOptions.length > 0) {
      const adId = values.detectorId ? values.detectorId : detectorId;
      const selectedValue = detectorOptions.find((detector) => adId === detector.value);
      if (selectedValue) {
        selectedOptions = [selectedValue];
      }
    }
    return (
      <div
        style={{
          maxWidth: '390px',
        }}
      >
        <FormikComboBox
          name={'detectorId'}
          formRow
          rowProps={{
            label: 'Detector',
            isInvalid,
            error: hasError,
          }}
          fieldProps={{
            validate: (value) => validateDetector(value, selectedOptions[0]),
          }}
          inputProps={{
            placeholder: 'Select a detector',
            options: detectorOptions,
            onBlur: (e, field, form) => {
              form.setFieldTouched('detectorId', true);
            },
            onChange: (options, field, form) => {
              form.setFieldError('detectorId', undefined);
              form.setFieldValue('detectorId', get(options, '0.value', ''));
              form.setFieldValue('period', {
                interval: 2 * get(options, '0.interval.period.interval'),
                unit: get(options, '0.interval.period.unit', 'MINUTES').toUpperCase(),
              });
              form.setFieldValue('adResultIndex', get(options, '0.resultIndex'));
            },
            singleSelection: { asPlaintext: true },
            isClearable: false,
            selectedOptions,
          }}
        />
      </div>
    );
  }