Improve series index performance during series refresh

frontend/src/Series/Index/SeriesIndex.js

@@ -22,7 +22,7 @@ import SeriesIndexOverviewsConnector from './Overview/SeriesIndexOverviewsConnec
 import SeriesIndexFilterMenu from './Menus/SeriesIndexFilterMenu';
 import SeriesIndexSortMenu from './Menus/SeriesIndexSortMenu';
 import SeriesIndexViewMenu from './Menus/SeriesIndexViewMenu';
-import SeriesIndexFooter from './SeriesIndexFooter';
+import SeriesIndexFooterConnector from './SeriesIndexFooterConnector';
 import styles from './SeriesIndex.css';
 
 function getViewComponent(view) {
@@ -330,9 +330,7 @@ class SeriesIndex extends Component {
                     {...otherProps}
                   />
 
-                  <SeriesIndexFooter
-                    series={items}
-                  />
+                  <SeriesIndexFooterConnector />
                 </div>
             }
 

frontend/src/Series/Index/SeriesIndexConnector.js

@@ -2,7 +2,7 @@ import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
-import createClientSideCollectionSelector from 'Store/Selectors/createClientSideCollectionSelector';
+import createSeriesClientSideCollectionItemsSelector from 'Store/Selectors/createSeriesClientSideCollectionItemsSelector';
 import dimensions from 'Styles/Variables/dimensions';
 import createCommandExecutingSelector from 'Store/Selectors/createCommandExecutingSelector';
 import createDimensionsSelector from 'Store/Selectors/createDimensionsSelector';
@@ -39,7 +39,7 @@ function getScrollTop(view, scrollTop, isSmallScreen) {
 
 function createMapStateToProps() {
   return createSelector(
-    createClientSideCollectionSelector('series', 'seriesIndex'),
+    createSeriesClientSideCollectionItemsSelector('seriesIndex'),
     createCommandExecutingSelector(commandNames.REFRESH_SERIES),
     createCommandExecutingSelector(commandNames.RSS_SYNC),
     createDimensionsSelector(),

frontend/src/Series/Index/SeriesIndexFooterConnector.js

@@ -0,0 +1,16 @@
+import { connect } from 'react-redux';
+import { createSelector } from 'reselect';
+import SeriesIndexFooter from './SeriesIndexFooter';
+
+function createMapStateToProps() {
+  return createSelector(
+    (state) => state.series.items,
+    (series) => {
+      return {
+        series
+      };
+    }
+  );
+}
+
+export default connect(createMapStateToProps)(SeriesIndexFooter);

frontend/src/Series/Index/SeriesIndexItemConnector.js

@@ -5,8 +5,8 @@ import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 import createSeriesSelector from 'Store/Selectors/createSeriesSelector';
 import createExecutingCommandsSelector from 'Store/Selectors/createCommandsSelector';
-import createQualityProfileSelector from 'Store/Selectors/createQualityProfileSelector';
-import createLanguageProfileSelector from 'Store/Selectors/createLanguageProfileSelector';
+import createSeriesQualityProfileSelector from 'Store/Selectors/createSeriesQualityProfileSelector';
+import createSeriesLanguageProfileSelector from 'Store/Selectors/createSeriesLanguageProfileSelector';
 import { executeCommand } from 'Store/Actions/commandActions';
 import * as commandNames from 'Commands/commandNames';
 
@@ -31,8 +31,8 @@ function selectShowSearchAction() {
 function createMapStateToProps() {
   return createSelector(
     createSeriesSelector(),
-    createQualityProfileSelector(),
-    createLanguageProfileSelector(),
+    createSeriesQualityProfileSelector(),
+    createSeriesLanguageProfileSelector(),
     selectShowSearchAction(),
     createExecutingCommandsSelector(),
     (
@@ -82,7 +82,7 @@ function createMapStateToProps() {
 }
 
 const mapDispatchToProps = {
-  executeCommand
+  dispatchExecuteCommand: executeCommand
 };
 
 class SeriesIndexItemConnector extends Component {
@@ -91,14 +91,14 @@ class SeriesIndexItemConnector extends Component {
   // Listeners
 
   onRefreshSeriesPress = () => {
-    this.props.executeCommand({
+    this.props.dispatchExecuteCommand({
       name: commandNames.REFRESH_SERIES,
       seriesId: this.props.id
     });
   }
 
   onSearchPress = () => {
-    this.props.executeCommand({
+    this.props.dispatchExecuteCommand({
       name: commandNames.SERIES_SEARCH,
       seriesId: this.props.id
     });
@@ -132,7 +132,7 @@ class SeriesIndexItemConnector extends Component {
 SeriesIndexItemConnector.propTypes = {
   id: PropTypes.number,
   component: PropTypes.func.isRequired,
-  executeCommand: PropTypes.func.isRequired
+  dispatchExecuteCommand: PropTypes.func.isRequired
 };
 
 export default connect(createMapStateToProps, mapDispatchToProps)(SeriesIndexItemConnector);