import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import { createRows } from './TableRow';

class TableHeader extends PureComponent {
  static componentName = 'TableHeader';

  static propTypes = {
    /**
     * Children passed to table footer.
     */
    children: PropTypes.node,
    /**
     * Controls the display of the row to adjust checkbox.
     */
    adjustForCheckbox: PropTypes.bool,
    onChangeOrder: PropTypes.func,
    sortedField: PropTypes.array,
    order: PropTypes.string,
    className: PropTypes.string,
    style: PropTypes.object
  };

  static defaultProps = {
    children: null,
    adjustForCheckbox: false,
    onChangeOrder: null,
    sortedField: null,
    order: 'asc',
    className: '',
    style: {}
  };

  onCellClick = (event, { sort, order }) => {
    const { onChangeOrder } = this.props;
    if (onChangeOrder && sort) {
      onChangeOrder({ sort, order });
    }
  };

  render() {
    const {
      children,
      adjustForCheckbox,
      sortedField,
      order,
      className,
      style
    } = this.props;

    return (
      <thead className={className} style={style}>{createRows({
        children,
        props: {
          adjustForCheckbox,
          onCellClick: this.onCellClick,
          sortedField,
          order
        }
      })}</thead>
    );
  }
}

export default TableHeader;
