<commit_before>import React, {Component, PropTypes} from 'react'
import {AgGridReact} from 'ag-grid-react'
import debounce from 'lodash.debounce'

/* global document */
/* global window */

export class DataTable extends Component {
  static propTypes = {
    autoResize: PropTypes.bool,
    checkboxColumn: PropTypes.any,
    checkboxColumnConfig: PropTypes.object,
    columns: PropTypes.array.isRequired,
    data: PropTypes.array.isRequired,
    resizeDelay: PropTypes.number,
    stripeRows: PropTypes.bool
  }

  static defaultProps = {
    autoResize: true,
    checkboxColumn: false,
    checkboxColumnConfig: {},
    resizeDelay: 100,
    stripeRows: true
  }

  handleResize (grid) {
    if (!this.props.autoResize) {
      return
    }

    grid.api.sizeColumnsToFit()
  }

  componentDidMount () {
    const {grid} = this.refs
    const {resizeDelay} = this.props

    this.handleResize(grid)

    this.handleResize = debounce(this.handleResize.bind(this, grid), resizeDelay)

    window.addEventListener('resize', this.handleResize)
  }
  
  componentDidUpdate () {
    this.handleResize(this.refs.grid)
  }

  componentWillUnmount () {
    const {grid} = this.refs

    window.removeEventListener('resize', this.handleResize)
    grid.api.destroy()
  }

  headerCellRendererFunc (params) {
    const {api} = params
    const cb = document.createElement('input')<commit_msg>closes #45. add shouldComponentUpdate to DataTable to prevent re-renders<commit_after>import React, {Component, PropTypes} from 'react'
import {AgGridReact} from 'ag-grid-react'
import debounce from 'lodash.debounce'

/* global document */
/* global window */

export class DataTable extends Component {
  static propTypes = {
    autoResize: PropTypes.bool,
    checkboxColumn: PropTypes.any,
    checkboxColumnConfig: PropTypes.object,
    columns: PropTypes.array.isRequired,
    data: PropTypes.array.isRequired,
    resizeDelay: PropTypes.number,
    stripeRows: PropTypes.bool
  }

  static defaultProps = {
    autoResize: true,
    checkboxColumn: false,
    checkboxColumnConfig: {},
    resizeDelay: 100,
    stripeRows: true
  }

  handleResize (grid) {
    if (!this.props.autoResize) {
      return
    }

    grid.api.sizeColumnsToFit()
  }

  shouldComponentUpdate (nextProps) {
    let shouldUpdate = false

    Object.keys(this.props).forEach((key) => {
      if (this.props[key] === nextProps[key]) {
        return
      }

      shouldUpdate = true
    })

    return shouldUpdate
  }

  componentDidMount () {
    const {grid} = this.refs
    const {resizeDelay} = this.props

    this.handleResize(grid)

    this.handleResize = debounce(this.handleResize.bind(this, grid), resizeDelay)

    window.addEventListener('resize', this.handleResize)
  }

  componentDidUpdate () {
    this.handleResize(this.refs.grid)
  }

  componentWillUnmount () {
    const {grid} = this.refs

    window.removeEventListener('resize', this.handleResize)
    grid.api.destroy()
  }

  headerCellRendererFunc (params) {
    const {api} = params
    const cb = document.createElement('input')
{'fraction_non_alphanumeric': 0.11035378123985719, 'fraction_numerical': 0.002596559558584875, 'mean_word_length': 3.4091559370529327, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 4, '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': '7362438', 'n_tokens_mistral': 955, 'n_tokens_neox': 934, 'n_words': 195}