Виртуализированная таблица InfiniteLoader не обновляется

Question

У меня есть компонент («События»), который показывает события в таблице внутри InfiniteLoader. Функция loadMoreRows загружает данные из конечной точки службы. Довольно простой материал. Проблема в том, что таблица не обновляется строками, загруженными с помощью loadMoreRows. В таблице показана только жестко запрограммированная запись, с которой определяется list. Я вижу, что вызывается loadMoreRows и обновляется list. FWIW, этот компонент загружен в панель управления Material-UI.

Мне кажется, что я упускаю что-то простое ... Но я долго бился над этим и полагаю, что должен просто попросите о помощи.

Вот компонент

const list = [
  {
    event: '123123-5eb4-498f-9d3a-123123123123',
    url: 'blahblha',
    category: 'Amazing Widgets',
  },
];

const remoteRowCount = 1000;

export default class Event extends React.PureComponent {
  constructor(props, context) {
    super(props, context);
    const sortDirection = SortDirection.ASC;
    this.props = props;
    this.state = {
      sortDirection,
    };
  }

  isRowLoaded({index}) {
    return !!list[index];
  }

  loadMoreRows({ startIndex, stopIndex }) {
    console.log('finding', startIndex, stopIndex);
    return eventService.find().then(data => {
      for (let i = 0; i < data.length; i++) {
        list.push({
          event: data[i].event_id,
          url: data[i].page_url,
          category: data[i].se_category,
        });
      }
      console.log(list);
    });
  }

  // Render your list
  render() {
    return (
      <InfiniteLoader
        isRowLoaded={this.isRowLoaded}
        loadMoreRows={this.loadMoreRows}
        rowCount={remoteRowCount}
      >
        {({ onRowsRendered, registerChild }) => (
          <Table
            ref={registerChild}
            onRowsRendered={onRowsRendered}
            headerHeight={40}
            width={300}
            height={300}
            rowHeight={40}
            rowCount={list.length}
            rowGetter={({index}) => list[index]}
          >
            <Column label="Event" dataKey="event" width={300}/>
            <Column label="Url" dataKey="url" width={400}/>
            <Column label="Category" dataKey="category" width={100}/>
          </Table>
        )}
      </InfiniteLoader>
    );
  }
}

Вот первые 6 элементов в списке после завершения loadMoreRows.

0: {event: "123123-5eb4-498f-9d3a-123123123123", url: "blahblha", category: "Amazing Widgets"}
1: {event: "dbcbb9af-2ab0-47c1-8acc-94ee1aef451d", url: "blahblha", category: "Bing Bong"}
2: {event: "bd134bbf-a227-4fb4-b3ea-28ae0e267a10", url: "blahblha", category: "Bing Bong"}
3: {event: "9aefce0c-fcbe-4e9e-b20c-28fcff7c6f14", url: "blahblha", category: "Bing Bong"}
4: {event: "32d13a5f-c2d8-448d-9bdf-5f23f95ff12b", url: "blahblha", category: "Bing Bong"}
5: {event: "e0e7d374-5d97-4d63-836e-d31ca302143f", url: "blahblha", category: "Bing Bong"}
6: {event: "88e60b53-3f8e-4e1d-bbd7-ef3fea0ade1d", url: "blahblha", category: "Bing Bong"}

как я уже сказал, я вижу только элемент 0.

ошибок нет

Спасибо!