<commit_before>// (C) Copyright 2014-2015 Hewlett Packard Enterprise Development LP

import React, { Component, PropTypes } from 'react';
import Tiles from 'grommet/components/Tiles';
import Tile from 'grommet/components/Tile';
import Footer from 'grommet/components/Footer';
import Box from 'grommet/components/Box';
import Attribute from './Attribute';
import IndexPropTypes from '../utils/PropTypes';
import BulkOperations from './BulkOperations';

const CLASS_ROOT = 'index-tiles';

class IndexTile extends Component {

  render () {
    let { item, selected, onClick, attributes } = this.props;
    let statusValue;
    let headerValues = [];
    let values = [];
    let footerValues = [];

    attributes.forEach(function (attribute) {
      var value = (
        <Attribute key={attribute.name}
          item={item} attribute={attribute} />
      );
      if ('status' === attribute.name) {
        statusValue = value;
      } else if (attribute.header) {
        headerValues.push(value);
      } else if (attribute.footer) {
        footerValues.push(value);
      } else {
        values.push(value);
      }
    }, this);

    let header;
    if (headerValues.length > 0) {
      header = <h4>{headerValues}</h4>;
    }

    let footer;
    if (footerValues.length > 0) {
      footer = (
        <Footer small={true}>
          <span>{footerValues}</span>
        </Footer>
      );
    }

    return (
      <Tile key={item.uri} align="start"
        pad={{horizontal: "medium", vertical: "small"}}
        direction="row" responsive={false}
        onClick={onClick} selected={selected}
        a11yTitle={`Open ${headerValues}`}>
        {statusValue}
        <Box key="contents" direction="column">
          {header}
          {values}
          {footer}
        </Box>
      </Tile>
    );
  }
}

IndexTile.propTypes = {
  attributes: IndexPropTypes.attributes,
  item: PropTypes.object.isRequired,
  onClick: PropTypes.func,
  selected: PropTypes.bool
};

export default class IndexTiles extends Component {

  constructor () {
    super();
    this._onClickTile = this._onClickTile.bind(this);
  }

  _onClickTile (uri) {
    this.props.onSelect(uri);
  }

  _renderTile (item) {
    const { selection, itemComponent } = this.props;
    let onClick;
    if (this.props.onSelect) {
      onClick = this._onClickTile.bind(this, item.uri);
    }
    let selected = false;
    if (selection && item.uri === selection) {
      selected = true;
    }
    let tile;
    if (itemComponent) {
      const Component = itemComponent;
      tile = (
        <Component key={item.uri} item={item} onClick={onClick}
          selected={selected} />
      );
    } else {
      tile = (
        <IndexTile key={item.uri} item={item} onClick={onClick}
          selected={selected} attributes={this.props.attributes} />
      );
    }
    return tile;
  }

