New: Reprocess Language in Manual Import after Movie Selection

frontend/src/InteractiveImport/Interactive/InteractiveImportRow.css

@@ -14,3 +14,10 @@
 
   cursor: pointer;
 }
+
+.reprocessing {
+  composes: loading from '~Components/Loading/LoadingIndicator.css';
+
+  margin-top: 0;
+  text-align: start;
+}

frontend/src/InteractiveImport/Interactive/InteractiveImportRow.js

@@ -1,6 +1,7 @@
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import Icon from 'Components/Icon';
+import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import TableRowCell from 'Components/Table/Cells/TableRowCell';
 import TableRowCellButton from 'Components/Table/Cells/TableRowCellButton';
 import TableSelectCell from 'Components/Table/Cells/TableSelectCell';
@@ -137,6 +138,7 @@ class InteractiveImportRow extends Component {
       languages,
       size,
       rejections,
+      isReprocessing,
       isSelected,
       onSelectedChange
     } = this.props;
@@ -151,7 +153,7 @@ class InteractiveImportRow extends Component {
 
     const showMoviePlaceholder = isSelected && !movie;
     const showQualityPlaceholder = isSelected && !quality;
-    const showLanguagePlaceholder = isSelected && !languages;
+    const showLanguagePlaceholder = isSelected && !languages && !isReprocessing;
 
     return (
       <TableRow>
@@ -208,11 +210,20 @@ class InteractiveImportRow extends Component {
           }
 
           {
-            !showLanguagePlaceholder && !!languages &&
+            !showLanguagePlaceholder && !!languages && !isReprocessing ?
               <MovieLanguage
                 className={styles.label}
                 languages={languages}
-              />
+              /> :
+              null
+          }
+
+          {
+            isReprocessing ?
+              <LoadingIndicator className={styles.reprocessing}
+                size={20}
+
+              /> : null
           }
         </TableRowCellButton>
 
@@ -286,6 +297,7 @@ InteractiveImportRow.propTypes = {
   languages: PropTypes.arrayOf(PropTypes.object),
   size: PropTypes.number.isRequired,
   rejections: PropTypes.arrayOf(PropTypes.object).isRequired,
+  isReprocessing: PropTypes.bool,
   isSelected: PropTypes.bool,
   onSelectedChange: PropTypes.func.isRequired,
   onValidRowChange: PropTypes.func.isRequired

frontend/src/InteractiveImport/Movie/SelectMovieModalContentConnector.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 { updateInteractiveImportItem } from 'Store/Actions/interactiveImportActions';
+import { reprocessInteractiveImportItems, updateInteractiveImportItem } from 'Store/Actions/interactiveImportActions';
 import createAllMoviesSelector from 'Store/Selectors/createAllMoviesSelector';
 import createDeepEqualSelector from 'Store/Selectors/createDeepEqualSelector';
 import SelectMovieModalContent from './SelectMovieModalContent';
@@ -59,6 +59,7 @@ function createMapStateToProps() {
 }
 
 const mapDispatchToProps = {
+  dispatchReprocessInteractiveImportItems: reprocessInteractiveImportItems,
   dispatchUpdateInteractiveImportItem: updateInteractiveImportItem
 };
 
@@ -72,6 +73,7 @@ class SelectMovieModalContentConnector extends Component {
       ids,
       items,
       dispatchUpdateInteractiveImportItem,
+      dispatchReprocessInteractiveImportItems,
       onModalClose
     } = this.props;
 
@@ -84,6 +86,8 @@ class SelectMovieModalContentConnector extends Component {
       });
     });
 
+    dispatchReprocessInteractiveImportItems({ ids });
+
     onModalClose(true);
   }
 
