<commit_before>import React, { Component } from 'react';

import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import CircularProgress from 'material-ui/CircularProgress';
import FlatButton from 'material-ui/FlatButton';
import Snackbar from 'material-ui/Snackbar';
import {
  Table,
  TableBody,
  TableHeader,
  TableHeaderColumn,
  TableRow,
  TableRowColumn,
} from 'material-ui/Table';
import _ from 'lodash';

import TaskService from '../services/task';

const taskService =  new TaskService();

const styles = {
  uploadButton: {
    verticalAlign: 'middle',
  }
};

class Results extends Component {

  constructor(props) {
    super(props);
    this.taskProgressIntervalId = null;
    this.cancelIntervalId = null;
    this.state = {
      taskStatus: null,
      taskResults: null,
      taskProgress: 0,
      taskErrors: [],
      cancelVisible: true,

      snackOpen: false,
      snackMessage: '',
      snackHideDuration: 3000,
    };
  }

  progressIntervalKiller() {
    console.log(this.state);
    if((this.state.taskStatus === 'complete' || this.state.taskStatus === 'aborted') && this.taskProgressIntervalId) {
      clearInterval(this.taskProgressIntervalId);

      let messageTemp = this.state.taskStatus == 'complete'?'Completed':'Aborted';
      this.setState({
        cancelVisible: false,
        snackOpen:true,
        snackMessage: messageTemp
      });
      this.taskProgressIntervalId = null;
      this.props.onEnd();
    }
  }

  componentDidMount() {
    if (this.props.uid) {
      this.taskProgressIntervalId = setInterval(
        () => taskService.fetch(this.props.uid, res => (
            this.setState(
              {
                taskResults: res.body.accuracies,
                taskProgress: res.body.progress,
                taskStatus: res.body.status,
                taskErrors: res.body.errors
              },
              () => this.progressIntervalKiller()
            )
          )
        ),
        1000,
      );
    } else {
      this.setState({
        taskResults: null,
        taskProgress: 0
      })
    }
  }

  componentWillUnmount() {
    this.setState({taskResults: null, taskProgress: 0});
  }

  cancelIntervalKiller(){
    if(this.state.taskStatus === 'aborted') {
      clearInterval(this.cancelIntervalId);
      this.props.onEnd();
    }
  }

  fetchTaskEnd() {
    this.cancelIntervalId = setInterval(
      () => taskService.fetch(this.props.uid, res => (
          this.setState(
            { taskStatus: res.body.status },
            () => this.cancelIntervalKiller()
          )
        )
      ),
      1000,
    );
  }

  cancelTask() {
    if (this.props.uid) {
      this.setState({cancelVisible: false});
      this.progressIntervalKiller();
      taskService.cancel(this.props.uid, res => this.fetchTaskEnd());
    }
  }

  handleRequestSnackClose = () => {
    this.setState({
      snackOpen: false,
      snackMessage: ''
    });
  }

  render() {
    return (
      <MuiThemeProvider>
        <div>
          <center>
            <p>progress of task: {(this.state.taskProgress * 100).toFixed(0)}%</p>
            <CircularProgress
              mode="determinate"
              value={this.state.taskProgress * 100}
              size={30}
              thickness={3}
              max={100}
            />
          </center>
          {this.state.cancelVisible ? (
            <FlatButton
              label="Cancel Task"
              labelPosition="before"
              style={styles.uploadButton}
              containerElement="label"
              onClick={this.cancelTask.bind(this)}
            ></FlatButton>
          ) : (
              ""
            )}
          <Table>
            <TableHeader adjustForCheckbox={false} displaySelectAll={false}>
              <TableRow>
                <TableHeaderColumn>Metric</TableHeaderColumn>
                <TableHeaderColumn>Accuracy</TableHeaderColumn>
              </TableRow>
            </TableHeader>
            <TableBody displayRowCheckbox={false}>
              {_.map(this.state.taskResults, (accuracy, id) => (
                <TableRow key={id}>
                  <TableRowColumn>
                    {accuracy.name}
                  </TableRowColumn>
                  <TableRowColumn>
                    {accuracy.result}
                  </TableRowColumn>
                </TableRow>
              ))}
            </TableBody>
          </Table>
        <Snackbar
          open={this.state.snackOpen}
          action="Ok"
          message={this.state.snackMessage}
          autoHideDuration={this.state.snackHideDuration}
          onActionTouchTap={this.handleRequestSnackClose}
          onRequestClose={this.handleRequestSnackClose}
        />
        </div>
      </MuiThemeProvider>
    );
  }
}


export default Results;<commit_msg>add time and progress column for all accuracies<commit_after>import React, { Component } from 'react';

import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import CircularProgress from 'material-ui/CircularProgress';
import FlatButton from 'material-ui/FlatButton';
import Snackbar from 'material-ui/Snackbar';
import {
  Table,
  TableBody,
  TableHeader,
  TableHeaderColumn,
  TableRow,
  TableRowColumn,
} from 'material-ui/Table';
import _ from 'lodash';