  _renderSections (classes, onMore) {
    const { result, selection, sort, bulkOperationsComponent } = this.props;
    const parts = sort.split(':');
    const attributeName = parts[0];
    const direction = parts[1];
    let sections = [];
    let items = result.items.slice(0);
    this.props.sections.forEach((section) => {

      let selectionIndex = undefined;
      let sectionValue = section.value;
      if (sectionValue instanceof Date) {
        sectionValue = sectionValue.getTime();
      }
      let tiles = [];
      let sectionItems = [];

      items.forEach(item => {
        let itemValue = item[attributeName];

        if (undefined === sectionValue ||
          ('asc' === direction && itemValue < sectionValue) ||
          ('desc' === direction && itemValue > sectionValue)) {
          // add it
          if (selection && item.uri === selection) {
            selectionIndex = tiles.length;
          }
          sectionItems.push(item);
          tiles.push(this._renderTile(item));
        }
      });


      if (tiles.length > 0) {
        // only use onMore for last section
        let sectionTiles = (
          <Tiles key={section.label}
            onMore={items.length === 0 ? onMore : undefined}
            flush={this.props.flush} fill={this.props.fill}
            selectable={this.props.onSelect ? true : false}
            selected={selectionIndex}
            size={this.props.size}>
            {tiles}
          </Tiles><commit_msg>revert loop over items logic in sections<commit_after>// (C) Copyright 2014-2015 Hewlett Packard Enterprise Development LP

import React, { Component, PropTypes } from 'react';
import Tiles from 'grommet/components/Tiles';
import Tile from 'grommet/components/Tile';
import Footer from 'grommet/components/Footer';
import Box from 'grommet/components/Box';
import Attribute from './Attribute';
import IndexPropTypes from '../utils/PropTypes';
import BulkOperations from './BulkOperations';

const CLASS_ROOT = 'index-tiles';

class IndexTile extends Component {

  render () {
    let { item, selected, onClick, attributes } = this.props;
    let statusValue;
    let headerValues = [];
    let values = [];
    let footerValues = [];

    attributes.forEach(function (attribute) {
      var value = (
        <Attribute key={attribute.name}
          item={item} attribute={attribute} />
      );
      if ('status' === attribute.name) {
        statusValue = value;
      } else if (attribute.header) {
        headerValues.push(value);
      } else if (attribute.footer) {
        footerValues.push(value);
      } else {
        values.push(value);
      }
    }, this);

    let header;
    if (headerValues.length > 0) {
      header = <h4>{headerValues}</h4>;
    }

    let footer;
    if (footerValues.length > 0) {
      footer = (
        <Footer small={true}>
          <span>{footerValues}</span>
        </Footer>
      );
    }

    return (
      <Tile key={item.uri} align="start"
        pad={{horizontal: "medium", vertical: "small"}}
        direction="row" responsive={false}
        onClick={onClick} selected={selected}
        a11yTitle={`Open ${headerValues}`}>
        {statusValue}
        <Box key="contents" direction="column">
          {header}
          {values}
          {footer}
        </Box>
      </Tile>
    );
  }
}

IndexTile.propTypes = {
  attributes: IndexPropTypes.attributes,
  item: PropTypes.object.isRequired,
  onClick: PropTypes.func,
  selected: PropTypes.bool
};

export default class IndexTiles extends Component {

  constructor () {
    super();
    this._onClickTile = this._onClickTile.bind(this);
  }

  _onClickTile (uri) {
    this.props.onSelect(uri);
  }

  _renderTile (item) {
    const { selection, itemComponent } = this.props;
    let onClick;
    if (this.props.onSelect) {
      onClick = this._onClickTile.bind(this, item.uri);
    }
    let selected = false;
    if (selection && item.uri === selection) {
      selected = true;
    }
    let tile;
    if (itemComponent) {
      const Component = itemComponent;
      tile = (
        <Component key={item.uri} item={item} onClick={onClick}
          selected={selected} />
      );
    } else {
      tile = (
        <IndexTile key={item.uri} item={item} onClick={onClick}
          selected={selected} attributes={this.props.attributes} />
      );
    }
    return tile;
  }

  _renderSections (classes, onMore) {
    const { result, selection, sort, bulkOperationsComponent } = this.props;
    const parts = sort.split(':');
    const attributeName = parts[0];
    const direction = parts[1];
    let sections = [];
    let items = result.items.slice(0);
    this.props.sections.forEach((section) => {

      let selectionIndex = undefined;
      let sectionValue = section.value;
      if (sectionValue instanceof Date) {
        sectionValue = sectionValue.getTime();
      }
      let tiles = [];
      let sectionItems = [];

      while (items.length > 0) {
        const item = items[0];
        let itemValue = (item.hasOwnProperty(attributeName) ?
          item[attributeName] : item.attributes[attributeName]);
        if (itemValue instanceof Date) {
          itemValue = itemValue.getTime();
        }
        if (undefined === sectionValue ||
          ('asc' === direction && itemValue < sectionValue) ||
          ('desc' === direction && itemValue > sectionValue)) {
          // add it
          items.shift();
          if (selection && item.uri === selection) {
            selectionIndex = tiles.length;
          }
          sectionItems.push(item);
          tiles.push(this._renderTile(item));
        } else {
          // done
          break;
        }
      }

      if (tiles.length > 0) {
        // only use onMore for last section
        let sectionTiles = (
          <Tiles key={section.label}
            onMore={items.length === 0 ? onMore : undefined}
            flush={this.props.flush} fill={this.props.fill}
            selectable={this.props.onSelect ? true : false}
            selected={selectionIndex}
            size={this.props.size}>
            {tiles}
          </Tiles>
{'fraction_non_alphanumeric': 0.13259176863181313, 'fraction_numerical': 0.004449388209121246, 'mean_word_length': 2.3213889915035093, 'pattern_counts': {'":': 0, '<': 35, '<?xml version=': 0, '>': 45, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3681767', 'n_tokens_mistral': 2592, 'n_tokens_neox': 2553, 'n_words': 596}