<commit_before>import React from 'react';

class FormPostAttack extends React.Component {
  constructor(props) {
    super(props);
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleClickCancelButton = this.handleClickCancelButton.bind(this);
  }

  shouldComponentUpdate(nextProps) {
    if (nextProps.form !== this.props.form) {
      return true;
    }
    if (nextProps.isAttacking !== this.props.isAttacking) {
      return true;
    }
    return false;
  }

  handleSubmit(e) {
    e.preventDefault();
    const { form } = this.props;
    const params = {};
    const obj = form.toJS();
    Object.keys(obj).forEach((k) => {
      const v = obj[k];
      if (v === '' || v === null || v === undefined) return;
      if (['Rate', 'Workers', 'Connections', 'Redirects'].includes(k)) {
        params[k] = parseInt(v, 10);
        return;
      }
      params[k] = v;
    });
    this.props.onSubmit(params);
  }

  handleClickCancelButton() {
    this.props.onCancel();
  }

  handleChangeTextField(key) {
    return (e) => {
      this.props.onUpdate({ [key]: e.target.value });
    };
  }

  handleChangeTextArea(key) {
    return (e) => {
      this.props.onUpdate({ [key]: e.target.value });
    };
  }

  renderSubmitOrCancelButton() {
    if (this.props.isAttacking) {
      return (
        <button
          name="Cancel"
          className="button is-danger is-fullwidth"
          type="button"
          onClick={this.handleClickCancelButton}
        >
          <span className="icon is-small">
            <i className="fa fa-stop" />
          </span>
          <span>Cancel attack</span>
        </button>
      );
    }
    return (
      <button className="button is-primary is-fullwidth" type="submit">
        <span className="icon is-small">
          <i className="fa fa-bolt" />
        </span>
        <span>Attack!!</span>
      </button>
    );
  }

  render() {
    const { form } = this.props;
    return (
      <div className="form-post-attack">
        <form onSubmit={this.handleSubmit}>
          <div className="columns">
            <div className="column is-2">
              <div className="field">
                <label className="label" htmlFor="Duration">Duration</label>
                <p className="control">
                  <input
                    className="input"
                    type="text"
                    name="Duration"
                    placeholder="10s"
                    value={form.Duration}
                    onChange={this.handleChangeTextField('Duration')}
                  />
                </p>
              </div>
            </div>
            {/* end of column */}
            <div className="column is-2">
              <div className="field">
                <label className="label" htmlFor="Rate">Rate</label>
                <p className="control">
                  <input
                    className="input"
                    type="text"
                    name="Rate"
                    placeholder="1"
                    value={form.Rate}
                    onChange={this.handleChangeTextField('Rate')}
                  />
                </p>
              </div>
            </div>
            {/* end of column */}
            <div className="column is-8">
              <div className="field">
                <label className="label" htmlFor="Targets">Targets</label>
                <p className="control">
                  <textarea
                    className="textarea"
                    name="Targets"
                    placeholder="GET https://127.0.0.1:8000/path/to/api?q=trunks"
                    value={form.Targets}
                    onChange={this.handleChangeTextArea('Targets')}
                  />
                </p>
              </div>
              <div className="field">
                <label className="label" htmlFor="Body">Body</label>
                <p className="control">
                  <textarea
                    className="textarea"
                    name="Body"
                    placeholder="Requests body file"
                    value={form.Body}
                    onChange={this.handleChangeTextArea('Body')}
                  />
                </p>
              </div>
            </div>
            {/* end of column */}
          </div>
          <div className="control">
            {form.error && (
              <article className="message is-danger">
                <div className="message-body">{form.error.message}</div>
              </article>
            )}
            {this.renderSubmitOrCancelButton()}
          </div>
        </form>
      </div>
    );
  }
}

FormPostAttack.propTypes = {
  form: React.PropTypes.object.isRequired,
  isAttacking: React.PropTypes.bool.isRequired,
  onUpdate: React.PropTypes.func.isRequired,
  onSubmit: React.PropTypes.func.isRequired,
  onCancel: React.PropTypes.func.isRequired,
};

export default FormPostAttack;<commit_msg>Added attack form options<commit_after>import React from 'react';

class FormPostAttack extends React.Component {
  constructor(props) {
    super(props);
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleClickCancelButton = this.handleClickCancelButton.bind(this);
  }

  shouldComponentUpdate(nextProps) {
    if (nextProps.form !== this.props.form) {
      return true;
    }
    if (nextProps.isAttacking !== this.props.isAttacking) {
      return true;
    }
    return false;
  }

