InfiniteLoader and Table

I’m hitting a wall over here, I think it might be a bug. (Using version 9.13.0, I’ll try this updating a bit later, but the changelog doesn’t make me think it’s fixed?)

So I have a component that’s like this (omitting boilerplate):

rowCount = this.rowCount()

return (
  <InfiniteLoader
    isRowLoaded={this._isRowLoaded}
    loadMoreRows={this._loadMoreRows}
    rowCount={rowCount}
  >
    <Table
      rowGetter={rowGetter}
      rowRenderer={rowRenderer}
      rowCount={rowCount}
    >
      {columns.map(column => <Column {...column} />)}
    </Table>
  </InfiniteLoader>
)

columns is an array of objects with Column’s properties (label, dataKey, width)

The problem arises with InfiniteLoader:

• The component mounts, data isn’t fetched yet, so data = [], data.length = 0
• rowCount is going to be 1(!!!), because there are more available items to be fetched.
• This row is out of the available data: it is not loaded yet, so I would like to render a LoadingRow component for this one row.

Using List instead of Table this is rather simple, in the rowRenderer method check if that row is loaded using isRowLoaded and render accordingly. But I haven’t been able to do the same using Table, because before rowRenderer gets called, I get an Uncaught TypeError in defaultCellDataGetter here:

export default function defaultCellDataGetter(_ref) {
  var dataKey = _ref.dataKey,
      rowData = _ref.rowData;

  if (typeof rowData.get === 'function') {   <<<=== HERE
    return rowData.get(dataKey);
  } else {
    return rowData[dataKey];
  }
}

Because rowData is undefined, and that’s because the rowGetter function is like this rowGetter = (list, index) => list[index]. So before being able to check in rowRenderer whether the row is loaded or not, it crashes in defaultCellDataGetter, because rowData is undefined.

I could get around this just adding cellDataGetter to each column, but it doesn’t look right.

That’s all I think. I don’t know if I’m getting this right (and it is a bug), or if there is another way this should be done.

[christopher-francisco]

@bvaughn Can we just add to the Table docs that rowGetter should not return null nor undefined, but instead an empty object {}?

It took me a while to figure out this was the problem, and I think it might help other devs 😃

[kgregory]

@cristianfraser maybe we should default rowData to an empty object in defaultCellDataGetter?

See any issues with this @bvaughn?