<commit_before>import * as React from "react";
import * as _ from "lodash";
import * as moment from "moment";
import {LinkContainer} from "react-router-bootstrap";

import {ExperimentModel} from "../models/experiment";
import Jobs from "../containers/jobs";
import {
  getGroupUrl,
  getProjectUrl,
  getUserUrl,
  humanizeTimeDelta,
  splitGroupName,
  splitProjectName,
  getCssClassForStatus,
} from "../constants/utils";


export interface Props {
  experiment: ExperimentModel;
  onDelete: () => any;
  fetchData: () => any;
}


export default class ExperimentDetail extends React.Component<Props, Object> {
  componentDidMount() {
    const {experiment, onDelete, fetchData} = this.props;
    fetchData();
  }

  public render() {
    const {experiment, onDelete, fetchData} = this.props;

    if (_.isNil(experiment)) {
      return (<div>Nothing</div>);
    }
    let totalRun = humanizeTimeDelta(experiment.started_at, experiment.finished_at);
    let statusCssClass = getCssClassForStatus(experiment.last_status);
    let values = splitProjectName(experiment.project_name);
    let group = null;
    if (!_.isNil(experiment.experiment_group_name)) {
      group = parseInt(splitGroupName(experiment.experiment_group_name)[2]);
    }
    return (
      <div className="row">
        <div className="col-md-12">
          <div className="entity-details">
            <span className="title">
              <i className="fa fa-cube icon" aria-hidden="true"></i>
              <LinkContainer to={getUserUrl(values[0])}>
                <span>
                  <a className="title">
                    {values[0]}
                  </a>/
                </span>
              </LinkContainer>
              <LinkContainer to={getProjectUrl(values[0], values[1])}>
                <span>
                  <a className="title">
                    {values[1]}
                  </a>/
                </span>
              </LinkContainer>
              {group &&
              <LinkContainer to={getGroupUrl(values[0], values[1], group)}>
                <span>
                  <a className="title">
                    Group {values[1]}
                  </a>/
                </span>
              </LinkContainer>
              }
              <span className="title">
                Experiment {experiment.sequence}
              </span>
            </span>
            <div className="meta-description">
              {experiment.description}
            </div>
            <div className="meta">
              <span className="meta-info">
                <i className="fa fa-user-o icon" aria-hidden="true"></i>
                <span className="title">User:</span>
                {experiment.user}
              </span>
              <span className="meta-info">
                <i className="fa fa-clock-o icon" aria-hidden="true"></i>
                <span className="title">Created:</span>
                {moment(experiment.created_at).fromNow()}
              </span>
              <span className="meta-info">
                <i className="fa fa-tasks icon" aria-hidden="true"></i>
                <span className="title">Jobs:</span>
                {experiment.num_jobs}
              </span>
              {experiment.started_at &&
              <span className="meta-info">
                <i className="fa fa-clock-o icon" aria-hidden="true"></i>
                <span className="title">Started:</span>
                {moment(experiment.started_at).fromNow()}
              </span>
              }
              {experiment.finished_at &&
              <span className="meta-info">
                <i className="fa fa-clock-o icon" aria-hidden="true"></i>
                <span className="title">Finished:</span>
                {moment(experiment.finished_at).fromNow()}
              </span>
              }
              {totalRun &&
              <span className="meta-info">
                <i className="fa fa-hourglass icon" aria-hidden="true"></i>
                <span className="title">Total run:</span>
                {totalRun}
              </span>
              }
              <span
                className={`status alert alert-${statusCssClass}`}>{experiment.last_status}</span>
            </div>
            {experiment.last_metric &&
            <div className="meta meta-metrics">
              {Object.keys(experiment.last_metric).map(
                (xp, idx) =>
                  <span className="meta-info" key={idx}>
                  <i className="fa fa-area-chart icon" aria-hidden="true"></i>
                  <span className="title">{xp}:</span>
                    {experiment.last_metric[xp]}
                </span>)}
            </div>
            }
          </div>
          <h4 className="polyaxon-header">Jobs</h4>
          <Jobs fetchData={() => null} user={experiment.user} experiment={experiment}></Jobs>
        </div>
      </div>
    );
  }
}<commit_msg>Update experiment detail<commit_after>import * as React from "react";
import * as _ from "lodash";
import * as moment from "moment";
import {LinkContainer} from "react-router-bootstrap";