import TaskService from '../services/task';

const taskService =  new TaskService();

const styles = {
  uploadButton: {
    verticalAlign: 'middle',
  }
};

class Results extends Component {

  constructor(props) {
    super(props);
    this.taskProgressIntervalId = null;
    this.cancelIntervalId = null;
    this.state = {
      taskStatus: null,
      taskResults: null,
      taskProgress: 0,
      taskErrors: [],
      cancelVisible: true,

      snackOpen: false,
      snackMessage: '',
      snackHideDuration: 3000,
    };
  }

  progressIntervalKiller() {
    console.log(this.state);
    if((this.state.taskStatus === 'complete' || this.state.taskStatus === 'aborted') && this.taskProgressIntervalId) {
      clearInterval(this.taskProgressIntervalId);

      let messageTemp = this.state.taskStatus == 'complete'?'Completed':'Aborted';
      this.setState({
        cancelVisible: false,
        snackOpen:true,
        snackMessage: messageTemp
      });
      this.taskProgressIntervalId = null;
      this.props.onEnd();
    }
  }

  componentDidMount() {
    if (this.props.uid) {
      this.taskProgressIntervalId = setInterval(
        () => taskService.fetch(this.props.uid, res => (
            this.setState(
              {
                taskResults: res.body.accuracies,
                taskProgress: res.body.progress,
                taskStatus: res.body.status,
                taskErrors: res.body.errors
              },
              () => this.progressIntervalKiller()
            )
          )
        ),
        1000,
      );
    } else {
      this.setState({
        taskResults: null,
        taskProgress: 0
      })
    }
  }

  componentWillUnmount() {
    this.setState({taskResults: null, taskProgress: 0});
  }

  cancelIntervalKiller(){
    if(this.state.taskStatus === 'aborted') {
      clearInterval(this.cancelIntervalId);
      this.props.onEnd();
    }
  }

  fetchTaskEnd() {
    this.cancelIntervalId = setInterval(
      () => taskService.fetch(this.props.uid, res => (
          this.setState(
            { taskStatus: res.body.status },
            () => this.cancelIntervalKiller()
          )
        )
      ),
      1000,
    );
  }

  cancelTask() {
    if (this.props.uid) {
      this.setState({cancelVisible: false});
      this.progressIntervalKiller();
      taskService.cancel(this.props.uid, res => this.fetchTaskEnd());
    }
  }

  handleRequestSnackClose = () => {
    this.setState({
      snackOpen: false,
      snackMessage: ''
    });
  }

  render() {
    return (
      <MuiThemeProvider>
        <div>
          <center>
            <p>progress of task: {this.state.taskProgress.toFixed(0)}%</p>
            <CircularProgress
              mode="determinate"
              value={this.state.taskProgress}
              size={30}
              thickness={3}
              max={100}
            />
          </center>
          {this.state.cancelVisible ? (
            <FlatButton
              label="Cancel Task"
              labelPosition="before"
              style={styles.uploadButton}
              containerElement="label"
              onClick={this.cancelTask.bind(this)}
            ></FlatButton>
          ) : (
              ""
            )}
          <Table>
            <TableHeader adjustForCheckbox={false} displaySelectAll={false}>
              <TableRow>
                <TableHeaderColumn>Metric</TableHeaderColumn>
                <TableHeaderColumn>Accuracy</TableHeaderColumn>
                <TableHeaderColumn>Progress</TableHeaderColumn>
                <TableHeaderColumn>Time in secs</TableHeaderColumn>
              </TableRow>
            </TableHeader>
            <TableBody displayRowCheckbox={false}>
              {_.map(this.state.taskResults, (accuracy, id) => (
                <TableRow key={id}>
                  <TableRowColumn>
                    {accuracy.name}
                  </TableRowColumn>
                  <TableRowColumn>
                    {accuracy.result || 'Waiting...'}
                  </TableRowColumn>
                  <TableRowColumn>
                    {accuracy.progress}%
                  </TableRowColumn>
                  <TableRowColumn>
                    {accuracy.time}
                  </TableRowColumn>
                </TableRow>
              ))}
            </TableBody>
          </Table>
        <Snackbar
          open={this.state.snackOpen}
          action="Ok"
          message={this.state.snackMessage}
          autoHideDuration={this.state.snackHideDuration}
          onActionTouchTap={this.handleRequestSnackClose}
          onRequestClose={this.handleRequestSnackClose}
        />
        </div>
      </MuiThemeProvider>
    );
  }
}


export default Results;
{'fraction_non_alphanumeric': 0.11862891207153502, 'fraction_numerical': 0.004967709885742673, 'mean_word_length': 1.84269980231573, 'pattern_counts': {'":': 0, '<': 71, '<?xml version=': 0, '>': 89, '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': '4014468', 'n_tokens_mistral': 2867, 'n_tokens_neox': 2769, 'n_words': 443}