<commit_before>import { h, Component } from 'preact';
import { ViewRow, ColumnInfo } from '../store/types';
import { connect } from './hoc';
import { cls } from '../helper/dom';
import { DispatchProps } from '../dispatch/create';
import { debounce } from '../helper/common';
import { RowSpanCell } from './rowSpanCell';

interface OwnProps {
  rowIndex: number;
  viewRow: ViewRow;
  columns: ColumnInfo[];
}

interface StoreProps {
  rowHeight: number;
  autoRowHeight: boolean;
}

type Props = OwnProps & StoreProps & DispatchProps;

class BodyRowComp extends Component<Props> {
  private renderedRowHeight = this.props.rowHeight;

  // This debounced function is aimed to wait until setTimeout(.., 0) calls
  // from the all child BodyCell components is made.
  // 10ms is just an approximate number. (smaller than 10ms might be safe enough)
  private updateRowHeightDebounced = debounce(() => {
    const { dispatch, rowIndex, rowHeight } = this.props;

    if (rowHeight !== this.renderedRowHeight) {
      dispatch('setRowHeight', rowIndex, this.renderedRowHeight);
    }
  }, 10);

  private refreshRowHeight = (cellHeight: number) => {
    this.renderedRowHeight = Math.max(cellHeight, this.renderedRowHeight);
    this.updateRowHeightDebounced();
  };

  public render({ rowIndex, viewRow, columns, rowHeight, autoRowHeight }: Props) {
    const isOddRow = rowIndex % 2 === 0;

    return (
      <tr
        style={{ height: rowHeight }}
        class={cls([isOddRow, 'row-odd'], [!isOddRow, 'row-even'], [!rowHeight, 'row-hidden'])}
      >
        {columns.map((columnInfo) => {
          // Pass row object directly instead of passing value of it only,
          // so that BodyCell component can watch the change of value using selector function.
          return (
            <RowSpanCell
              key={columnInfo.name}
              viewRow={viewRow}
              columnInfo={columnInfo}
              refreshRowHeight={autoRowHeight ? this.refreshRowHeight : null}
            />
          );
        })}
      </tr>
    );
  }
}

export const BodyRow = connect<StoreProps, OwnProps>(({ rowCoords, dimension }, { rowIndex }) => ({
  rowHeight: rowCoords.heights[rowIndex],
  autoRowHeight: dimension.autoRowHeight
}))(BodyRowComp);<commit_msg>fix: add border width on auto row height (#446)<commit_after>import { h, Component } from 'preact';
import { ViewRow, ColumnInfo } from '../store/types';
import { connect } from './hoc';
import { cls } from '../helper/dom';
import { DispatchProps } from '../dispatch/create';
import { debounce } from '../helper/common';
import { RowSpanCell } from './rowSpanCell';

interface OwnProps {
  rowIndex: number;
  viewRow: ViewRow;
  columns: ColumnInfo[];
}

interface StoreProps {
  rowHeight: number;
  autoRowHeight: boolean;
  cellBorderWidth: number;
}

type Props = OwnProps & StoreProps & DispatchProps;

class BodyRowComp extends Component<Props> {
  private renderedRowHeight = this.props.rowHeight;

  // This debounced function is aimed to wait until setTimeout(.., 0) calls
  // from the all child BodyCell components is made.
  // 10ms is just an approximate number. (smaller than 10ms might be safe enough)
  private updateRowHeightDebounced = debounce(() => {
    const { dispatch, rowIndex, rowHeight } = this.props;

    if (rowHeight !== this.renderedRowHeight) {
      dispatch('setRowHeight', rowIndex, this.renderedRowHeight);
    }
  }, 10);

  private refreshRowHeight = (cellHeight: number) => {
    this.renderedRowHeight =
      Math.max(cellHeight, this.renderedRowHeight) + this.props.cellBorderWidth;
    this.updateRowHeightDebounced();
  };

  public render({ rowIndex, viewRow, columns, rowHeight, autoRowHeight }: Props) {
    const isOddRow = rowIndex % 2 === 0;

    return (
      <tr
        style={{ height: rowHeight }}
        class={cls([isOddRow, 'row-odd'], [!isOddRow, 'row-even'], [!rowHeight, 'row-hidden'])}
      >
        {columns.map((columnInfo) => {
          // Pass row object directly instead of passing value of it only,
          // so that BodyCell component can watch the change of value using selector function.
          return (
            <RowSpanCell
              key={columnInfo.name}
              viewRow={viewRow}
              columnInfo={columnInfo}
              refreshRowHeight={autoRowHeight ? this.refreshRowHeight : null}
            />
          );
        })}
      </tr>
    );
  }
}

export const BodyRow = connect<StoreProps, OwnProps>(({ rowCoords, dimension }, { rowIndex }) => ({
  rowHeight: rowCoords.heights[rowIndex],
  autoRowHeight: dimension.autoRowHeight,
  cellBorderWidth: dimension.cellBorderWidth
}))(BodyRowComp);
{'fraction_non_alphanumeric': 0.12446535500427716, 'fraction_numerical': 0.004491017964071856, 'mean_word_length': 3.109841827768014, 'pattern_counts': {'":': 0, '<': 13, '<?xml version=': 0, '>': 21, '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': '7351207', 'n_tokens_mistral': 1372, 'n_tokens_neox': 1331, 'n_words': 376}