@@ -103,6 +107,7 @@ class SelectMovieModalContentConnector extends Component {
 SelectMovieModalContentConnector.propTypes = {
   ids: PropTypes.arrayOf(PropTypes.number).isRequired,
   items: PropTypes.arrayOf(PropTypes.object).isRequired,
+  dispatchReprocessInteractiveImportItems: PropTypes.func.isRequired,
   dispatchUpdateInteractiveImportItem: PropTypes.func.isRequired,
   onModalClose: PropTypes.func.isRequired
 };

frontend/src/Store/Actions/interactiveImportActions.js

@@ -4,7 +4,7 @@ import { batchActions } from 'redux-batched-actions';
 import { sortDirections } from 'Helpers/Props';
 import { createThunk, handleThunks } from 'Store/thunks';
 import createAjaxRequest from 'Utilities/createAjaxRequest';
-import { set, update } from './baseActions';
+import { set, update, updateItem } from './baseActions';
 import createHandleActions from './Creators/createHandleActions';
 import createSetClientSideCollectionSortReducer from './Creators/Reducers/createSetClientSideCollectionSortReducer';
 
@@ -15,12 +15,16 @@ export const section = 'interactiveImport';
 
 const MAXIMUM_RECENT_FOLDERS = 10;
 
+let abortCurrentRequest = null;
+let currentIds = [];
+
 //
 // State
 
 export const defaultState = {
   isFetching: false,
   isPopulated: false,
+  isReprocessing: false,
   error: null,
   items: [],
   sortKey: 'quality',
@@ -55,6 +59,7 @@ export const persistState = [
 // Actions Types
 
 export const FETCH_INTERACTIVE_IMPORT_ITEMS = 'interactiveImport/fetchInteractiveImportItems';
+export const REPROCESS_INTERACTIVE_IMPORT_ITEMS = 'interactiveImport/reprocessInteractiveImportItems';
 export const SET_INTERACTIVE_IMPORT_SORT = 'interactiveImport/setInteractiveImportSort';
 export const UPDATE_INTERACTIVE_IMPORT_ITEM = 'interactiveImport/updateInteractiveImportItem';
 export const UPDATE_INTERACTIVE_IMPORT_ITEMS = 'interactiveImport/updateInteractiveImportItems';
@@ -67,6 +72,7 @@ export const SET_INTERACTIVE_IMPORT_MODE = 'interactiveImport/setInteractiveImpo
 // Action Creators
 
 export const fetchInteractiveImportItems = createThunk(FETCH_INTERACTIVE_IMPORT_ITEMS);
+export const reprocessInteractiveImportItems = createThunk(REPROCESS_INTERACTIVE_IMPORT_ITEMS);
 export const setInteractiveImportSort = createAction(SET_INTERACTIVE_IMPORT_SORT);
 export const updateInteractiveImportItem = createAction(UPDATE_INTERACTIVE_IMPORT_ITEM);
 export const updateInteractiveImportItems = createAction(UPDATE_INTERACTIVE_IMPORT_ITEMS);
@@ -112,6 +118,72 @@ export const actionHandlers = handleThunks({
         error: xhr
       }));
     });
+  },
+
+  [REPROCESS_INTERACTIVE_IMPORT_ITEMS]: function(getState, payload, dispatch) {
+    if (abortCurrentRequest) {
+      abortCurrentRequest();
+    }
+
+    dispatch(batchActions([
+      ...currentIds.map((id) => updateItem({
+        section,
+        id,
+        isReprocessing: false
+      })),
+      ...payload.ids.map((id) => updateItem({
+        section,
+        id,
+        isReprocessing: true
+      }))
+    ]));
+
+    const items = getState()[section].items;
+
+    const requestPayload = payload.ids.map((id) => {
+      const item = items.find((i) => i.id === id);
+
+      return {
+        id,
+        path: item.path,
+        movieId: item.movie.id,
+        downloadId: item.downloadId
+      };
+    });
+
+    const { request, abortRequest } = createAjaxRequest({
+      method: 'POST',
+      url: '/manualimport',
+      contentType: 'application/json',
+      data: JSON.stringify(requestPayload)
+    });
+
+    abortCurrentRequest = abortRequest;
+    currentIds = payload.ids;
+
+    request.done((data) => {
+      dispatch(batchActions(
+        data.map((item) => updateItem({
+          section,
+          ...item,
+          isReprocessing: false
+        }))
+      ));
+    });
+
+    request.fail((xhr) => {
+      if (xhr.aborted) {
+        return;
+      }
+
+      dispatch(batchActions(
+        payload.ids.map((id) => updateItem({
+          section,
+          id,
+          isReprocessing: false
+        }))
+      ));
+    });
   }
 });