<commit_before>import React, {Component, PropTypes} from 'react';
import moment from 'moment';
import classNames from 'classnames';

import Icon from '../shared/Icon.jsx';
import Image from '../shared/Image.jsx';

import {Link} from 'react-router';

class CommitDetails extends Component {

  getClassNames() {
    const {commitInfo} = this.props;
    const rowSuffix = commitInfo.oddRow ? '--odd' : '--even';

    return classNames([
      'commits__commit',
      'commits__commit' + rowSuffix
    ]);
  }

  getPictureClassNames() {
    const {commitInfo} = this.props;
    const rowSuffix = commitInfo.oddRow ? '--odd' : '--even';
    const firstRowSuffix = commitInfo.firstRow ? '--firstrow' : '';
    const lastRowSuffix = commitInfo.lastRow ? '--lastrow' : '';

    return classNames([
      'commits__picture',
      'commits__picture' + rowSuffix,
      'commits__picture' + firstRowSuffix,
      'commits__picture' + lastRowSuffix
    ]);
  }

  renderTimestamp() {
    const {timestamp} = this.props.commitInfo;
    const formattedTime = moment(parseInt(timestamp, 10)).format('LT');

    return (
      <div className="commits__commit-timestamp">
        {formattedTime}
      </div>
    );
  }

  renderContent() {
    const {message, author, modified, added, removed, url} = this.props.commitInfo;
    const {name} = author;
    const filesChanged = modified.length + added.length + removed.length;

    return (
      <div className="commits__commit-wrapper">
        <div className="commits__commit-content">
          <span className="commits__commit-message">
            <Link to={url} target="_blank">
              {message}
            </Link>
          </span>
          <div className="commits__commit-details">
            <span className="commits__commit-author">
              {name}
            </span>
            { ' ' } changed {filesChanged} file{filesChanged === 1 ? '' : 's'}
          </div>
        </div>
      </div>
    );
  }

  renderPicture() {
    const {commitInfo} = this.props;

    if (commitInfo.firstRow) {
      const imageUrl = `${window.config.staticRoot}/images/branch_head.png`;

      return (
        <div className={this.getPictureClassNames()}>
          <Image src={imageUrl} height="25" width="25" classNames="commits__picture-icon" />
        </div>
      );
    }

    return (
      <div className={this.getPictureClassNames()}>
        <Icon type="octicon" name='git-commit' classNames="commits__picture-icon" />
      </div>
    );
  }

  render() {
    return (
      <div className={this.getClassNames()}>
        {this.renderPicture()}
        {this.renderContent()}
        {this.renderTimestamp()}
      </div>
    );
  }
}

CommitDetails.propTypes = {
  commitInfo: PropTypes.object.isRequired
}

export default CommitDetails;
<commit_msg>use numbers not strings for Image<commit_after>import React, {Component, PropTypes} from 'react';
import moment from 'moment';
import classNames from 'classnames';

import Icon from '../shared/Icon.jsx';
import Image from '../shared/Image.jsx';

import {Link} from 'react-router';

class CommitDetails extends Component {

  getClassNames() {
    const {commitInfo} = this.props;
    const rowSuffix = commitInfo.oddRow ? '--odd' : '--even';

    return classNames([
      'commits__commit',
      'commits__commit' + rowSuffix
    ]);
  }

  getPictureClassNames() {
    const {commitInfo} = this.props;
    const rowSuffix = commitInfo.oddRow ? '--odd' : '--even';
    const firstRowSuffix = commitInfo.firstRow ? '--firstrow' : '';
    const lastRowSuffix = commitInfo.lastRow ? '--lastrow' : '';

    return classNames([
      'commits__picture',
      'commits__picture' + rowSuffix,
      'commits__picture' + firstRowSuffix,
      'commits__picture' + lastRowSuffix
    ]);
  }

  renderTimestamp() {
    const {timestamp} = this.props.commitInfo;
    const formattedTime = moment(parseInt(timestamp, 10)).format('LT');

    return (
      <div className="commits__commit-timestamp">
        {formattedTime}
      </div>
    );
  }

  renderContent() {
    const {message, author, modified, added, removed, url} = this.props.commitInfo;
    const {name} = author;
    const filesChanged = modified.length + added.length + removed.length;

    return (
      <div className="commits__commit-wrapper">
        <div className="commits__commit-content">
          <span className="commits__commit-message">
            <Link to={url} target="_blank">
              {message}
            </Link>
          </span>
          <div className="commits__commit-details">
            <span className="commits__commit-author">
              {name}
            </span>
            { ' ' } changed {filesChanged} file{filesChanged === 1 ? '' : 's'}
          </div>
        </div>
      </div>
    );
  }

  renderPicture() {
    const {commitInfo} = this.props;

    if (commitInfo.firstRow) {
      const imageUrl = `${window.config.staticRoot}/images/branch_head.png`;

      return (
        <div className={this.getPictureClassNames()}>
          <Image src={imageUrl} height={25} width={25} classNames="commits__picture-icon" />
        </div>
      );
    }

    return (
      <div className={this.getPictureClassNames()}>
        <Icon type="octicon" name='git-commit' classNames="commits__picture-icon" />
      </div>
    );
  }

  render() {
    return (
      <div className={this.getClassNames()}>
        {this.renderPicture()}
        {this.renderContent()}
        {this.renderTimestamp()}
      </div>
    );
  }
}

CommitDetails.propTypes = {
  commitInfo: PropTypes.object.isRequired
}

export default CommitDetails;

{'fraction_non_alphanumeric': 0.14290780141843973, 'fraction_numerical': 0.0024822695035460994, 'mean_word_length': 2.6440568475452197, 'pattern_counts': {'":': 0, '<': 47, '<?xml version=': 0, '>': 47, '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': '3520423', 'n_tokens_mistral': 1714, 'n_tokens_neox': 1683, 'n_words': 339}