<commit_before>/** @jsx React.DOM */

define([
  "React",
  "mixins/BackboneMixin",
  "jsx!components/TaskListItemComponent"
], function(React, BackboneMixin, TaskListItemComponent) {
  var STATE_LOADING = 0;
  var STATE_ERROR = 1;
  var STATE_SUCCESS = 2;

  var UPDATE_INTERVAL = 2000;

  return React.createClass({
    componentDidMount: function() {
      this.startPolling();
    },
    componentWillUnmount: function() {
      this.stopPolling();
    },
    componentWillMount: function() {
      this.fetchTasks();
    },
    fetchTasks: function() {
      var _this = this;

      this.props.collection.fetch({
        error: function() {
          _this.setState({fetchState: STATE_ERROR});
        },
        reset: true,
        success: function() {
          _this.setState({fetchState: STATE_SUCCESS});
        }
      });
    },
    getInitialState: function() {
      return {
        fetchState: STATE_LOADING,
        showTimestamps: false
      };
    },
    getResource: function() {
      return this.props.collection;
    },
    mixins: [BackboneMixin],
    render: function() {
      var taskNodes;
      var _this = this;
      var tasksLength = this.props.collection.length;

      // If there are no tasks, they can't all be selected. Otherwise, assume
      // they are all selected and let the iteration below decide if that is
      // true.
      var allTasksSelected = tasksLength > 0;

      if (this.state.fetchState === STATE_LOADING) {
        taskNodes =
          <tr>
            <td className="text-center text-muted" colSpan="5">
              Loading tasks...
            </td>
          </tr>;
      } else if (this.state.fetchState === STATE_ERROR) {
        taskNodes =
          <tr>
            <td className="text-center text-danger" colSpan="5">
              Error fetching tasks. Refresh the list to try again.
            </td>
          </tr>;
      } else if (tasksLength === 0) {
        taskNodes =
          <tr>
            <td className="text-center" colSpan="5">
              No tasks running.
            </td>
          </tr>;
      } else {
        taskNodes = this.props.collection.map(function(task) {
          // Expicitly check for Boolean since the key might not exist in the
          // object.
          var isActive = this.props.selectedTasks[task.id] === true;
          if (!isActive) { allTasksSelected = false; }

          return (
            <TaskListItemComponent
              isActive={isActive}
              key={task.cid}
              onToggle={this.props.onTaskToggle}
              task={task} />
          );
        }, this);
      }

      var sortKey = this.props.collection.sortKey;
      var sortOrder =
        this.props.collection.sortReverse ?
        "▲" :
        "▼";
      return (
        <table className="table table-selectable">
          <thead>
            <tr>
              <th style={{width: "1px"}}>
                <input type="checkbox"
                  checked={allTasksSelected}
                  disabled={tasksLength === 0}
                  onChange={this.props.onAllTasksToggle} />
              </th>
              <th>
                <span onClick={this.sortCollectionBy.bind(null, "id")}
                      className="clickable">
                  ID {(sortKey === "id") ? sortOrder : null}
                </span>
              </th>
              <th>
                <span onClick={this.sortCollectionBy.bind(null, "status")}
                      className="clickable">
                  Status {(sortKey === "status") ? sortOrder : null}<commit_msg>Use `task.id` for key, `cid` changes on creation<commit_after>/** @jsx React.DOM */

define([
  "React",
  "mixins/BackboneMixin",
  "jsx!components/TaskListItemComponent"
], function(React, BackboneMixin, TaskListItemComponent) {
  var STATE_LOADING = 0;
  var STATE_ERROR = 1;
  var STATE_SUCCESS = 2;

  var UPDATE_INTERVAL = 2000;

  return React.createClass({
    componentDidMount: function() {
      this.startPolling();
    },
    componentWillUnmount: function() {
      this.stopPolling();
    },
    componentWillMount: function() {
      this.fetchTasks();
    },
    fetchTasks: function() {
      var _this = this;

      this.props.collection.fetch({
        error: function() {
          _this.setState({fetchState: STATE_ERROR});
        },
        reset: true,
        success: function() {
          _this.setState({fetchState: STATE_SUCCESS});
        }
      });
    },
    getInitialState: function() {
      return {
        fetchState: STATE_LOADING,
        showTimestamps: false
      };
    },
    getResource: function() {
      return this.props.collection;
    },
    mixins: [BackboneMixin],
    render: function() {
      var taskNodes;
      var _this = this;
      var tasksLength = this.props.collection.length;

      // If there are no tasks, they can't all be selected. Otherwise, assume
      // they are all selected and let the iteration below decide if that is
      // true.
      var allTasksSelected = tasksLength > 0;

      if (this.state.fetchState === STATE_LOADING) {
        taskNodes =
          <tr>
            <td className="text-center text-muted" colSpan="5">
              Loading tasks...
            </td>
          </tr>;
      } else if (this.state.fetchState === STATE_ERROR) {
        taskNodes =
          <tr>
            <td className="text-center text-danger" colSpan="5">
              Error fetching tasks. Refresh the list to try again.
            </td>
          </tr>;
      } else if (tasksLength === 0) {
        taskNodes =
          <tr>
            <td className="text-center" colSpan="5">
              No tasks running.
            </td>
          </tr>;
      } else {
        taskNodes = this.props.collection.map(function(task) {
          // Expicitly check for Boolean since the key might not exist in the
          // object.
          var isActive = this.props.selectedTasks[task.id] === true;
          if (!isActive) { allTasksSelected = false; }

          return (
            <TaskListItemComponent
              isActive={isActive}
              key={task.id}
              onToggle={this.props.onTaskToggle}
              task={task} />
          );
        }, this);
      }

      var sortKey = this.props.collection.sortKey;
      var sortOrder =
        this.props.collection.sortReverse ?
        "▲" :
        "▼";
      return (
        <table className="table table-selectable">
          <thead>
            <tr>
              <th style={{width: "1px"}}>
                <input type="checkbox"
                  checked={allTasksSelected}
                  disabled={tasksLength === 0}
                  onChange={this.props.onAllTasksToggle} />
              </th>
              <th>
                <span onClick={this.sortCollectionBy.bind(null, "id")}
                      className="clickable">
                  ID {(sortKey === "id") ? sortOrder : null}
                </span>
              </th>
              <th>
                <span onClick={this.sortCollectionBy.bind(null, "status")}
                      className="clickable">
                  Status {(sortKey === "status") ? sortOrder : null}
{'fraction_non_alphanumeric': 0.12194444444444444, 'fraction_numerical': 0.0038888888888888888, 'mean_word_length': 1.6680251945164877, 'pattern_counts': {'":': 0, '<': 53, '<?xml version=': 0, '>': 55, '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': '2890455', 'n_tokens_mistral': 2051, 'n_tokens_neox': 1971, 'n_words': 460}