Refactor Indexer index to use react-window

(cherry picked from commit d022679b7dcbce3cec98e6a1fd0879e3c0d92523)

frontend/src/Search/Mobile/SearchIndexOverview.css.d.ts

@@ -0,0 +1,14 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'actions': string;
+  'container': string;
+  'content': string;
+  'indexerRow': string;
+  'info': string;
+  'infoRow': string;
+  'title': string;
+  'titleRow': string;
+}
+export const cssExports: CssExports;
+export default cssExports;

frontend/src/Search/Mobile/SearchIndexOverviews.css.d.ts

@@ -0,0 +1,9 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'container': string;
+  'content': string;
+  'grid': string;
+}
+export const cssExports: CssExports;
+export default cssExports;

frontend/src/Search/NoSearchResults.css.d.ts

@@ -0,0 +1,7 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'message': string;
+}
+export const cssExports: CssExports;
+export default cssExports;

frontend/src/Search/QueryParameterModal.css.d.ts

@@ -0,0 +1,11 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'footNote': string;
+  'groups': string;
+  'icon': string;
+  'namingSelect': string;
+  'namingSelectContainer': string;
+}
+export const cssExports: CssExports;
+export default cssExports;

frontend/src/Search/QueryParameterOption.css.d.ts

@@ -0,0 +1,13 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'example': string;
+  'footNote': string;
+  'isFullFilename': string;
+  'large': string;
+  'option': string;
+  'small': string;
+  'token': string;
+}
+export const cssExports: CssExports;
+export default cssExports;

frontend/src/Search/SearchFooter.css.d.ts

@@ -0,0 +1,13 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'buttonContainer': string;
+  'buttonContainerContent': string;
+  'buttons': string;
+  'indexerContainer': string;
+  'inputContainer': string;
+  'searchButton': string;
+  'selectedReleasesLabel': string;
+}
+export const cssExports: CssExports;
+export default cssExports;

frontend/src/Search/SearchFooterLabel.css.d.ts

@@ -0,0 +1,8 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'label': string;
+  'savingIcon': string;
+}
+export const cssExports: CssExports;
+export default cssExports;

frontend/src/Search/SearchIndex.css.d.ts

@@ -0,0 +1,12 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'contentBody': string;
+  'contentBodyContainer': string;
+  'errorMessage': string;
+  'pageContentBodyWrapper': string;
+  'postersInnerContentBody': string;
+  'tableInnerContentBody': string;
+}
+export const cssExports: CssExports;
+export default cssExports;

frontend/src/Search/SearchIndex.js

@@ -43,6 +43,8 @@ class SearchIndex extends Component {
   constructor(props, context) {
     super(props, context);
 
+    this.scrollerRef = React.createRef();
+
     this.state = {
       scroller: null,
       jumpBarItems: { order: [] },
@@ -85,10 +87,6 @@ class SearchIndex extends Component {
   //
   // Control
 
-  setScrollerRef = (ref) => {
-    this.setState({ scroller: ref });
-  };
-
   getSelectedIds = () => {
     if (this.state.allUnselected) {
       return [];
@@ -236,7 +234,6 @@ class SearchIndex extends Component {
       customFilters,
       sortKey,
       sortDirection,
-      onScroll,
       onSortSelect,
       onFilterSelect,
       isSmallScreen,
@@ -245,7 +242,6 @@ class SearchIndex extends Component {
     } = this.props;
 
     const {
-      scroller,
       jumpBarItems,
       jumpToCharacter,
       selectedState,
@@ -256,7 +252,7 @@ class SearchIndex extends Component {
     const selectedIndexerIds = this.getSelectedIds();
 
     const ViewComponent = getViewComponent(isSmallScreen);
-    const isLoaded = !!(!error && isPopulated && items.length && scroller);
+    const isLoaded = !!(!error && isPopulated && items.length && this.scrollerRef.current);
     const hasNoIndexer = !totalItems;
 
     return (
@@ -297,10 +293,9 @@ class SearchIndex extends Component {
 
         <div className={styles.pageContentBodyWrapper}>
           <PageContentBody
-            registerScroller={this.setScrollerRef}
+            ref={this.scrollerRef}
             className={styles.contentBody}
             innerClassName={styles.tableInnerContentBody}
-            onScroll={onScroll}
           >
             {
               isFetching && !isPopulated &&
@@ -318,7 +313,7 @@ class SearchIndex extends Component {
               isLoaded &&
                 <div className={styles.contentBodyContainer}>
                   <ViewComponent
-                    scroller={scroller}
+                    scroller={this.scrollerRef.current}
                     items={items}
                     filters={filters}
                     sortKey={sortKey}
@@ -393,7 +388,6 @@ SearchIndex.propTypes = {
   onFilterSelect: PropTypes.func.isRequired,
   onSearchPress: PropTypes.func.isRequired,
   onBulkGrabPress: PropTypes.func.isRequired,
-  onScroll: PropTypes.func.isRequired,
   hasIndexers: PropTypes.bool.isRequired
 };
 

frontend/src/Search/SearchIndexConnector.js

@@ -4,7 +4,6 @@ import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 import withScrollPosition from 'Components/withScrollPosition';
 import { bulkGrabReleases, cancelFetchReleases, clearReleases, fetchReleases, setReleasesFilter, setReleasesSort, setReleasesTableOption } from 'Store/Actions/releaseActions';
-import scrollPositions from 'Store/scrollPositions';
 import createDimensionsSelector from 'Store/Selectors/createDimensionsSelector';
 import createReleaseClientSideCollectionItemsSelector from 'Store/Selectors/createReleaseClientSideCollectionItemsSelector';
 import SearchIndex from './SearchIndex';
@@ -67,10 +66,6 @@ class SearchIndexConnector extends Component {
     this.props.dispatchClearReleases();
   }
 
-  onScroll = ({ scrollTop }) => {
-    scrollPositions.movieIndex = scrollTop;
-  };
-
   //
   // Render
 

frontend/src/Search/Table/ProtocolLabel.css.d.ts

@@ -0,0 +1,8 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'torrent': string;
+  'usenet': string;
+}
+export const cssExports: CssExports;
+export default cssExports;

frontend/src/Search/Table/SearchIndexHeader.css.d.ts

@@ -0,0 +1,17 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'actions': string;
+  'age': string;
+  'category': string;
+  'files': string;
+  'grabs': string;
+  'indexer': string;
+  'indexerFlags': string;
+  'peers': string;
+  'protocol': string;
+  'size': string;
+  'title': string;
+}
+export const cssExports: CssExports;
+export default cssExports;

frontend/src/Search/Table/SearchIndexRow.css.d.ts

@@ -0,0 +1,21 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'actions': string;
+  'age': string;
+  'category': string;
+  'cell': string;
+  'checkInput': string;
+  'downloadLink': string;
+  'externalLinks': string;
+  'files': string;
+  'grabs': string;
+  'indexer': string;
+  'indexerFlags': string;
+  'peers': string;
+  'protocol': string;
+  'size': string;
+  'title': string;
+}
+export const cssExports: CssExports;
+export default cssExports;

frontend/src/Search/Table/SearchIndexTable.css.d.ts

@@ -0,0 +1,7 @@
+// This file is automatically generated.
+// Please do not change this file!
+interface CssExports {
+  'tableContainer': string;
+}
+export const cssExports: CssExports;
+export default cssExports;