How is possible to combine InfiniteLoader with WindowScroller? - react-virtualized

Question

How can I create an infinite scroll list but in a window scroller? (the same as Facebook timeline - Mock up)?
Below is the code that I have tried, but it does not work as expected. It only displays the first items and after that it does not display anything more.
<div className={styles.WindowScrollerWrapper}>
<InfiniteLoader
isRowLoaded={this._isRowLoaded}
loadMoreRows={this._loadMoreRows}
rowCount={list.size}
threshold={10}>
{({ onRowsRendered, registerChild }) => (
<WindowScroller>
{({ height, isScrolling, scrollTop }) => (
<AutoSizer disableHeight>
{({ width }) => (
<List
ref={registerChild}
className={styles.List}
autoHeight
height={height}
width={width}
onRowsRendered={onRowsRendered}
rowCount={list.size}
rowHeight={30}
rowRenderer={this._rowRenderer}
scrollToIndex={randomScrollToIndex}
/>
)}
</AutoSizer>
)}
</WindowScroller>
)}
</InfiniteLoader>
</div>
Many thanks in advance.
Update
Here is the URL to demo: https://plnkr.co/edit/akyEpZ0cXhfs2jtZgQmN

Answer 1

Based on your Plnkr, here's a corrected Plnkr that shows how it should work. (You were forgetting to pass the scrollTop param from WindowScroller to the child List.)
Here you go:
<InfiniteLoader
isRowLoaded={this._isRowLoaded}
loadMoreRows={this._loadMoreRows}
rowCount={list.size}
threshold={10}>
{({ onRowsRendered, registerChild }) => (
<WindowScroller>
{({ height, isScrolling, scrollTop }) => (
<AutoSizer disableHeight>
{({ width }) => (
<List
ref={registerChild}
className="List"
autoHeight
height={height}
width={width}
onRowsRendered={onRowsRendered}
rowCount={list.size}
rowHeight={30}
rowRenderer={this._rowRenderer}
scrollTop={scrollTop} />
)}
</AutoSizer>
)}
</WindowScroller>
)}
</InfiniteLoader>