<commit_before>import React, { Component, PropTypes } from 'react';
import { Cell } from 'fixed-data-table-2';
import { ASC, DESC, NONE } from '../../constants';
import ColumnFilter from '../ColumnFilter';

function renderArrow(direction) {
  switch(direction) {
    case ASC:
      return '↑';
    case DESC:
      return '↓';
    default:
      return '';
  }
}

function Header(props) {

  const { columnKey, height, width, children, onClick, sortDir, value, onChange, filter, displayFilter, filterText } = props;

  function handleOnClick() {
    onClick(columnKey);
  }

  function handleOnChange(e) {
      onChange(e, columnKey);
  }

  return (
    <div>
      <Cell onClick={handleOnClick}>
        {children} {renderArrow(sortDir)}
      </Cell>

      {
        displayFilter && <ColumnFilter value={filter} onChange={handleOnChange} />
      }

    </div>
  );
}


// See https://facebook.github.io/react/docs/typechecking-with-proptypes.html
Header.propTypes = {
  children: PropTypes.any.isRequired,
  columnKey: PropTypes.string,
  height: PropTypes.number,
  width: PropTypes.number,
  sortDir: PropTypes.oneOf([ASC, DESC, NONE]),
  onClick: PropTypes.func,
  displayFilter: PropTypes.any.isRequired,
};

Header.defaultProps = {
  sortDir: NONE,
};

export default Header;<commit_msg>added custom header classname<commit_after>import React, { Component, PropTypes } from 'react';
import { Cell } from 'fixed-data-table-2';
import { ASC, DESC, NONE } from '../../constants';
import ColumnFilter from '../ColumnFilter';

function renderArrow(direction) {
  switch(direction) {
    case ASC:
      return '↑';
    case DESC:
      return '↓';
    default:
      return '';
  }
}

function Header(props) {

  const { columnKey, height, width, children, onClick, sortDir, value, onChange, filter, displayFilter, filterText } = props;

  function handleOnClick() {
    onClick(columnKey);
  }

  function handleOnChange(e) {
      onChange(e, columnKey);
  }

  return (
    <div className={'flybaseDataGrid_header'}>
      <Cell onClick={handleOnClick}>
        {children} {renderArrow(sortDir)}
      </Cell>

      {
        displayFilter && <ColumnFilter value={filter} onChange={handleOnChange} />
      }

    </div>
  );
}


// See https://facebook.github.io/react/docs/typechecking-with-proptypes.html
Header.propTypes = {
  children: PropTypes.any.isRequired,
  columnKey: PropTypes.string,
  height: PropTypes.number,
  width: PropTypes.number,
  sortDir: PropTypes.oneOf([ASC, DESC, NONE]),
  onClick: PropTypes.func,
  displayFilter: PropTypes.any.isRequired,
};

Header.defaultProps = {
  sortDir: NONE,
};

export default Header;
{'fraction_non_alphanumeric': 0.13908782510365625, 'fraction_numerical': 0.0007538635506973238, 'mean_word_length': 3.4455611390284755, 'pattern_counts': {'":': 0, '<': 13, '<?xml version=': 0, '>': 13, 'https://': 2, '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': '1054093', 'n_tokens_mistral': 826, 'n_tokens_neox': 845, 'n_words': 187}