<commit_before>import Immutable from 'immutable';
import moment from 'moment';
import { Component, PropTypes } from 'react';
import { Table, TableHeader, TableHeaderColumn, TableBody, TableRow, TableRowColumn } from 'material-ui/Table';

import { ZERO, MINUS_ONE } from './../../../constants/Constants';

const inlineStyles = {
  wrapWordColumn: {
    whiteSpace: 'normal',
    wordWrap: 'break-word',
  },
};

export class ArticlesTable extends Component {
  static propTypes = {
    articles: PropTypes.instanceOf(Immutable.List).isRequired,
    handleOnRowSelection: PropTypes.func.isRequired,
    selectedRows: PropTypes.oneOfType([
      PropTypes.string,
      PropTypes.array,
    ]),
  }

  render() {
    return (
      <Table
        multiSelectable
        onRowSelection={this.props.handleOnRowSelection}
      >
        <TableHeader>
          <TableRow>
            <TableHeaderColumn>{'Title'}</TableHeaderColumn>
            <TableHeaderColumn>{'Saved'}</TableHeaderColumn>
            <TableHeaderColumn>{'Read'}</TableHeaderColumn>
          </TableRow>
        </TableHeader>
        <TableBody
          deselectOnClickaway={false}
          showRowHover
        >
          {this.props.articles.map((item, i) => { // eslint-disable-line
            return (
              <TableRow
                key={i}
                selected={this.props.selectedRows.indexOf(i) !== MINUS_ONE}
              >
                <TableRowColumn style={inlineStyles.wrapWordColumn}>
                  <a
                    href={item.get('url')}
                    target="_blank"
                  >
                    {item.get('title')}
                  </a>
                </TableRowColumn>
                <TableRowColumn>{moment(item.get('timestamp')).format('ll')}</TableRowColumn>
                <TableRowColumn>{item.get('read') ? moment(item.get('read')).format('ll') : 'No'}</TableRowColumn>
              </TableRow>
            );
          })}
        </TableBody>
      </Table>
    );
  }
}

export const getSelectedArticles = (articles, selectedRows) => {
  if (articles.isEmpty() ||
      selectedRows === 'none' ||
      (Array.isArray(selectedRows) && selectedRows.length === ZERO)) {
    return Immutable.fromJS([]);
  }

  if (selectedRows === 'all') {
    return articles;
  }

  return articles.filter((x, i) => selectedRows.includes(i));
};<commit_msg>Sort articles in the table: unread and newest articles first.<commit_after>import Immutable from 'immutable';
import moment from 'moment';
import { Component, PropTypes } from 'react';
import { Table, TableHeader, TableHeaderColumn, TableBody, TableRow, TableRowColumn } from 'material-ui/Table';

import { ZERO, ONE, MINUS_ONE } from './../../../constants/Constants';

const inlineStyles = {
  wrapWordColumn: {
    whiteSpace: 'normal',
    wordWrap: 'break-word',
  },
};

const comparator = (articleA, articleB) => {
  const timestampA = articleA.get('timestamp');
  const timestampB = articleB.get('timestamp');
  const readA = articleA.get('read');
  const readB = articleB.get('read');

  const compareDates = (momentA, momentB) => {
    if (momentA > momentB) {
      return MINUS_ONE;
    } else if (momentA < momentB) {
      return ONE;
    }

    return ZERO;
  };

  if (readA && !readB) {
    return ONE;
  } else if (!readA && readB) {
    return MINUS_ONE;
  } else if (readA && readB) {
    return compareDates(moment(readA), moment(readB));
  }

  return compareDates(moment(timestampA), moment(timestampB));
};

export class ArticlesTable extends Component {
  static propTypes = {
    articles: PropTypes.instanceOf(Immutable.List).isRequired,
    handleOnRowSelection: PropTypes.func.isRequired,
    selectedRows: PropTypes.oneOfType([
      PropTypes.string,
      PropTypes.array,
    ]),
  }

  render() {
    return (
      <Table
        multiSelectable
        onRowSelection={this.props.handleOnRowSelection}
      >
        <TableHeader>
          <TableRow>
            <TableHeaderColumn>{'Title'}</TableHeaderColumn>
            <TableHeaderColumn>{'Saved'}</TableHeaderColumn>
            <TableHeaderColumn>{'Read'}</TableHeaderColumn>
          </TableRow>
        </TableHeader>
        <TableBody
          deselectOnClickaway={false}
          showRowHover
        >
        {this.props.articles.sort(comparator).map((item, i) => { // eslint-disable-line
          return (
            <TableRow
              key={i}
              selected={this.props.selectedRows.indexOf(i) !== MINUS_ONE}
            >
              <TableRowColumn style={inlineStyles.wrapWordColumn}>
                <a
                  href={item.get('url')}
                  target="_blank"
                >
                  {item.get('title')}
                </a>
              </TableRowColumn>
              <TableRowColumn>{moment(item.get('timestamp')).format('ll')}</TableRowColumn>
              <TableRowColumn>{item.get('read') ? moment(item.get('read')).format('ll') : 'No'}</TableRowColumn>
            </TableRow>
          );
        })}
        </TableBody>
      </Table>
    );
  }
}

export const getSelectedArticles = (articles, selectedRows) => {
  if (articles.isEmpty() ||
      selectedRows === 'none' ||
      (Array.isArray(selectedRows) && selectedRows.length === ZERO)) {
    return Immutable.fromJS([]);
  }

  if (selectedRows === 'all') {
    return articles;
  }

  return articles.filter((x, i) => selectedRows.includes(i));
};
{'fraction_non_alphanumeric': 0.1411312465678199, 'fraction_numerical': 0.0, 'mean_word_length': 2.3256238587948874, 'pattern_counts': {'":': 0, '<': 52, '<?xml version=': 0, '>': 60, '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': '971727', 'n_tokens_mistral': 1579, 'n_tokens_neox': 1570, 'n_words': 284}