Update react-virtualized list when data in redux state gets updated

Question

I have react-virtualized list that gets populated with data that comes from an API call which stores fetched data in the redux store. An action to begin fetching data from the API is dispatched when the component mounts, the data arrives and gets saved in the store but the react-virtualized list doesn't get updated with this data until the page is manually refreshed a couple of times before the data shows up in the List. Also there is an API poll running in the background to fetch updated data which will then get displayed in the list.

How do I configure the List to listen for when data arrives and displays the data accordingly (To listen for changes to the redux store). Here is my implementation of the react-virtualized InfiniteLoader & List:

< InfiniteLoader
isRowLoaded = {
  this._isRowLoaded
}
loadMoreRows = {
  this._loadMoreRows
}
rowCount = {
    visibleRequest.length
  } > {
    ({
      onRowsRendered,
      registerChild
    }) => ( <
      AutoSizer > {
        ({
          height,
          width
        }) => (
          <List ref = {ref => (this.registerChild = ref)}
          className = "List"
          height = {height}
          rowHeight = {listRowHeight}
          onRowsRendered = {onRowsRendered}
          rowCount = {rowCount}
          rowRenderer = {this._rowRenderer}
          width = {width}
          />
        )
      }
      </AutoSizer>
    )
  }
  </InfiniteLoader>

// rowRenderer function
_rowRenderer = ({
  index,
  key,
  style
}) => {
  const {
    loadedRowsMap,
    selected
  } = this.state;
  const row = this.getDatum(index);
  let content;
  if (loadedRowsMap[index] === STATUS_LOADED) {
    content = row;
  } else {
    content = ( <div className = "placeholder"
      style = {
        {
          width: _.random(100, 200)
        }
      }
      />
    );
  }
  return ( <NewRequest key = {key}
    content = {content}
    style = {style}
    row = {row}
    {...this.props}
    />
  );
};