<commit_before>import React, { PureComponent } from 'react';
import PropTypes from 'prop-types'
import SelectField from 'react-md/lib/SelectFields';
import Divider from 'react-md/lib/Dividers';
import axios from 'axios'

class AddAttribute extends PureComponent {
  constructor(props) {
    super(props);
    // Note: the state of this component is not considered 'fixed' until it is submitted to the redux store
    this.state = {
      relation: '',
      attribute: ''
    };
    this.setRelation = this.setRelation.bind(this);
    this.setAttribute = this.setAttribute.bind(this);
  }
  setRelation(newValue, newActiveIndex, event) {
    console.log(newValue, newActiveIndex, event);
    const relation = newValue;
    this.setState({ relation })
    // With the relation type set, we can query the backend

  }
  setAttribute(newValue, newActiveIndex, event) {
    console.log(newValue, newActiveIndex, event);
    const attribute = newValue;
    this.setState({ attribute })
  }
  render(){
    return (
      <section className="md-grid">
        <SelectField
          id="relations"
          label="Relations"
          placeholder="Select a Relation"
          position={SelectField.Positions.BELOW}
          menuItems={this.props.relations}
          className="md-cell"
          helpOnFocus
          helpText="Relations are descriptors about specific attributes."
          onChange={this.setRelation}
        />
        <SelectField
          id="attributes"
          label="Attributes"
          placeholder="Select an Attribute"
          position={SelectField.Positions.BELOW}
          menuItems={this.props.attributes}
          className="md-cell"
          helpOnFocus
          helpText="An attribute is a specific instance of a relation type. For example, O157 is an attribute of relation O-Type."
          onChange={this.setAttribute}
        />
        <Divider />
      </section>
    )
  }
}

export default AddAttribute;<commit_msg>FIX: querying backend for attribute values works<commit_after>import React, { PureComponent } from 'react';
import PropTypes from 'prop-types'
import SelectField from 'react-md/lib/SelectFields';
import Divider from 'react-md/lib/Dividers';
import axios from 'axios'
import { API_ROOT } from '../middleware/api';

class AddAttribute extends PureComponent {
  constructor(props) {
    super(props);
    // Note: the state of this component is not considered 'fixed' until it is submitted to the redux store
    this.state = {
      relation: '',
      attribute: '',
      attributes: []
    };
    this.setRelation = this.setRelation.bind(this);
    this.setAttribute = this.setAttribute.bind(this);
  }
  setRelation(newValue, newActiveIndex, event) {
    console.log(newValue, newActiveIndex, event);
    const relation = newValue;
    this.setState({ relation })
    // With the relation type chosen, we can query the backend
    console.log(relation)
    axios.get(API_ROOT + `get_attribute_values/type/` + relation)
      .then(res => {
        const attributes = res.data;
        this.setState({ attributes });
      });
  }
  setAttribute(newValue, newActiveIndex, event) {
    console.log(newValue, newActiveIndex, event);
    const attribute = newValue;
    this.setState({ attribute })
  }
  render(){
    return (
      <section className="md-grid">
        <SelectField
          id="relations"
          label="Relations"
          placeholder="Select a Relation"
          position={SelectField.Positions.BELOW}
          menuItems={this.props.relations}
          className="md-cell"
          helpOnFocus
          helpText="Relations are descriptors about specific attributes."
          onChange={this.setRelation}
        />
        <SelectField
          id="attributes"
          label="Attributes"
          placeholder="Select an Attribute"
          position={SelectField.Positions.BELOW}
          menuItems={this.state.attributes}
          className="md-cell"
          helpOnFocus
          helpText="An attribute is a specific instance of a relation type. For example, O157 is an attribute of relation O-Type."
          onChange={this.setAttribute}
        />
        <Divider />
      </section>
    )
  }
}

export default AddAttribute;
{'fraction_non_alphanumeric': 0.10321209258384506, 'fraction_numerical': 0.0014170996693434106, 'mean_word_length': 2.6762152777777777, 'pattern_counts': {'":': 0, '<': 13, '<?xml version=': 0, '>': 14, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '946854', 'n_tokens_mistral': 1143, 'n_tokens_neox': 1143, 'n_words': 300}