<commit_before>import React from 'react';
import StatusIndicator from 'Components/StatusIndicator/StatusIndicator';
import Claim from 'Components/Claim/Claim';

/* A claim
 * and all it's arguments
 * Also the options to add arguments - eventually
 */

export default class Circle extends React.Component {
  constructor(props) {
    super(props);
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick(premis) {
    this.props.premisClickHandler(premis);
  }

  render() {

    //loop through the premises in this argument
    let premises = this.props.argumentObject.premises.map(function (premis, index) {

      let isSelected = (premis.id == this.props.highlightedPremisId);

      return (
        <div className="argumentCircle__premis" key={index}>
          <Claim claim={premis} isSelected={isSelected} handleClick={() => { this.handleClick(premis); }} />
        </div>
      );
    }.bind(this));

    let colour = this.props.argumentObject.probability < 50 ? "false" : "true";
    console.log("colour", colour);
    return (
      <div className={`argument argumentCircle--${colour}`}>
        {/*<div className="argumentCircle__header">
          {this.props.argumentObject.type}
        </div>*/}
        <div className="argumentCircle__body">
          {premises}
        </div>
      </div>
    );
  }
}<commit_msg>tidy circle<commit_after>import React from 'react';
import StatusIndicator from 'Components/StatusIndicator/StatusIndicator';
import Claim from 'Components/Claim/Claim';

/* A claim
 * and all it's arguments
 * Also the options to add arguments - eventually
 */

export default class Circle extends React.Component {
  constructor(props) {
    super(props);
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick(premis) {
    this.props.premisClickHandler(premis);
  }

  render() {
    // loop through the premises in this argument
    const premises = this.props.argumentObject.premises.map((premis) => {
      const isSelected = (premis.id === this.props.highlightedPremisId);

      return (
        <div className="argumentCircle__premis" key={premis.id}>
          <Claim
            claim={premis}
            isSelected={isSelected}
            handleClick={() => { this.handleClick(premis); }}
          />
        </div>
      );
    });

    const colour = this.props.argumentObject.probability < 50 ? 'false' : 'true';

    return (
      <div className={`argument argumentCircle--${colour}`}>
        {/* <div className="argumentCircle__header">
          {this.props.argumentObject.type}
        </div>*/}
        <div className="argumentCircle__body">
          {premises}
        </div>
      </div>
    );
  }
}

Circle.propTypes = {
  highlightedPremisId: React.PropTypes.string.isRequired,
  argumentObject: React.PropTypes.shape({
    probability: React.PropTypes.number.isRequired,
    premises: React.PropTypes.array.isRequired,
  }).isRequired,
  premisClickHandler: React.PropTypes.func.isRequired,
};
{'fraction_non_alphanumeric': 0.131438127090301, 'fraction_numerical': 0.0013377926421404682, 'mean_word_length': 3.0364372469635628, 'pattern_counts': {'":': 0, '<': 23, '<?xml version=': 0, '>': 24, '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': '2248166', 'n_tokens_mistral': 908, 'n_tokens_neox': 865, 'n_words': 180}