  handleSubmit(e) {
    e.preventDefault();
    const { form } = this.props;
    const params = {};
    const obj = form.toJS();
    Object.keys(obj).forEach((k) => {
      const v = obj[k];
      if (v === '' || v === null || v === undefined) return;
      if (['Rate', 'Workers', 'Connections', 'Redirects'].includes(k)) {
        params[k] = parseInt(v, 10);
        return;
      }
      params[k] = v;
    });
    this.props.onSubmit(params);
  }

  handleClickCancelButton() {
    this.props.onCancel();
  }

  handleChangeTextField(key) {
    return (e) => {
      this.props.onUpdate({ [key]: e.target.value });
    };
  }

  handleChangeTextArea(key) {
    return (e) => {
      this.props.onUpdate({ [key]: e.target.value });
    };
  }

  handleChangeCheckbox(key) {
    return (e) => {
      this.props.onUpdate({ [key]: e.target.checked });
    };
  }

  renderSubmitOrCancelButton() {
    if (this.props.isAttacking) {
      return (
        <button
          name="Cancel"
          className="button is-danger is-fullwidth"
          type="button"
          onClick={this.handleClickCancelButton}
        >
          <span className="icon is-small">
            <i className="fa fa-stop" />
          </span>
          <span>Cancel attack</span>
        </button>
      );
    }
    return (
      <button className="button is-primary is-fullwidth" type="submit">
        <span className="icon is-small">
          <i className="fa fa-bolt" />
        </span>
        <span>Attack!!</span>
      </button>
    );
  }

  render() {
    const { form } = this.props;
    const checkboxs = [
      'HTTP2',
      'Insecure',
      'Lazy',
      'Keepalive',
    ];
    const textFields = [
      ['Duration', '10s'],
      ['Rate', '5'],
      ['Timeout', '30s'],
    ];
    const textareas = [
      ['Targets', 'GET https://127.0.0.1:8000/path/to/api?q=trunks'],
      ['Body', '{"key": "value"}'],
    ];
    return (
      <div className="form-post-attack">
        <form onSubmit={this.handleSubmit}>
          <div className="columns">
            <div className="column is-2">
              {checkboxs.map(key => (
                <div className="field" key={key}>
                  <p className="control">
                    <label className="label" htmlFor={key}>
                      <input
                        type="checkbox"
                        name={key}
                        checked={form[key]}
                        onChange={this.handleChangeCheckbox(key)}
                      />
                      &nbsp;{key}
                    </label>
                  </p>
                </div>
              ))}
            </div>
            {/* end of column */}
            <div className="column is-2">
              {textFields.map(([key, placeholder]) => (
                <div className="field" key={key}>
                  <label className="label" htmlFor={key}>{key}</label>
                  <p className="control">
                    <input
                      className="input"
                      type="text"
                      name={key}
                      placeholder={placeholder}
                      value={form[key]}
                      onChange={this.handleChangeTextField(key)}
                    />
                  </p>
                </div>
              ))}
            </div>
            {/* end of column */}
            <div className="column is-8">
              {textareas.map(([key, placeholder]) => (
                <div className="field" key={key}>
                  <label className="label" htmlFor={key}>{key}</label>
                  <p className="control">
                    <textarea
                      className="textarea"
                      name={key}
                      placeholder={placeholder}
                      value={form[key]}
                      onChange={this.handleChangeTextArea(key)}
                    />
                  </p>
                </div>
              ))}
            </div>
            {/* end of column */}
          </div>
          <div className="control">
            {form.error && (
              <article className="message is-danger">
                <div className="message-body">{form.error.message}</div>
              </article>
            )}
            {this.renderSubmitOrCancelButton()}
          </div>
        </form>
      </div>
    );
  }
}

FormPostAttack.propTypes = {
  form: React.PropTypes.object.isRequired,
  isAttacking: React.PropTypes.bool.isRequired,
  onUpdate: React.PropTypes.func.isRequired,
  onSubmit: React.PropTypes.func.isRequired,
  onCancel: React.PropTypes.func.isRequired,
};

export default FormPostAttack;
{'fraction_non_alphanumeric': 0.1418746315582629, 'fraction_numerical': 0.0038317940656317547, 'mean_word_length': 1.5046751968503937, 'pattern_counts': {'":': 1, '<': 116, '<?xml version=': 0, '>': 126, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 2, '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': '4134853', 'n_tokens_mistral': 2870, 'n_tokens_neox': 2751, 'n_words': 490}