import {ExperimentModel} from "../models/experiment";
import Jobs from "../containers/jobs";
import {
  getGroupUrl,
  getProjectUrl,
  getUserUrl,
  humanizeTimeDelta,
  splitGroupName,
  splitProjectName,
  getCssClassForStatus,
} from "../constants/utils";


export interface Props {
  experiment: ExperimentModel;
  onDelete: () => any;
  fetchData: () => any;
}


export default class ExperimentDetail extends React.Component<Props, Object> {
  componentDidMount() {
    const {experiment, onDelete, fetchData} = this.props;
    fetchData();
  }

  public render() {
    const {experiment, onDelete, fetchData} = this.props;

    if (_.isNil(experiment)) {
      return (<div>Nothing</div>);
    }
    let totalRun = humanizeTimeDelta(experiment.started_at, experiment.finished_at);
    let statusCssClass = getCssClassForStatus(experiment.last_status);
    let values = splitProjectName(experiment.project_name);
    let group = null;
    if (!_.isNil(experiment.experiment_group_name)) {
      group = parseInt(splitGroupName(experiment.experiment_group_name)[2]);
    }
    return (
      <div className="row">
        <div className="col-md-12">
          <div className="entity-details">
            <span className="title">
              <i className="fa fa-cube icon" aria-hidden="true"></i>
              <LinkContainer to={getUserUrl(values[0])}>
                <span>
                  <a className="title">
                    {values[0]}
                  </a>/
                </span>
              </LinkContainer>
              <LinkContainer to={getProjectUrl(values[0], values[1])}>
                <span>
                  <a className="title">
                    {values[1]}
                  </a>/
                </span>
              </LinkContainer>
              {group &&
              <LinkContainer to={getGroupUrl(values[0], values[1], group)}>
                <span>
                  <a className="title">
                    Group {values[1]}
                  </a>/
                </span>
              </LinkContainer>
              }
              <span className="title">
                Experiment {experiment.sequence}
              </span>
            </span>
            <div className="meta-description">
              {experiment.description}
            </div>
            <div className="meta">
              <span className="meta-info">
                <i className="fa fa-user-o icon" aria-hidden="true"></i>
                <span className="title">User:</span>
                {experiment.user}
              </span>
              <span className="meta-info">
                <i className="fa fa-clock-o icon" aria-hidden="true"></i>
                <span className="title">Created:</span>
                {moment(experiment.created_at).fromNow()}
              </span>
              <span className="meta-info">
                <i className="fa fa-tasks icon" aria-hidden="true"></i>
                <span className="title">Jobs:</span>
                {experiment.num_jobs}
              </span>
              {experiment.started_at &&
              <span className="meta-info">
                <i className="fa fa-clock-o icon" aria-hidden="true"></i>
                <span className="title">Started:</span>
                {moment(experiment.started_at).fromNow()}
              </span>
              }
              {experiment.finished_at &&
              <span className="meta-info">
                <i className="fa fa-clock-o icon" aria-hidden="true"></i>
                <span className="title">Finished:</span>
                {moment(experiment.finished_at).fromNow()}
              </span>
              }
              {totalRun &&
              <span className="meta-info">
                <i className="fa fa-hourglass icon" aria-hidden="true"></i>
                <span className="title">Total run:</span>
                {totalRun}
              </span>
              }
              <span className={`status alert alert-${statusCssClass}`}>{experiment.last_status}
              </span>
            </div>
            {experiment.last_metric &&
            <div className="meta meta-metrics">
              {Object.keys(experiment.last_metric).map(
                (xp, idx) =>
                  <span className="meta-info" key={idx}>
                  <i className="fa fa-area-chart icon" aria-hidden="true"></i>
                  <span className="title">{xp}:</span>
                    {experiment.last_metric[xp]}
                </span>)}
            </div>
            }
          </div>
          <h4 className="polyaxon-header">Jobs</h4>
          <Jobs fetchData={() => null} user={experiment.user} experiment={experiment}></Jobs>
        </div>
      </div>
    );
  }
}
{'fraction_non_alphanumeric': 0.13918152350081037, 'fraction_numerical': 0.002633711507293355, 'mean_word_length': 1.6785132935431362, 'pattern_counts': {'":': 0, '<': 177, '<?xml version=': 0, '>': 185, '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': '4030669', 'n_tokens_mistral': 2709, 'n_tokens_neox': 2614, 'n_words': 503}