Fixed: List UI Revamp

frontend/src/Store/Actions/Settings/netImportExclusions.js

@@ -22,6 +22,7 @@ export const SET_NET_IMPORT_EXCLUSION_VALUE = 'settings/netImportExclusions/setN
 // Action Creators
 
 export const fetchNetImportExclusions = createThunk(FETCH_NET_IMPORT_EXCLUSIONS);
+
 export const saveNetImportExclusion = createThunk(SAVE_NET_IMPORT_EXCLUSION);
 export const deleteNetImportExclusion = createThunk(DELETE_NET_IMPORT_EXCLUSION);
 
@@ -55,6 +56,7 @@ export default {
 
   actionHandlers: {
     [FETCH_NET_IMPORT_EXCLUSIONS]: createFetchHandler(section, '/exclusions'),
+
     [SAVE_NET_IMPORT_EXCLUSION]: createSaveProviderHandler(section, '/exclusions'),
     [DELETE_NET_IMPORT_EXCLUSION]: createRemoveItemHandler(section, '/exclusions')
   },

frontend/src/Store/Actions/addMovieActions.js

@@ -4,19 +4,11 @@ import { batchActions } from 'redux-batched-actions';
 import getSectionState from 'Utilities/State/getSectionState';
 import updateSectionState from 'Utilities/State/updateSectionState';
 import createAjaxRequest from 'Utilities/createAjaxRequest';
-import createFetchHandler from './Creators/createFetchHandler';
 import getNewMovie from 'Utilities/Movie/getNewMovie';
-import { filterBuilderTypes, filterBuilderValueTypes, sortDirections } from 'Helpers/Props';
-import sortByName from 'Utilities/Array/sortByName';
 import { createThunk, handleThunks } from 'Store/thunks';
 import createSetSettingValueReducer from './Creators/Reducers/createSetSettingValueReducer';
 import createHandleActions from './Creators/createHandleActions';
 import { set, update, updateItem } from './baseActions';
-import { filterPredicates, sortPredicates } from './movieActions';
-import createSetTableOptionReducer from './Creators/Reducers/createSetTableOptionReducer';
-import createSetClientSideCollectionSortReducer from './Creators/Reducers/createSetClientSideCollectionSortReducer';
-import createSetClientSideCollectionFilterReducer from './Creators/Reducers/createSetClientSideCollectionFilterReducer';
-import createClearReducer from './Creators/Reducers/createClearReducer';
 
 //
 // Variables
@@ -35,11 +27,6 @@ export const defaultState = {
   isAdded: false,
   addError: null,
   items: [],
-  sortKey: 'sortTitle',
-  sortDirection: sortDirections.ASCENDING,
-  secondarySortKey: 'sortTitle',
-  secondarySortDirection: sortDirections.ASCENDING,
-  view: 'overview',
 
   defaults: {
     rootFolderPath: '',
@@ -47,202 +34,11 @@ export const defaultState = {
     qualityProfileId: 0,
     minimumAvailability: 'announced',
     tags: []
-  },
-
-  posterOptions: {
-    size: 'large',
-    showTitle: false
-  },
-
-  overviewOptions: {
-    detailedProgressBar: false,
-    size: 'medium',
-    showStudio: true
-  },
-
-  tableOptions: {
-    // showSearchAction: false
-  },
-
-  columns: [
-    {
-      name: 'select',
-      columnLabel: 'select',
-      isSortable: false,
-      isVisible: true,
-      isModifiable: false
-    },
-    {
-      name: 'status',
-      columnLabel: 'Status',
-      isSortable: true,
-      isVisible: true,
-      isModifiable: false
-    },
-    {
-      name: 'sortTitle',
-      label: 'Movie Title',
-      isSortable: true,
-      isVisible: true,
-      isModifiable: false
-    },
-    {
-      name: 'studio',
-      label: 'Studio',
-      isSortable: true,
-      isVisible: true
-    },
-    {
-      name: 'inCinemas',
-      label: 'In Cinemas',
-      isSortable: true,
-      isVisible: true
-    },
-    {
-      name: 'physicalRelease',
-      label: 'Physical Release',
-      isSortable: true,
-      isVisible: false
-    },
-    {
-      name: 'genres',
-      label: 'Genres',
-      isSortable: false,
-      isVisible: false
-    },
-    {
-      name: 'ratings',
-      label: 'Rating',
-      isSortable: true,
-      isVisible: false
-    },
-    {
-      name: 'certification',
-      label: 'Certification',
-      isSortable: false,
-      isVisible: false
-    },
-    {
-      name: 'actions',
-      columnLabel: 'Actions',
-      isVisible: true,
-      isModifiable: false
-    }
-  ],
-
-  sortPredicates: {
-    ...sortPredicates,
-
-    studio: function(item) {
-      const studio = item.studio;
-
-      return studio ? studio.toLowerCase() : '';
-    },
-
-    ratings: function(item) {
-      const { ratings = {} } = item;
-
-      return ratings.value;
-    }
-  },
-
-  selectedFilterKey: 'all',
-
-  filters: [
-    {
-      key: 'all',
-      label: 'All',
-      filters: []
-    }
-  ],
-
-  filterPredicates,
-
-  filterBuilderProps: [
-    {
-      name: 'status',
-      label: 'Status',
-      type: filterBuilderTypes.EXACT,
-      valueType: filterBuilderValueTypes.MOVIE_STATUS
-    },
-    {
-      name: 'studio',
-      label: 'Studio',
-      type: filterBuilderTypes.ARRAY,
-      optionsSelector: function(items) {
-        const tagList = items.reduce((acc, movie) => {
-          acc.push({
-            id: movie.studio,
-            name: movie.studio
-          });
-
-          return acc;
-        }, []);
-
-        return tagList.sort(sortByName);
-      }
-    },
-    {
-      name: 'inCinemas',
-      label: 'In Cinemas',
-      type: filterBuilderTypes.DATE,
-      valueType: filterBuilderValueTypes.DATE
-    },
-    {
-      name: 'physicalRelease',
-      label: 'Physical Release',
-      type: filterBuilderTypes.DATE,
-      valueType: filterBuilderValueTypes.DATE
-    },
-    {
-      name: 'genres',
-      label: 'Genres',
-      type: filterBuilderTypes.ARRAY,
-      optionsSelector: function(items) {
-        const tagList = items.reduce((acc, movie) => {
-          movie.genres.forEach((genre) => {
-            acc.push({
-              id: genre,
-              name: genre
-            });
-          });
-
-          return acc;
-        }, []);
-
-        return tagList.sort(sortByName);
-      }
-    },
-    {
-      name: 'ratings',
-      label: 'Rating',
-      type: filterBuilderTypes.NUMBER
-    },
-    {
-      name: 'certification',
-      label: 'Certification',
-      type: filterBuilderTypes.EXACT
-    },
-    {
-      name: 'tags',
-      label: 'Tags',
-      type: filterBuilderTypes.ARRAY,
-      valueType: filterBuilderValueTypes.TAG
-    }
-  ]
+  }
 };
 
 export const persistState = [
-  'addMovie.defaults',
-  'addMovie.sortKey',
-  'addMovie.sortDirection',
-  'addMovie.selectedFilterKey',
-  'addMovie.customFilters',
-  'addMovie.view',
-  'addMovie.columns',
-  'addMovie.posterOptions',
-  'addMovie.overviewOptions',
-  'addMovie.tableOptions'
+  'addMovie.defaults'
 ];
 
 //
@@ -254,16 +50,6 @@ export const SET_ADD_MOVIE_VALUE = 'addMovie/setAddMovieValue';
 export const CLEAR_ADD_MOVIE = 'addMovie/clearAddMovie';
 export const SET_ADD_MOVIE_DEFAULT = 'addMovie/setAddMovieDefault';
 
-export const FETCH_LIST_MOVIES = 'addMovie/fetchListMovies';
-export const FETCH_DISCOVER_MOVIES = 'addMovie/fetchDiscoverMovies';
-
-export const SET_LIST_MOVIE_SORT = 'addMovie/setListMovieSort';
-export const SET_LIST_MOVIE_FILTER = 'addMovie/setListMovieFilter';
-export const SET_LIST_MOVIE_VIEW = 'addMovie/setListMovieView';
-export const SET_LIST_MOVIE_TABLE_OPTION = 'addMovie/setListMovieTableOption';
-export const SET_LIST_MOVIE_POSTER_OPTION = 'addMovie/setListMoviePosterOption';
-export const SET_LIST_MOVIE_OVERVIEW_OPTION = 'addMovie/setListMovieOverviewOption';
-
 //
 // Action Creators
 
@@ -272,16 +58,6 @@ export const addMovie = createThunk(ADD_MOVIE);
 export const clearAddMovie = createAction(CLEAR_ADD_MOVIE);
 export const setAddMovieDefault = createAction(SET_ADD_MOVIE_DEFAULT);
 
-export const fetchListMovies = createThunk(FETCH_LIST_MOVIES);
-export const fetchDiscoverMovies = createThunk(FETCH_DISCOVER_MOVIES);
-
-export const setListMovieSort = createAction(SET_LIST_MOVIE_SORT);
-export const setListMovieFilter = createAction(SET_LIST_MOVIE_FILTER);
-export const setListMovieView = createAction(SET_LIST_MOVIE_VIEW);
-export const setListMovieTableOption = createAction(SET_LIST_MOVIE_TABLE_OPTION);
-export const setListMoviePosterOption = createAction(SET_LIST_MOVIE_POSTER_OPTION);
-export const setListMovieOverviewOption = createAction(SET_LIST_MOVIE_OVERVIEW_OPTION);
-
 export const setAddMovieValue = createAction(SET_ADD_MOVIE_VALUE, (payload) => {
   return {
     section,
@@ -294,10 +70,6 @@ export const setAddMovieValue = createAction(SET_ADD_MOVIE_VALUE, (payload) => {
 
 export const actionHandlers = handleThunks({
 
-  [FETCH_LIST_MOVIES]: createFetchHandler(section, '/netimport/movies'),
-
-  [FETCH_DISCOVER_MOVIES]: createFetchHandler(section, '/movies/discover'),
-
   [LOOKUP_MOVIE]: function(getState, payload, dispatch) {
     dispatch(set({ section, isFetching: true }));
 
@@ -393,54 +165,14 @@ export const reducers = createHandleActions({
     return updateSectionState(state, section, newState);
   },
 
-  [SET_LIST_MOVIE_SORT]: createSetClientSideCollectionSortReducer(section),
-  [SET_LIST_MOVIE_FILTER]: createSetClientSideCollectionFilterReducer(section),
+  [CLEAR_ADD_MOVIE]: function(state) {
+    const {
+      defaults,
+      view,
+      ...otherDefaultState
+    } = defaultState;
 
-  [SET_LIST_MOVIE_VIEW]: function(state, { payload }) {
-    return Object.assign({}, state, { view: payload.view });
-  },
-
-  [SET_LIST_MOVIE_TABLE_OPTION]: createSetTableOptionReducer(section),
-
-  [SET_LIST_MOVIE_POSTER_OPTION]: function(state, { payload }) {
-    const posterOptions = state.posterOptions;
-
-    return {
-      ...state,
-      posterOptions: {
-        ...posterOptions,
-        ...payload
-      }
-    };
-  },
-
-  [SET_LIST_MOVIE_OVERVIEW_OPTION]: function(state, { payload }) {
-    const overviewOptions = state.overviewOptions;
-
-    return {
-      ...state,
-      overviewOptions: {
-        ...overviewOptions,
-        ...payload
-      }
-    };
-  },
-
-  // [CLEAR_ADD_MOVIE]: function(state) {
-  //   const {
-  //     defaults,
-  //     view,
-  //     ...otherDefaultState
-  //   } = defaultState;
-
-  //   return Object.assign({}, state, otherDefaultState);
-  // }
-
-  [CLEAR_ADD_MOVIE]: createClearReducer(section, {
-    isFetching: false,
-    isPopulated: false,
-    error: null,
-    items: []
-  })
+    return Object.assign({}, state, otherDefaultState);
+  }
 
 }, defaultState, section);

frontend/src/Store/Actions/discoverMovieActions.js

@@ -0,0 +1,584 @@
+import _ from 'lodash';
+import { createAction } from 'redux-actions';
+import { batchActions } from 'redux-batched-actions';
+import getSectionState from 'Utilities/State/getSectionState';
+import updateSectionState from 'Utilities/State/updateSectionState';
+import createAjaxRequest from 'Utilities/createAjaxRequest';
+import getNewMovie from 'Utilities/Movie/getNewMovie';
+import { filterBuilderTypes, filterBuilderValueTypes, filterTypes, sortDirections } from 'Helpers/Props';
+import sortByName from 'Utilities/Array/sortByName';
+import { createThunk, handleThunks } from 'Store/thunks';
+import createSetSettingValueReducer from './Creators/Reducers/createSetSettingValueReducer';
+import createHandleActions from './Creators/createHandleActions';
+import { set, updateItem, removeItem } from './baseActions';
+import { filterPredicates } from './movieActions';
+import createSetTableOptionReducer from './Creators/Reducers/createSetTableOptionReducer';
+import createSetClientSideCollectionSortReducer from './Creators/Reducers/createSetClientSideCollectionSortReducer';
+import createSetClientSideCollectionFilterReducer from './Creators/Reducers/createSetClientSideCollectionFilterReducer';
+import createClearReducer from './Creators/Reducers/createClearReducer';
+
+//
+// Variables
+
+export const section = 'discoverMovie';
+
+//
+// State
+
+export const defaultState = {
+  isFetching: false,
+  isPopulated: false,
+  error: null,
+  isAdding: false,
+  isAdded: false,
+  addError: null,
+  items: [],
+  sortKey: 'sortTitle',
+  sortDirection: sortDirections.ASCENDING,
+  secondarySortKey: 'sortTitle',
+  secondarySortDirection: sortDirections.ASCENDING,
+  view: 'overview',
+
+  defaults: {
+    rootFolderPath: '',
+    monitor: 'true',
+    qualityProfileId: 0,
+    minimumAvailability: 'announced',
+    tags: []
+  },
+
+  posterOptions: {
+    size: 'large',
+    showTitle: false
+  },
+
+  overviewOptions: {
+    detailedProgressBar: false,
+    size: 'medium',
+    showStudio: true
+  },
+
+  tableOptions: {
+    // showSearchAction: false
+  },
+
+  columns: [
+    {
+      name: 'status',
+      columnLabel: 'Status',
+      isSortable: true,
+      isVisible: true,
+      isModifiable: false
+    },
+    {
+      name: 'sortTitle',
+      label: 'Movie Title',
+      isSortable: true,
+      isVisible: true,
+      isModifiable: false
+    },
+    {
+      name: 'studio',
+      label: 'Studio',
+      isSortable: true,
+      isVisible: true
+    },
+    {
+      name: 'inCinemas',
+      label: 'In Cinemas',
+      isSortable: true,
+      isVisible: true
+    },
+    {
+      name: 'physicalRelease',
+      label: 'Physical Release',
+      isSortable: true,
+      isVisible: false
+    },
+    {
+      name: 'genres',
+      label: 'Genres',
+      isSortable: false,
+      isVisible: false
+    },
+    {
+      name: 'ratings',
+      label: 'Rating',
+      isSortable: true,
+      isVisible: false
+    },
+    {
+      name: 'certification',
+      label: 'Certification',
+      isSortable: true,
+      isVisible: false
+    },
+    {
+      name: 'actions',
+      columnLabel: 'Actions',
+      isVisible: true,
+      isModifiable: false
+    }
+  ],
+
+  sortPredicates: {
+    status: function(item) {
+      let result = 0;
+
+      if (item.isExcluded) {
+        result += 4;
+      }
+
+      if (item.status === 'announced') {
+        result++;
+      }
+
+      if (item.status === 'inCinemas') {
+        result += 2;
+      }
+
+      if (item.status === 'released') {
+        result += 3;
+      }
+
+      return result;
+    },
+
+    studio: function(item) {
+      const studio = item.studio;
+
+      return studio ? studio.toLowerCase() : '';
+    },
+
+    ratings: function(item) {
+      const { ratings = {} } = item;
+
+      return ratings.value;
+    }
+  },
+
+  selectedFilterKey: 'newNotExcluded',
+
+  filters: [
+    {
+      key: 'all',
+      label: 'All',
+      filters: []
+    },
+    {
+      key: 'newNotExcluded',
+      label: 'New Non-Excluded',
+      filters: [
+        {
+          key: 'isExisting',
+          value: false,
+          type: filterTypes.EQUAL
+        },
+        {
+          key: 'isExcluded',
+          value: false,
+          type: filterTypes.EQUAL
+        }
+      ]
+    }
+  ],
+
+  filterPredicates,
+
+  filterBuilderProps: [
+    {
+      name: 'status',
+      label: 'Status',
+      type: filterBuilderTypes.EXACT,
+      valueType: filterBuilderValueTypes.MOVIE_STATUS
+    },
+    {
+      name: 'studio',
+      label: 'Studio',
+      type: filterBuilderTypes.ARRAY,
+      optionsSelector: function(items) {
+        const tagList = items.reduce((acc, movie) => {
+          acc.push({
+            id: movie.studio,
+            name: movie.studio
+          });
+
+          return acc;
+        }, []);
+
+        return tagList.sort(sortByName);
+      }
+    },
+    {
+      name: 'inCinemas',
+      label: 'In Cinemas',
+      type: filterBuilderTypes.DATE,
+      valueType: filterBuilderValueTypes.DATE
+    },
+    {
+      name: 'physicalRelease',
+      label: 'Physical Release',
+      type: filterBuilderTypes.DATE,
+      valueType: filterBuilderValueTypes.DATE
+    },
+    {
+      name: 'genres',
+      label: 'Genres',
+      type: filterBuilderTypes.ARRAY,
+      optionsSelector: function(items) {
+        const tagList = items.reduce((acc, movie) => {
+          movie.genres.forEach((genre) => {
+            acc.push({
+              id: genre,
+              name: genre
+            });
+          });
+
+          return acc;
+        }, []);
+
+        return tagList.sort(sortByName);
+      }
+    },
+    {
+      name: 'ratings',
+      label: 'Rating',
+      type: filterBuilderTypes.NUMBER
+    },
+    {
+      name: 'certification',
+      label: 'Certification',
+      type: filterBuilderTypes.EXACT
+    },
+    {
+      name: 'isExcluded',
+      label: 'On Excluded List',
+      type: filterBuilderTypes.EXACT,
+      valueType: filterBuilderValueTypes.BOOL
+    },
+    {
+      name: 'isExisting',
+      label: 'Exists in Library',
+      type: filterBuilderTypes.EXACT,
+      valueType: filterBuilderValueTypes.BOOL
+    }
+  ]
+};
+
+export const persistState = [
+  'discoverMovie.defaults',
+  'discoverMovie.sortKey',
+  'discoverMovie.sortDirection',
+  'discoverMovie.selectedFilterKey',
+  'discoverMovie.customFilters',
+  'discoverMovie.view',
+  'discoverMovie.columns',
+  'discoverMovie.posterOptions',
+  'discoverMovie.overviewOptions',
+  'discoverMovie.tableOptions'
+];
+
+//
+// Actions Types
+
+export const ADD_MOVIE = 'discoverMovie/addMovie';
+export const ADD_MOVIES = 'discoverMovie/addMovies';
+export const SET_ADD_MOVIE_VALUE = 'discoverMovie/setAddMovieValue';
+export const CLEAR_ADD_MOVIE = 'discoverMovie/clearAddMovie';
+export const SET_ADD_MOVIE_DEFAULT = 'discoverMovie/setAddMovieDefault';
+
+export const FETCH_DISCOVER_MOVIES = 'discoverMovie/fetchDiscoverMovies';
+
+export const SET_LIST_MOVIE_SORT = 'discoverMovie/setListMovieSort';
+export const SET_LIST_MOVIE_FILTER = 'discoverMovie/setListMovieFilter';
+export const SET_LIST_MOVIE_VIEW = 'discoverMovie/setListMovieView';
+export const SET_LIST_MOVIE_TABLE_OPTION = 'discoverMovie/setListMovieTableOption';
+export const SET_LIST_MOVIE_POSTER_OPTION = 'discoverMovie/setListMoviePosterOption';
+export const SET_LIST_MOVIE_OVERVIEW_OPTION = 'discoverMovie/setListMovieOverviewOption';
+
+export const ADD_NET_IMPORT_EXCLUSIONS = 'discoverMovie/addNetImportExclusions';
+
+//
+// Action Creators
+
+export const addMovie = createThunk(ADD_MOVIE);
+export const addMovies = createThunk(ADD_MOVIES);
+export const clearAddMovie = createAction(CLEAR_ADD_MOVIE);
+export const setAddMovieDefault = createAction(SET_ADD_MOVIE_DEFAULT);
+
+export const fetchDiscoverMovies = createThunk(FETCH_DISCOVER_MOVIES);
+
+export const setListMovieSort = createAction(SET_LIST_MOVIE_SORT);
+export const setListMovieFilter = createAction(SET_LIST_MOVIE_FILTER);
+export const setListMovieView = createAction(SET_LIST_MOVIE_VIEW);
+export const setListMovieTableOption = createAction(SET_LIST_MOVIE_TABLE_OPTION);
+export const setListMoviePosterOption = createAction(SET_LIST_MOVIE_POSTER_OPTION);
+export const setListMovieOverviewOption = createAction(SET_LIST_MOVIE_OVERVIEW_OPTION);
+
+export const addNetImportExclusions = createThunk(ADD_NET_IMPORT_EXCLUSIONS);
+
+export const setAddMovieValue = createAction(SET_ADD_MOVIE_VALUE, (payload) => {
+  return {
+    section,
+    ...payload
+  };
+});
+
+//
+// Action Handlers
+
+export const actionHandlers = handleThunks({
+
+  [FETCH_DISCOVER_MOVIES]: function(getState, payload, dispatch) {
+    dispatch(set({ section, isFetching: true }));
+
+    const {
+      id,
+      ...otherPayload
+    } = payload;
+
+    const promise = createAjaxRequest({
+      url: '/movies/discover',
+      data: otherPayload,
+      traditional: true
+    }).request;
+
+    promise.done((data) => {
+      // set an Id so the selectors and updaters done blow up.
+      data = data.map((movie) => ({ ...movie, id: movie.tmdbId }));
+
+      dispatch(batchActions([
+        ...data.map((movie) => updateItem({ section, ...movie })),
+
+        set({
+          section,
+          isFetching: false,
+          isPopulated: true,
+          error: null
+        })
+      ]));
+    });
+
+    promise.fail((xhr) => {
+      dispatch(set({
+        section,
+        isFetching: false,
+        isPopulated: false,
+        error: xhr.aborted ? null : xhr
+      }));
+    });
+  },
+
+  [ADD_MOVIE]: function(getState, payload, dispatch) {
+    dispatch(set({ section, isAdding: true }));
+
+    const tmdbId = payload.tmdbId;
+    const items = getState().discoverMovie.items;
+    const itemToUpdate = _.find(items, { tmdbId });
+
+    const newMovie = getNewMovie(_.cloneDeep(itemToUpdate), payload);
+    newMovie.id = 0;
+
+    const promise = createAjaxRequest({
+      url: '/movie',
+      method: 'POST',
+      contentType: 'application/json',
+      data: JSON.stringify(newMovie)
+    }).request;
+
+    promise.done((data) => {
+      dispatch(batchActions([
+        updateItem({ section: 'movies', ...data }),
+
+        removeItem({ section: 'discoverMovie', ...itemToUpdate }),
+
+        set({
+          section,
+          isAdding: false,
+          isAdded: true,
+          addError: null
+        })
+      ]));
+    });
+
+    promise.fail((xhr) => {
+      dispatch(set({
+        section,
+        isAdding: false,
+        isAdded: false,
+        addError: xhr
+      }));
+    });
+  },
+
+  [ADD_MOVIES]: function(getState, payload, dispatch) {
+    dispatch(set({ section, isAdding: true }));
+
+    const ids = payload.ids;
+    const addOptions = payload.addOptions;
+    const items = getState().discoverMovie.items;
+    const addedIds = [];
+
+    const allNewMovies = ids.reduce((acc, id) => {
+      const item = items.find((i) => i.id === id);
+      const selectedMovie = item;
+
+      // Make sure we have a selected movie and
+      // the same movie hasn't been added yet.
+      if (selectedMovie && !acc.some((a) => a.tmdbId === selectedMovie.tmdbId)) {
+        const newMovie = getNewMovie(_.cloneDeep(selectedMovie), addOptions);
+        newMovie.id = 0;
+
+        addedIds.push(id);
+        acc.push(newMovie);
+      }
+
+      return acc;
+    }, []);
+
+    const promise = createAjaxRequest({
+      url: '/movie/import',
+      method: 'POST',
+      contentType: 'application/json',
+      data: JSON.stringify(allNewMovies)
+    }).request;
+
+    promise.done((data) => {
+      dispatch(batchActions([
+        set({
+          section,
+          isAdding: false,
+          isAdded: true
+        }),
+
+        ...data.map((movie) => updateItem({ section: 'movies', ...movie })),
+
+        ...addedIds.map((id) => removeItem({ section, id }))
+      ]));
+    });
+
+    promise.fail((xhr) => {
+      dispatch(batchActions(
+        set({
+          section,
+          isImporting: false,
+          isImported: true
+        }),
+
+        addedIds.map((id) => updateItem({
+          section,
+          id,
+          importError: xhr
+        }))
+      ));
+    });
+  },
+
+  [ADD_NET_IMPORT_EXCLUSIONS]: function(getState, payload, dispatch) {
+
+    const ids = payload.ids;
+    const items = getState().discoverMovie.items;
+
+    const exclusions = ids.reduce((acc, id) => {
+      const item = items.find((i) => i.tmdbId === id);
+
+      const newExclusion = {
+        tmdbId: id,
+        movieTitle: item.title,
+        movieYear: item.year
+      };
+
+      acc.push(newExclusion);
+
+      return acc;
+    }, []);
+
+    const promise = createAjaxRequest({
+      url: '/exclusions',
+      method: 'POST',
+      data: JSON.stringify(exclusions)
+    }).request;
+
+    promise.done((data) => {
+      dispatch(batchActions([
+        ...data.map((item) => updateItem({ section: 'settings.netImportExclusions', ...item })),
+
+        ...data.map((item) => updateItem({ section, id: item.tmdbId, isExcluded: true })),
+
+        set({
+          section,
+          isSaving: false,
+          saveError: null
+        })
+      ]));
+    });
+
+    promise.fail((xhr) => {
+      dispatch(set({
+        section,
+        isSaving: false,
+        saveError: xhr
+      }));
+    });
+  }
+});
+
+//
+// Reducers
+
+export const reducers = createHandleActions({
+
+  [SET_ADD_MOVIE_VALUE]: createSetSettingValueReducer(section),
+
+  [SET_ADD_MOVIE_DEFAULT]: function(state, { payload }) {
+    const newState = getSectionState(state, section);
+
+    newState.defaults = {
+      ...newState.defaults,
+      ...payload
+    };
+
+    return updateSectionState(state, section, newState);
+  },
+
+  [SET_LIST_MOVIE_SORT]: createSetClientSideCollectionSortReducer(section),
+  [SET_LIST_MOVIE_FILTER]: createSetClientSideCollectionFilterReducer(section),
+
+  [SET_LIST_MOVIE_VIEW]: function(state, { payload }) {
+    return Object.assign({}, state, { view: payload.view });
+  },
+
+  [SET_LIST_MOVIE_TABLE_OPTION]: createSetTableOptionReducer(section),
+
+  [SET_LIST_MOVIE_POSTER_OPTION]: function(state, { payload }) {
+    const posterOptions = state.posterOptions;
+
+    return {
+      ...state,
+      posterOptions: {
+        ...posterOptions,
+        ...payload
+      }
+    };
+  },
+
+  [SET_LIST_MOVIE_OVERVIEW_OPTION]: function(state, { payload }) {
+    const overviewOptions = state.overviewOptions;
+
+    return {
+      ...state,
+      overviewOptions: {
+        ...overviewOptions,
+        ...payload
+      }
+    };
+  },
+
+  [CLEAR_ADD_MOVIE]: createClearReducer(section, {
+    isFetching: false,
+    isPopulated: false,
+    error: null,
+    items: []
+  })
+
+}, defaultState, section);

frontend/src/Store/Actions/index.js

@@ -5,6 +5,7 @@ import * as calendar from './calendarActions';
 import * as captcha from './captchaActions';
 import * as customFilters from './customFilterActions';
 import * as commands from './commandActions';
+import * as discoverMovie from './discoverMovieActions';
 import * as movieFiles from './movieFileActions';
 import * as extraFiles from './extraFileActions';
 import * as history from './historyActions';
@@ -33,6 +34,7 @@ export default [
   captcha,
   commands,
   customFilters,
+  discoverMovie,
   movieFiles,
   extraFiles,
   history,

frontend/src/Store/Selectors/createDiscoverMovieClientSideCollectionItemsSelector.js

@@ -26,11 +26,11 @@ function createUnoptimizedSelector(uiSection) {
   );
 }
 
-function createAddMovieClientSideCollectionItemsSelector(uiSection) {
+function createDiscoverMovieClientSideCollectionItemsSelector(uiSection) {
   return createDeepEqualSelector(
     createUnoptimizedSelector(uiSection),
     (movies) => movies
   );
 }
 
-export default createAddMovieClientSideCollectionItemsSelector;
+export default createDiscoverMovieClientSideCollectionItemsSelector;

frontend/src/Store/Selectors/createDiscoverMovieSelector.js

@@ -1,13 +1,13 @@
 import { createSelector } from 'reselect';
 
-function createAddListMovieSelector() {
+function createDiscoverMovieSelector() {
   return createSelector(
     (state, { movieId }) => movieId,
-    (state) => state.addMovie,
+    (state) => state.discoverMovie,
     (movieId, allMovies) => {
       return allMovies.items.find((movie) => movie.tmdbId === movieId);
     }
   );
 }
 
-export default createAddListMovieSelector;
+export default createDiscoverMovieSelector;

frontend/src/Store/scrollPositions.js

@@ -1,6 +1,6 @@
 const scrollPositions = {
   movieIndex: 0,
-  addMovie: 0
+  discoverMovie: 0
 };
 
 export default scrollPositions;