/*
 * Copyright (C) Pootle contributors.
 *
 * This file is a part of the Pootle project. It is distributed under the GPL3
 * or later license. See the LICENSE file for a copy of the license and the
 * AUTHORS file for copyright and authorship information.
 */

'use strict';

import cx from 'classnames';
import React from 'react';


let ItemTable = React.createClass({

  propTypes: {
    fields: React.PropTypes.array.isRequired,
    items: React.PropTypes.object.isRequired,
    resultsCaption: React.PropTypes.string.isRequired,
    selectedItem: React.PropTypes.object,
    onSelectItem: React.PropTypes.func.isRequired,
  },

  render() {
    let createRow = function (item, index) {
      return (
        <ItemTableRow
          fields={this.props.fields}
          key={item.id}
          item={item}
          index={index}
          selectedItem={this.props.selectedItem}
          onSelectItem={this.props.onSelectItem} />
        );
      };

    return (
      <table>
        <caption>{this.props.resultsCaption}</caption>
        <tbody>
        {this.props.items.map(createRow.bind(this))}
        </tbody>
      </table>
    );
  }

});


let ItemTableRow = React.createClass({

  propTypes: {
    fields: React.PropTypes.array.isRequired,
    item: React.PropTypes.object.isRequired,
    index: React.PropTypes.number.isRequired,
    selectedItem: React.PropTypes.object,
    onSelectItem: React.PropTypes.func.isRequired,
  },

  render() {
    let { item } = this.props;
    let { selectedItem } = this.props;
    let { index } = this.props;
    let values = item.toJSON();

    values.index = index + 1;
    let createColumn = function (field, i) {
      return <td key={i}>{values[field]}</td>;
    };

    let classNames = cx({
      'is-selected': selectedItem && item.id === selectedItem.id,
      // FIXME: this is too coupled to certain item types
      'is-disabled': item.get('disabled'),
      'row-divider': index !== 0 && index % 10 === 0,
    });

    return (
      <tr className={classNames}
          key={item.id}
          onClick={this.props.onSelectItem.bind(null, item)}>
        {this.props.fields.map(createColumn)}
      </tr>
    );
  }

});


export default ItemTable;
