renderPrefBranch()

in experimenter/experimenter/legacy/legacy-ui/core/js/components/Pref.js [95:166]

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

  renderPrefBranch() {
    return (
      <Container>
        <Row>
          <Col lg={4}>{this.renderPrefBranchInput()}</Col>
          <Col lg={8}>
            <DesignInput
              label="Pref Name"
              name="pref_name"
              id={`pref-key-${this.props.variantIndex}-${this.props.index}`}
              onChange={(value) => {
                this.handlePrefValueChange("pref_name", value);
              }}
              value={
                this.props.preference
                  ? this.props.preference.get("pref_name")
                  : null
              }
              error={this.props.errors.get("pref_name", null)}
              helpContent={PREF_NAME_HELP}
              labelColumnWidth={2}
            />
          </Col>
        </Row>
        <Row>
          <Col lg={4}>
            <DesignInput
              label="Pref Type"
              name="pref_type"
              id={`pref-type-${this.props.variantIndex}-${this.props.index}`}
              onChange={(value) => {
                this.handlePrefValueChange("pref_type", value);
              }}
              value={
                this.props.preference
                  ? this.props.preference.get("pref_type")
                  : null
              }
              error={this.props.errors.get("pref_type", null)}
              as="select"
              helpContent={PREF_TYPE_HELP}
              labelColumnWidth={5}
            >
              <option>Firefox Pref Type</option>
              <option>boolean</option>
              <option>integer</option>
              <option>string</option>
              <option>json string</option>
            </DesignInput>
          </Col>
          <Col lg={8}>
            <DesignInput
              label="Pref Value"
              name="pref_value"
              id={`pref-value-${this.props.variantIndex}-${this.props.index}`}
              onChange={(value) => {
                this.handlePrefValueChange("pref_value", value);
              }}
              value={
                this.props.preference
                  ? this.props.preference.get("pref_value")
                  : null
              }
              error={this.props.errors.get("pref_value", null)}
              helpContent={PREF_VALUE_HELP}
              labelColumnWidth={2}
            />
          </Col>
        </Row>
      </Container>
    );
  }