<commit_before>import React, { PropTypes } from 'react';
import { Map, List } from 'immutable';
import cx from 'classnames';
import ThreadCommentMore from './thread-comment-more';

const ThreadComment = ({
  comment,
  cache,
  fetchMoreComments,
  shouldExpandChildren,
  toggleExpandChildren,
}) => {
  const data = comment.get('data');
  const commentId = data.get('id');
  const linkId = data.get('link_id');
  const childrenExpanded = shouldExpandChildren(commentId);

  // replies is an empty string if there are no replies
  const children = data.getIn(['replies', 'data', 'children'], List());

  return (
    <section className="pl2 p1 bg-white border rounded mb1">
      <div className="flex">
        <div className="pr1">
          <i
            onClick={() => toggleExpandChildren(commentId)}
            aria-hidden="true"
            className={cx(
            'fa', {
              'fa-chevron-down': childrenExpanded,
              'fa-chevron-right': !childrenExpanded,
            })}
            style={{cursor: 'pointer'}}
          />
        </div>
        <div>
          <div className="h6 blue inline-block rounded">{data.get('author')}</div>
          <p className="mt0">{data.get('body')}</p>
        </div>
      </div>
      <div>
        {
          childrenExpanded
            ? children.map((child, i) => {
              const childKind = child.get('kind');

              if (childKind === 'more') {
                return (
                  <ThreadCommentMore
                    linkId={linkId}
                    toggleExpandChildren={toggleExpandChildren}
                    shouldExpandChildren={shouldExpandChildren}
                    fetchMoreComments={fetchMoreComments}
                    comment={child}
                    cache={cache}
                    key={i} />
                );
              }

              return (
                <ThreadComment
                  toggleExpandChildren={toggleExpandChildren}
                  shouldExpandChildren={shouldExpandChildren}
                  fetchMoreComments={fetchMoreComments}
                  comment={child}
                  cache={cache}
                  key={i} />
              );
            })
          : []
        }
      </div>
    </section>
  );
};

ThreadComment.propTypes = {
  fetchMoreComments: PropTypes.func.isRequired,
  comment: PropTypes.instanceOf(Map).isRequired,
  cache: PropTypes.instanceOf(Map).isRequired,
  toggleExpandChildren: PropTypes.func.isRequired,
  shouldExpandChildren: PropTypes.func.isRequired,
};

export default ThreadComment;
<commit_msg>feat(thread-comment): Add comment score, and age<commit_after>import React, { PropTypes } from 'react';
import { Map, List } from 'immutable';
import cx from 'classnames';
import ThreadCommentMore from './thread-comment-more';

const ThreadComment = ({
  comment,
  cache,
  fetchMoreComments,
  shouldExpandChildren,
  toggleExpandChildren,
}) => {
  const data = comment.get('data');
  const commentId = data.get('id');
  const linkId = data.get('link_id');
  const childrenExpanded = shouldExpandChildren(commentId);

  // replies is an empty string if there are no replies
  const children = data.getIn(['replies', 'data', 'children'], List());

  return (
    <section className="pl2 p1 bg-white border rounded mb1">
      <div className="flex">
        <div className="pr1">
          <i
            onClick={() => toggleExpandChildren(commentId)}
            aria-hidden="true"
            className={cx(
            'fa', {
              'fa-chevron-down': childrenExpanded,
              'fa-chevron-right': !childrenExpanded,
            })}
            style={{cursor: 'pointer'}}
          />
        </div>
        <div>
          <div className="h6 inline-block rounded">
            <span className="blue">
              {data.get('author')}
            </span>
            &nbsp;&nbsp;
            <span className="bold">
              {data.get('score')} points
            </span>
            &nbsp;&nbsp;
            <span className="dark-gray">
              {differenceInHours(Date.now() / 1000, data.get('created'))} hours ago
            </span>
          </div>
          <p className="mt0">{data.get('body')}</p>
        </div>
      </div>
      <div>
        {
          childrenExpanded
            ? children.map((child, i) => {
              const childKind = child.get('kind');

              if (childKind === 'more') {
                return (
                  <ThreadCommentMore
                    linkId={linkId}
                    toggleExpandChildren={toggleExpandChildren}
                    shouldExpandChildren={shouldExpandChildren}
                    fetchMoreComments={fetchMoreComments}
                    comment={child}
                    cache={cache}
                    key={i} />
                );
              }

              return (
                <ThreadComment
                  toggleExpandChildren={toggleExpandChildren}
                  shouldExpandChildren={shouldExpandChildren}
                  fetchMoreComments={fetchMoreComments}
                  comment={child}
                  cache={cache}
                  key={i} />
              );
            })
          : []
        }
      </div>
    </section>
  );
};

function differenceInHours(now, then) {
  const SECONDS_IN_HOUR = 60 * 60;
  return Math.floor((now - then) / SECONDS_IN_HOUR);
}

ThreadComment.propTypes = {
  fetchMoreComments: PropTypes.func.isRequired,
  comment: PropTypes.instanceOf(Map).isRequired,
  cache: PropTypes.instanceOf(Map).isRequired,
  toggleExpandChildren: PropTypes.func.isRequired,
  shouldExpandChildren: PropTypes.func.isRequired,
};

export default ThreadComment;

{'fraction_non_alphanumeric': 0.12258064516129032, 'fraction_numerical': 0.0034873583260680036, 'mean_word_length': 1.8367952522255193, 'pattern_counts': {'":': 0, '<': 43, '<?xml version=': 0, '>': 49, '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': '2248183', 'n_tokens_mistral': 1559, 'n_tokens_neox': 1482, 'n_words': 297}