Fixed: Changes to Profiles, Languages, Manual Import

2026-04-18 21:35:51 -04:00 · 2019-06-18 22:50:17 -04:00
parent c76364a891
commit 9350f6a04c
97 changed files with 1217 additions and 428 deletions
@@ -16,24 +16,21 @@
 }

 .leftButtons,
-.centerButtons,
 .rightButtons {
  display: flex;
-  flex: 1 0 33%;
+  flex: 1 0 50%;
  flex-wrap: wrap;
 }

-.centerButtons {
-  justify-content: center;
-}
-
 .rightButtons {
  justify-content: flex-end;
 }

-.importMode {
+.importMode,
+.bulkSelect {
  composes: select from '~Components/Form/SelectInput.css';

+  margin-right: 10px;
  width: auto;
 }

@@ -44,7 +41,6 @@
@media only screen and (max-width: $breakpointSmall) {
  .footer {
    .leftButtons,
-    .centerButtons,
    .rightButtons {
      flex-direction: column;
    }
@@ -53,10 +49,6 @@
      align-items: flex-start;
    }

-    .centerButtons {
-      align-items: center;
-    }
-
    .rightButtons {
      align-items: flex-end;
    }
@@ -20,7 +20,9 @@ import ModalBody from 'Components/Modal/ModalBody';
 import ModalFooter from 'Components/Modal/ModalFooter';
 import Table from 'Components/Table/Table';
 import TableBody from 'Components/Table/TableBody';
-import SelectSeriesModal from 'InteractiveImport/Series/SelectSeriesModal';
+import SelectLanguageModal from 'InteractiveImport/Language/SelectLanguageModal';
+import SelectQualityModal from 'InteractiveImport/Quality/SelectQualityModal';
+import SelectMovieModal from 'InteractiveImport/Movie/SelectMovieModal';
 import InteractiveImportRow from './InteractiveImportRow';
 import styles from './InteractiveImportModalContent.css';

@@ -32,8 +34,8 @@ const columns = [
    isVisible: true
  },
  {
-    name: 'series',
-    label: 'Series',
+    name: 'movie',
+    label: 'Movie',
    isSortable: true,
    isVisible: true
  },
@@ -69,6 +71,16 @@ const filterExistingFilesOptions = {
  NEW: 'new'
 };

+const importModeOptions = [
+  { key: 'move', value: 'Move Files' },
+  { key: 'copy', value: 'Copy Files' }
+];
+
+const SELECT = 'select';
+const MOVIE = 'movie';
+const LANGUAGE = 'language';
+const QUALITY = 'quality';
+
 class InteractiveImportModalContent extends Component {

  //
@@ -83,7 +95,7 @@ class InteractiveImportModalContent extends Component {
      lastToggled: null,
      selectedState: {},
      invalidRowsSelected: [],
-      isSelectSeriesModalOpen: false
+      selectModalOpen: null
    };
  }

@@ -122,9 +134,17 @@ class InteractiveImportModalContent extends Component {
  }

  onImportSelectedPress = () => {
-    const selected = this.getSelectedIds();
+    const {
+      downloadId,
+      showImportMode,
+      importMode,
+      onImportSelectedPress
+    } = this.props;

-    this.props.onImportSelectedPress(selected, this.props.importMode);
+    const selected = this.getSelectedIds();
+    const finalImportMode = downloadId || !showImportMode ? 'auto' : importMode;
+
+    onImportSelectedPress(selected, finalImportMode);
  }

  onFilterExistingFilesChange = (value) => {
@@ -135,12 +155,12 @@ class InteractiveImportModalContent extends Component {
    this.props.onImportModeChange(value);
  }

-  onSelectSeriesPress = () => {
-    this.setState({ isSelectSeriesModalOpen: true });
+  onSelectModalSelect = ({ value }) => {
+    this.setState({ selectModalOpen: value });
  }

-  onSelectSeriesModalClose = () => {
-    this.setState({ isSelectSeriesModalOpen: false });
+  onSelectModalClose = () => {
+    this.setState({ selectModalOpen: null });
  }

  //
@@ -149,7 +169,7 @@ class InteractiveImportModalContent extends Component {
  render() {
    const {
      downloadId,
-      allowSeriesChange,
+      allowMovieChange,
      showFilterExistingFiles,
      showImportMode,
      filterExistingFiles,
@@ -172,17 +192,25 @@ class InteractiveImportModalContent extends Component {
      allUnselected,
      selectedState,
      invalidRowsSelected,
-      isSelectSeriesModalOpen
+      selectModalOpen
    } = this.state;

    const selectedIds = this.getSelectedIds();
    const errorMessage = getErrorMessage(error, 'Unable to load manual import items');

-    const importModeOptions = [
-      { key: 'move', value: 'Move Files' },
-      { key: 'copy', value: 'Copy Files' }
+    const bulkSelectOptions = [
+      { key: SELECT, value: 'Select...', disabled: true },
+      { key: LANGUAGE, value: 'Select Language' },
+      { key: QUALITY, value: 'Select Quality' }
    ];

+    if (allowMovieChange) {
+      bulkSelectOptions.splice(1, 0, {
+        key: MOVIE,
+        value: 'Select Movie'
+      });
+    }
+
    return (
      <ModalContent onModalClose={onModalClose}>
        <ModalHeader>
@@ -258,7 +286,7 @@ class InteractiveImportModalContent extends Component {
                          key={item.id}
                          isSelected={selectedState[item.id]}
                          {...item}
-                          allowSeriesChange={allowSeriesChange}
+                          allowMovieChange={allowMovieChange}
                          onSelectedChange={this.onSelectedChange}
                          onValidRowChange={this.onValidRowChange}
                        />
@@ -278,24 +306,25 @@ class InteractiveImportModalContent extends Component {
        <ModalFooter className={styles.footer}>
          <div className={styles.leftButtons}>
            {
-              !downloadId && showImportMode &&
+              !downloadId && showImportMode ?
                <SelectInput
                  className={styles.importMode}
                  name="importMode"
                  value={importMode}
                  values={importModeOptions}
                  onChange={this.onImportModeChange}
-                />
+                /> :
+                null
            }
-          </div>

-          <div className={styles.centerButtons}>
-            {
-              allowSeriesChange &&
-                <Button onPress={this.onSelectSeriesPress}>
-                  Select Series
-                </Button>
-            }
+            <SelectInput
+              className={styles.bulkSelect}
+              name="select"
+              value={SELECT}
+              values={bulkSelectOptions}
+              isDisabled={!selectedIds.length}
+              onChange={this.onSelectModalSelect}
+            />
          </div>

          <div className={styles.rightButtons}>
@@ -318,10 +347,26 @@ class InteractiveImportModalContent extends Component {
          </div>
        </ModalFooter>

-        <SelectSeriesModal
-          isOpen={isSelectSeriesModalOpen}
+        <SelectMovieModal
+          isOpen={selectModalOpen === MOVIE}
          ids={selectedIds}
-          onModalClose={this.onSelectSeriesModalClose}
+          onModalClose={this.onSelectModalClose}
+        />
+
+        <SelectLanguageModal
+          isOpen={selectModalOpen === LANGUAGE}
+          ids={selectedIds}
+          languageId={0}
+          onModalClose={this.onSelectModalClose}
+        />
+
+        <SelectQualityModal
+          isOpen={selectModalOpen === QUALITY}
+          ids={selectedIds}
+          qualityId={0}
+          proper={false}
+          real={false}
+          onModalClose={this.onSelectModalClose}
        />
      </ModalContent>
    );
@@ -330,7 +375,7 @@ class InteractiveImportModalContent extends Component {

 InteractiveImportModalContent.propTypes = {
  downloadId: PropTypes.string,
-  allowSeriesChange: PropTypes.bool.isRequired,
+  allowMovieChange: PropTypes.bool.isRequired,
  showImportMode: PropTypes.bool.isRequired,
  showFilterExistingFiles: PropTypes.bool.isRequired,
  filterExistingFiles: PropTypes.bool.isRequired,
@@ -352,7 +397,7 @@ InteractiveImportModalContent.propTypes = {
 };

 InteractiveImportModalContent.defaultProps = {
-  allowSeriesChange: true,
+  allowMovieChange: true,
  showFilterExistingFiles: false,
  showImportMode: true,
  importMode: 'move'
@@ -19,11 +19,11 @@ function createMapStateToProps() {
 }

 const mapDispatchToProps = {
-  fetchInteractiveImportItems,
-  setInteractiveImportSort,
-  setInteractiveImportMode,
-  clearInteractiveImport,
-  executeCommand
+  dispatchFetchInteractiveImportItems: fetchInteractiveImportItems,
+  dispatchSetInteractiveImportSort: setInteractiveImportSort,
+  dispatchSetInteractiveImportMode: setInteractiveImportMode,
+  dispatchClearInteractiveImport: clearInteractiveImport,
+  dispatchExecuteCommand: executeCommand
 };

 class InteractiveImportModalContentConnector extends Component {
@@ -50,7 +50,7 @@ class InteractiveImportModalContentConnector extends Component {
      filterExistingFiles
    } = this.state;

-    this.props.fetchInteractiveImportItems({
+    this.props.dispatchFetchInteractiveImportItems({
      downloadId,
      folder,
      filterExistingFiles
@@ -68,7 +68,7 @@ class InteractiveImportModalContentConnector extends Component {
        folder
      } = this.props;

-      this.props.fetchInteractiveImportItems({
+      this.props.dispatchFetchInteractiveImportItems({
        downloadId,
        folder,
        filterExistingFiles
@@ -77,14 +77,14 @@ class InteractiveImportModalContentConnector extends Component {
  }

  componentWillUnmount() {
-    this.props.clearInteractiveImport();
+    this.props.dispatchClearInteractiveImport();
  }

  //
  // Listeners

  onSortPress = (sortKey, sortDirection) => {
-    this.props.setInteractiveImportSort({ sortKey, sortDirection });
+    this.props.dispatchSetInteractiveImportSort({ sortKey, sortDirection });
  }

  onFilterExistingFilesChange = (filterExistingFiles) => {
@@ -92,7 +92,7 @@ class InteractiveImportModalContentConnector extends Component {
  }

  onImportModeChange = (importMode) => {
-    this.props.setInteractiveImportMode({ importMode });
+    this.props.dispatchSetInteractiveImportMode({ importMode });
  }

  onImportSelectedPress = (selected, importMode) => {
@@ -103,25 +103,13 @@ class InteractiveImportModalContentConnector extends Component {

      if (isSelected) {
        const {
-          series,
-          seasonNumber,
-          episodes,
+          movie,
          quality,
          language
        } = item;

-        if (!series) {
-          this.setState({ interactiveImportErrorMessage: 'Series must be chosen for each selected file' });
-          return false;
-        }
-
-        if (isNaN(seasonNumber)) {
-          this.setState({ interactiveImportErrorMessage: 'Season must be chosen for each selected file' });
-          return false;
-        }
-
-        if (!episodes || !episodes.length) {
-          this.setState({ interactiveImportErrorMessage: 'One or more episodes must be chosen for each selected file' });
+        if (!movie) {
+          this.setState({ interactiveImportErrorMessage: 'Movie must be chosen for each selected file' });
          return false;
        }

@@ -138,8 +126,7 @@ class InteractiveImportModalContentConnector extends Component {
        files.push({
          path: item.path,
          folderName: item.folderName,
-          seriesId: series.id,
-          episodeIds: _.map(episodes, 'id'),
+          movieId: movie.id,
          quality,
          language,
          downloadId: this.props.downloadId
@@ -151,7 +138,7 @@ class InteractiveImportModalContentConnector extends Component {
      return;
    }

-    this.props.executeCommand({
+    this.props.dispatchExecuteCommand({
      name: commandNames.INTERACTIVE_IMPORT,
      files,
      importMode
@@ -188,11 +175,11 @@ InteractiveImportModalContentConnector.propTypes = {
  folder: PropTypes.string,
  filterExistingFiles: PropTypes.bool.isRequired,
  items: PropTypes.arrayOf(PropTypes.object).isRequired,
-  fetchInteractiveImportItems: PropTypes.func.isRequired,
-  setInteractiveImportSort: PropTypes.func.isRequired,
-  clearInteractiveImport: PropTypes.func.isRequired,
-  setInteractiveImportMode: PropTypes.func.isRequired,
-  executeCommand: PropTypes.func.isRequired,
+  dispatchFetchInteractiveImportItems: PropTypes.func.isRequired,
+  dispatchSetInteractiveImportSort: PropTypes.func.isRequired,
+  dispatchSetInteractiveImportMode: PropTypes.func.isRequired,
+  dispatchClearInteractiveImport: PropTypes.func.isRequired,
+  dispatchExecuteCommand: PropTypes.func.isRequired,
  onModalClose: PropTypes.func.isRequired
 };

@@ -9,9 +9,10 @@ import TableRowCellButton from 'Components/Table/Cells/TableRowCellButton';
 import TableSelectCell from 'Components/Table/Cells/TableSelectCell';
 import Popover from 'Components/Tooltip/Popover';
 import MovieQuality from 'Movie/MovieQuality';
-// import EpisodeLanguage from 'Episode/EpisodeLanguage';
-import SelectSeriesModal from 'InteractiveImport/Series/SelectSeriesModal';
+// import MovieLanguage from 'Movie/MovieLanguage';
+import SelectMovieModal from 'InteractiveImport/Movie/SelectMovieModal';
 import SelectQualityModal from 'InteractiveImport/Quality/SelectQualityModal';
+import SelectLanguageModal from 'InteractiveImport/Language/SelectLanguageModal';
 import InteractiveImportRowCellPlaceholder from './InteractiveImportRowCellPlaceholder';
 import styles from './InteractiveImportRow.css';

@@ -24,21 +25,24 @@ class InteractiveImportRow extends Component {
    super(props, context);

    this.state = {
-      isSelectSeriesModalOpen: false,
-      isSelectQualityModalOpen: false
+      isSelectMovieModalOpen: false,
+      isSelectQualityModalOpen: false,
+      isSelectLanguageModalOpen: false
    };
  }

  componentDidMount() {
    const {
      id,
-      series,
-      quality
+      movie,
+      quality,
+      language
    } = this.props;

    if (
-      series &&
-      quality
+      movie &&
+      quality &&
+      language
    ) {
      this.props.onSelectedChange({ id, value: true });
    }
@@ -47,23 +51,26 @@ class InteractiveImportRow extends Component {
  componentDidUpdate(prevProps) {
    const {
      id,
-      series,
+      movie,
      quality,
+      language,
      isSelected,
      onValidRowChange
    } = this.props;

    if (
-      prevProps.series === series &&
+      prevProps.movie === movie &&
      prevProps.quality === quality &&
+      prevProps.language === language &&
      prevProps.isSelected === isSelected
    ) {
      return;
    }

    const isValid = !!(
-      series &&
-      quality
+      movie &&
+      quality &&
+      language
    );

    if (isSelected && !isValid) {
@@ -90,16 +97,20 @@ class InteractiveImportRow extends Component {
  //
  // Listeners

-  onSelectSeriesPress = () => {
-    this.setState({ isSelectSeriesModalOpen: true });
+  onSelectMoviePress = () => {
+    this.setState({ isSelectMovieModalOpen: true });
  }

  onSelectQualityPress = () => {
    this.setState({ isSelectQualityModalOpen: true });
  }

-  onSelectSeriesModalClose = (changed) => {
-    this.setState({ isSelectSeriesModalOpen: false });
+  onSelectLanguagePress = () => {
+    this.setState({ isSelectLanguageModalOpen: true });
+  }
+
+  onSelectMovieModalClose = (changed) => {
+    this.setState({ isSelectMovieModalOpen: false });
    this.selectRowAfterChange(changed);
  }

@@ -108,16 +119,22 @@ class InteractiveImportRow extends Component {
    this.selectRowAfterChange(changed);
  }

+  onSelectLanguageModalClose = (changed) => {
+    this.setState({ isSelectLanguageModalOpen: false });
+    this.selectRowAfterChange(changed);
+  }
+
  //
  // Render

  render() {
    const {
      id,
-      allowSeriesChange,
+      allowMovieChange,
      relativePath,
-      series,
+      movie,
      quality,
+      language,
      size,
      rejections,
      isSelected,
@@ -125,14 +142,16 @@ class InteractiveImportRow extends Component {
    } = this.props;

    const {
-      isSelectSeriesModalOpen,
-      isSelectQualityModalOpen
+      isSelectMovieModalOpen,
+      isSelectQualityModalOpen,
+      isSelectLanguageModalOpen
    } = this.state;

-    const seriesTitle = series ? series.title : '';
+    const movieTitle = movie ? movie.title : '';

-    const showSeriesPlaceholder = isSelected && !series;
+    const showMoviePlaceholder = isSelected && !movie;
    const showQualityPlaceholder = isSelected && !quality;
+    const showLanguagePlaceholder = isSelected && !language;

    return (
      <TableRow>
@@ -150,16 +169,18 @@ class InteractiveImportRow extends Component {
        </TableRowCell>

        <TableRowCellButton
-          isDisabled={!allowSeriesChange}
-          onPress={this.onSelectSeriesPress}
+          isDisabled={!allowMovieChange}
+          title={allowMovieChange ? 'Click to change movie' : undefined}
+          onPress={this.onSelectMoviePress}
        >
          {
-            showSeriesPlaceholder ? <InteractiveImportRowCellPlaceholder /> : seriesTitle
+            showMoviePlaceholder ? <InteractiveImportRowCellPlaceholder /> : movieTitle
          }
        </TableRowCellButton>

        <TableRowCellButton
          className={styles.quality}
+          title="Click to change quality"
          onPress={this.onSelectQualityPress}
        >
          {
@@ -176,6 +197,25 @@ class InteractiveImportRow extends Component {
          }
        </TableRowCellButton>

+        <TableRowCellButton
+          className={styles.language}
+          title="Click to change language"
+          onPress={this.onSelectLanguagePress}
+        >
+          {
+            showLanguagePlaceholder &&
+              <InteractiveImportRowCellPlaceholder />
+          }
+
+          {/* {
+            !showLanguagePlaceholder && !!language &&
+              <MovieLanguage
+                className={styles.label}
+                language={language}
+              />
+          } */}
+        </TableRowCellButton>
+
        <TableRowCell>
          {formatBytes(size)}
        </TableRowCell>
@@ -209,20 +249,27 @@ class InteractiveImportRow extends Component {
          }
        </TableRowCell>

-        <SelectSeriesModal
-          isOpen={isSelectSeriesModalOpen}
+        <SelectMovieModal
+          isOpen={isSelectMovieModalOpen}
          ids={[id]}
-          onModalClose={this.onSelectSeriesModalClose}
+          onModalClose={this.onSelectMovieModalClose}
        />

        <SelectQualityModal
          isOpen={isSelectQualityModalOpen}
-          id={id}
+          ids={[id]}
          qualityId={quality ? quality.quality.id : 0}
          proper={quality ? quality.revision.version > 1 : false}
          real={quality ? quality.revision.real > 0 : false}
          onModalClose={this.onSelectQualityModalClose}
        />
+
+        <SelectLanguageModal
+          isOpen={isSelectLanguageModalOpen}
+          ids={[id]}
+          languageId={language ? language.id : 0}
+          onModalClose={this.onSelectLanguageModalClose}
+        />
      </TableRow>
    );
  }
@@ -231,12 +278,11 @@ class InteractiveImportRow extends Component {

 InteractiveImportRow.propTypes = {
  id: PropTypes.number.isRequired,
-  allowSeriesChange: PropTypes.bool.isRequired,
+  allowMovieChange: PropTypes.bool.isRequired,
  relativePath: PropTypes.string.isRequired,
-  series: PropTypes.object,
-  seasonNumber: PropTypes.number,
-  episodes: PropTypes.arrayOf(PropTypes.object).isRequired,
+  movie: PropTypes.object,
  quality: PropTypes.object,
+  language: PropTypes.object,
  size: PropTypes.number.isRequired,
  rejections: PropTypes.arrayOf(PropTypes.object).isRequired,
  isSelected: PropTypes.bool,
@@ -244,8 +290,4 @@ InteractiveImportRow.propTypes = {
  onValidRowChange: PropTypes.func.isRequired
 };

-InteractiveImportRow.defaultProps = {
-  episodes: []
-};
-
 export default InteractiveImportRow;