function FilterValue()

in public/pages/DefineDetector/components/DataFilterList/components/FilterValue.tsx [36:141]
106 lines of code
4 McCabe index (conditional complexity)

function FilterValue(props: FilterValueProps) {
  if (props.dataType === DATA_TYPES.NUMBER) {
    if (isRangeOperator(props.operator)) {
      return (
        <EuiFlexGroup alignItems="center">
          <EuiFlexItem>
            <Field
              name={`filters.${props.index}.fieldRangeStart`}
              validate={(val: number | string) =>
                validateStart(
                  val,
                  get(props, 'filterValues.fieldRangeEnd', undefined)
                )
              }
            >
              {({ field, form }: FieldProps) => (
                <EuiFormRow
                  label="From"
                  isInvalid={isInvalid(field.name, form)}
                  error={getError(field.name, form)}
                >
                  <EuiFieldNumber
                    {...field}
                    isInvalid={isInvalid(field.name, form)}
                  />
                </EuiFormRow>
              )}
            </Field>
          </EuiFlexItem>
          <EuiFlexItem>
            <Field
              name={`filters.${props.index}.fieldRangeEnd`}
              validate={(val: number | string) =>
                validateEnd(
                  val,
                  get(props, 'filterValues.fieldRangeStart', undefined)
                )
              }
            >
              {({ field, form }: FieldProps) => (
                <EuiFormRow
                  label="To"
                  isInvalid={isInvalid(field.name, form)}
                  error={getError(field.name, form)}
                >
                  <EuiFieldNumber
                    {...field}
                    isInvalid={isInvalid(field.name, form)}
                    onBlur={() => {
                      form.setFieldTouched(`filters.${props.index}.fieldValue`);
                    }}
                  />
                </EuiFormRow>
              )}
            </Field>
          </EuiFlexItem>
        </EuiFlexGroup>
      );
    } else {
      return (
        <Field name={`filters.${props.index}.fieldValue`} validate={required}>
          {({ field, form }: FieldProps) => (
            <EuiFormRow
              label="Value"
              isInvalid={isInvalid(field.name, form)}
              error={getError(field.name, form)}
            >
              <EuiFieldNumber
                {...field}
                isInvalid={isInvalid(field.name, form)}
              />
            </EuiFormRow>
          )}
        </Field>
      );
    }
  } else if (props.dataType == DATA_TYPES.BOOLEAN) {
    return (
      <Field name={`filters.${props.index}.fieldValue`} validate={required}>
        {({ field, form }: FieldProps) => (
          <EuiFormRow
            label="Value"
            isInvalid={isInvalid(field.name, form)}
            error={getError(field.name, form)}
          >
            <EuiSelect
              {...field}
              options={WHERE_BOOLEAN_FILTERS}
              isInvalid={isInvalid(field.name, form)}
            />
          </EuiFormRow>
        )}
      </Field>
    );
  } else {
    return (
      <Field name={`filters.${props.index}.fieldValue`} validate={required}>
        {({ field, form }: FieldProps) => (
          <EuiFormRow label="Value">
            <EuiFieldText {...field} isInvalid={isInvalid(field.name, form)} />
          </EuiFormRow>
        )}
      </Field>
    );
  }
}