diff --git a/frontend/src/Movie/Details/MovieDetails.js b/frontend/src/Movie/Details/MovieDetails.js
index 59b9e8f94..e9c110c4d 100644
--- a/frontend/src/Movie/Details/MovieDetails.js
+++ b/frontend/src/Movie/Details/MovieDetails.js
@@ -20,7 +20,7 @@ import RottenTomatoRating from 'Components/RottenTomatoRating';
import TmdbRating from 'Components/TmdbRating';
import Popover from 'Components/Tooltip/Popover';
import Tooltip from 'Components/Tooltip/Tooltip';
-import { icons, kinds, sizes, tooltipPositions } from 'Helpers/Props';
+import { align, icons, kinds, sizes, tooltipPositions } from 'Helpers/Props';
import InteractiveImportModal from 'InteractiveImport/InteractiveImportModal';
import InteractiveSearchFilterMenuConnector from 'InteractiveSearch/InteractiveSearchFilterMenuConnector';
import InteractiveSearchTable from 'InteractiveSearch/InteractiveSearchTable';
@@ -36,6 +36,7 @@ import fonts from 'Styles/Variables/fonts';
import * as keyCodes from 'Utilities/Constants/keyCodes';
import formatRuntime from 'Utilities/Date/formatRuntime';
import formatBytes from 'Utilities/Number/formatBytes';
+import titleCase from 'Utilities/String/titleCase';
import translate from 'Utilities/String/translate';
import selectAll from 'Utilities/Table/selectAll';
import toggleSelected from 'Utilities/Table/toggleSelected';
@@ -290,7 +291,9 @@ class MovieDetails extends Component {
onRefreshPress,
onSearchPress,
queueItems,
- movieRuntimeFormat
+ movieRuntimeFormat,
+ indexFilter,
+ nextPrev
} = this.props;
const {
@@ -355,6 +358,16 @@ class MovieDetails extends Component {
onPress={this.onDeleteMoviePress}
/>
+
+
+
+
@@ -395,23 +408,26 @@ class MovieDetails extends Component {
-
-
+ {
+ nextPrev &&
+
+
-
-
+
+
+ }
@@ -830,7 +846,9 @@ MovieDetails.propTypes = {
onSearchPress: PropTypes.func.isRequired,
onGoToMovie: PropTypes.func.isRequired,
queueItems: PropTypes.arrayOf(PropTypes.object),
- movieRuntimeFormat: PropTypes.string.isRequired
+ movieRuntimeFormat: PropTypes.string.isRequired,
+ indexFilter: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+ nextPrev: PropTypes.bool.isRequired
};
MovieDetails.defaultProps = {
diff --git a/frontend/src/Movie/Details/MovieDetailsConnector.js b/frontend/src/Movie/Details/MovieDetailsConnector.js
index 5364feeea..58c7271c8 100644
--- a/frontend/src/Movie/Details/MovieDetailsConnector.js
+++ b/frontend/src/Movie/Details/MovieDetailsConnector.js
@@ -18,6 +18,7 @@ import { fetchImportListSchema } from 'Store/Actions/settingsActions';
import createAllMoviesSelector from 'Store/Selectors/createAllMoviesSelector';
import createCommandsSelector from 'Store/Selectors/createCommandsSelector';
import createDimensionsSelector from 'Store/Selectors/createDimensionsSelector';
+import createMovieClientSideCollectionItemsSelector from 'Store/Selectors/createMovieClientSideCollectionItemsSelector';
import { findCommand, isCommandExecuting } from 'Utilities/Command';
import { registerPagePopulator, unregisterPagePopulator } from 'Utilities/pagePopulator';
import MovieDetails from './MovieDetails';
@@ -86,16 +87,37 @@ function createMapStateToProps() {
selectMovieFiles,
selectMovieCredits,
selectExtraFiles,
+ createMovieClientSideCollectionItemsSelector('movieIndex'),
createAllMoviesSelector(),
createCommandsSelector(),
createDimensionsSelector(),
(state) => state.queue.details.items,
(state) => state.app.isSidebarVisible,
(state) => state.settings.ui.item.movieRuntimeFormat,
- (titleSlug, movieFiles, movieCredits, extraFiles, allMovies, commands, dimensions, queueItems, isSidebarVisible, movieRuntimeFormat) => {
- const sortedMovies = _.orderBy(allMovies, 'sortTitle');
- const movieIndex = _.findIndex(sortedMovies, { titleSlug });
+ (state) => state.settings.ui.item.movieDetailsNextPrevBehavior,
+ (state) => state.movieIndex.selectedFilterKey,
+ (state) => state.customFilters.items.filter((s) => s.type === 'movieIndex'),
+ (titleSlug, movieFiles, movieCredits, extraFiles, collectionMovies, allMovies, commands, dimensions, queueItems, isSidebarVisible, movieRuntimeFormat, movieDetailsNextPrevBehavior, indexFilter, customFilters) => {
+ let sortedMovies = [];
+ if (movieDetailsNextPrevBehavior === 'filter') {
+ collectionMovies.items.forEach((c) => sortedMovies.push(allMovies.find((a) => a.id === c.id)));
+ } else {
+ sortedMovies = _.orderBy(allMovies, 'sortTitle');
+ }
+
+ let movieIndex = _.findIndex(sortedMovies, { titleSlug });
+
+ if (customFilters.length && Number.isInteger(indexFilter)) {
+ indexFilter = customFilters.find((filter) => (filter.id === indexFilter)).label;
+ }
+
+ if (movieIndex === -1) {
+ sortedMovies.push(allMovies.find((a) => a.titleSlug === titleSlug));
+ movieIndex = sortedMovies.length - 1;
+ }
+
const movie = sortedMovies[movieIndex];
+ const nextPrev = sortedMovies.length > 1;
if (!movie) {
return {};
@@ -166,7 +188,9 @@ function createMapStateToProps() {
isSmallScreen: dimensions.isSmallScreen,
isSidebarVisible,
queueItems,
- movieRuntimeFormat
+ movieRuntimeFormat,
+ indexFilter,
+ nextPrev
};
}
);
diff --git a/frontend/src/Settings/UI/UISettings.js b/frontend/src/Settings/UI/UISettings.js
index 65462863c..107c937a2 100644
--- a/frontend/src/Settings/UI/UISettings.js
+++ b/frontend/src/Settings/UI/UISettings.js
@@ -12,6 +12,11 @@ import { inputTypes } from 'Helpers/Props';
import SettingsToolbarConnector from 'Settings/SettingsToolbarConnector';
import translate from 'Utilities/String/translate';
+export const movieDetailsNextPrevBehaviorOption = [
+ { key: 'all', value: translate('All') },
+ { key: 'filter', value: translate('Filter') }
+];
+
export const firstDayOfWeekOptions = [
{ key: 0, value: translate('Sunday') },
{ key: 1, value: translate('Monday') }
@@ -132,6 +137,18 @@ class UISettings extends Component {
{...settings.movieRuntimeFormat}
/>
+
+ {translate('NextPrevBehavior')}
+
+
+