[UI] Fix Album History Showing for Every Album

frontend/src/Episode/EpisodeDetailsModalContent.js

@@ -9,7 +9,7 @@ import ModalBody from 'Components/Modal/ModalBody';
 import ModalFooter from 'Components/Modal/ModalFooter';
 import MonitorToggleButton from 'Components/MonitorToggleButton';
 import EpisodeSummaryConnector from './Summary/EpisodeSummaryConnector';
-import EpisodeHistoryConnector from './History/EpisodeHistoryConnector';
+import AlbumHistoryConnector from './History/AlbumHistoryConnector';
 import EpisodeSearchConnector from './Search/EpisodeSearchConnector';
 import styles from './EpisodeDetailsModalContent.css';
 
@@ -129,8 +129,8 @@ class EpisodeDetailsModalContent extends Component {
             </TabPanel>
 
             <TabPanel className={styles.tabPanel}>
-              <EpisodeHistoryConnector
+              <AlbumHistoryConnector
-                episodeId={episodeId}
+                albumId={episodeId}
               />
             </TabPanel>
 

frontend/src/Episode/History/AlbumHistory.js

@@ -3,7 +3,7 @@ import React, { Component } from 'react';
 import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import Table from 'Components/Table/Table';
 import TableBody from 'Components/Table/TableBody';
-import EpisodeHistoryRow from './EpisodeHistoryRow';
+import AlbumHistoryRow from './AlbumHistoryRow';
 
 const columns = [
   {
@@ -37,7 +37,7 @@ const columns = [
   }
 ];
 
-class EpisodeHistory extends Component {
+class AlbumHistory extends Component {
 
   //
   // Render
@@ -80,7 +80,7 @@ class EpisodeHistory extends Component {
             {
               items.map((item) => {
                 return (
-                  <EpisodeHistoryRow
+                  <AlbumHistoryRow
                     key={item.id}
                     {...item}
                     onMarkAsFailedPress={onMarkAsFailedPress}
@@ -97,7 +97,7 @@ class EpisodeHistory extends Component {
   }
 }
 
-EpisodeHistory.propTypes = {
+AlbumHistory.propTypes = {
   isFetching: PropTypes.bool.isRequired,
   isPopulated: PropTypes.bool.isRequired,
   error: PropTypes.object,
@@ -105,8 +105,8 @@ EpisodeHistory.propTypes = {
   onMarkAsFailedPress: PropTypes.func.isRequired
 };
 
-EpisodeHistory.defaultProps = {
+AlbumHistory.defaultProps = {
   selectedTab: 'details'
 };
 
-export default EpisodeHistory;
+export default AlbumHistory;

frontend/src/Episode/History/AlbumHistoryConnector.js

@@ -0,0 +1,63 @@
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
+import { createSelector } from 'reselect';
+import { fetchAlbumHistory, clearAlbumHistory, albumHistoryMarkAsFailed } from 'Store/Actions/albumHistoryActions';
+import AlbumHistory from './AlbumHistory';
+
+function createMapStateToProps() {
+  return createSelector(
+    (state) => state.albumHistory,
+    (albumHistory) => {
+      return albumHistory;
+    }
+  );
+}
+
+const mapDispatchToProps = {
+  fetchAlbumHistory,
+  clearAlbumHistory,
+  albumHistoryMarkAsFailed
+};
+
+class AlbumHistoryConnector extends Component {
+
+  //
+  // Lifecycle
+
+  componentDidMount() {
+    this.props.fetchAlbumHistory({ albumId: this.props.albumId });
+  }
+
+  componentWillUnmount() {
+    this.props.clearAlbumHistory();
+  }
+
+  //
+  // Listeners
+
+  onMarkAsFailedPress = (historyId) => {
+    this.props.albumHistoryMarkAsFailed({ historyId, albumId: this.props.albumId });
+  }
+
+  //
+  // Render
+
+  render() {
+    return (
+      <AlbumHistory
+        {...this.props}
+        onMarkAsFailedPress={this.onMarkAsFailedPress}
+      />
+    );
+  }
+}
+
+AlbumHistoryConnector.propTypes = {
+  albumId: PropTypes.number.isRequired,
+  fetchAlbumHistory: PropTypes.func.isRequired,
+  clearAlbumHistory: PropTypes.func.isRequired,
+  albumHistoryMarkAsFailed: PropTypes.func.isRequired
+};
+
+export default connect(createMapStateToProps, mapDispatchToProps)(AlbumHistoryConnector);

frontend/src/Episode/History/AlbumHistoryRow.js

@@ -12,9 +12,9 @@ import Popover from 'Components/Tooltip/Popover';
 import EpisodeQuality from 'Episode/EpisodeQuality';
 import HistoryDetailsConnector from 'Activity/History/Details/HistoryDetailsConnector';
 import HistoryEventTypeCell from 'Activity/History/HistoryEventTypeCell';
-import styles from './EpisodeHistoryRow.css';
+import styles from './AlbumHistoryRow.css';
 
-class EpisodeHistoryRow extends Component {
+class AlbumHistoryRow extends Component {
 
   //
   // Lifecycle
@@ -125,7 +125,7 @@ class EpisodeHistoryRow extends Component {
   }
 }
 
-EpisodeHistoryRow.propTypes = {
+AlbumHistoryRow.propTypes = {
   id: PropTypes.number.isRequired,
   eventType: PropTypes.string.isRequired,
   sourceTitle: PropTypes.string.isRequired,
@@ -136,4 +136,4 @@ EpisodeHistoryRow.propTypes = {
   onMarkAsFailedPress: PropTypes.func.isRequired
 };
 
-export default EpisodeHistoryRow;
+export default AlbumHistoryRow;

frontend/src/Episode/History/EpisodeHistoryConnector.js

@@ -1,63 +0,0 @@
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import { connect } from 'react-redux';
-import { createSelector } from 'reselect';
-import { fetchEpisodeHistory, clearEpisodeHistory, episodeHistoryMarkAsFailed } from 'Store/Actions/episodeHistoryActions';
-import EpisodeHistory from './EpisodeHistory';
-
-function createMapStateToProps() {
-  return createSelector(
-    (state) => state.episodeHistory,
-    (episodeHistory) => {
-      return episodeHistory;
-    }
-  );
-}
-
-const mapDispatchToProps = {
-  fetchEpisodeHistory,
-  clearEpisodeHistory,
-  episodeHistoryMarkAsFailed
-};
-
-class EpisodeHistoryConnector extends Component {
-
-  //
-  // Lifecycle
-
-  componentDidMount() {
-    this.props.fetchEpisodeHistory({ episodeId: this.props.episodeId });
-  }
-
-  componentWillUnmount() {
-    this.props.clearEpisodeHistory();
-  }
-
-  //
-  // Listeners
-
-  onMarkAsFailedPress = (historyId) => {
-    this.props.episodeHistoryMarkAsFailed({ historyId, episodeId: this.props.episodeId });
-  }
-
-  //
-  // Render
-
-  render() {
-    return (
-      <EpisodeHistory
-        {...this.props}
-        onMarkAsFailedPress={this.onMarkAsFailedPress}
-      />
-    );
-  }
-}
-
-EpisodeHistoryConnector.propTypes = {
-  episodeId: PropTypes.number.isRequired,
-  fetchEpisodeHistory: PropTypes.func.isRequired,
-  clearEpisodeHistory: PropTypes.func.isRequired,
-  episodeHistoryMarkAsFailed: PropTypes.func.isRequired
-};
-
-export default connect(createMapStateToProps, mapDispatchToProps)(EpisodeHistoryConnector);

frontend/src/Store/Actions/actionTypes.js

@@ -96,9 +96,9 @@ export const UPDATE_EPISODE_FILES = 'UPDATE_EPISODE_FILES';
 //
 // Episode History
 
-export const FETCH_EPISODE_HISTORY = 'FETCH_EPISODE_HISTORY';
+export const FETCH_ALBUM_HISTORY = 'FETCH_ALBUM_HISTORY';
-export const CLEAR_EPISODE_HISTORY = 'CLEAR_EPISODE_HISTORY';
+export const CLEAR_ALBUM_HISTORY = 'CLEAR_ALBUM_HISTORY';
-export const EPISODE_HISTORY_MARK_AS_FAILED = 'EPISODE_HISTORY_MARK_AS_FAILED';
+export const ALBUM_HISTORY_MARK_AS_FAILED = 'ALBUM_HISTORY_MARK_AS_FAILED';
 
 //
 // Releases

frontend/src/Store/Actions/albumHistoryActionHandlers.js

@@ -3,11 +3,11 @@ import { batchActions } from 'redux-batched-actions';
 import { sortDirections } from 'Helpers/Props';
 import * as types from './actionTypes';
 import { set, update } from './baseActions';
-import { fetchEpisodeHistory } from './episodeHistoryActions';
+import { fetchAlbumHistory } from './albumHistoryActions';
 
-const episodeHistoryActionHandlers = {
+const albumHistoryActionHandlers = {
-  [types.FETCH_EPISODE_HISTORY]: function(payload) {
+  [types.FETCH_ALBUM_HISTORY]: function(payload) {
-    const section = 'episodeHistory';
+    const section = 'albumHistory';
 
     return function(dispatch, getState) {
       dispatch(set({ section, isFetching: true }));
@@ -15,8 +15,8 @@ const episodeHistoryActionHandlers = {
       const queryParams = {
         pageSize: 1000,
         page: 1,
-        filterKey: 'episodeId',
+        filterKey: 'albumId',
-        filterValue: payload.episodeId,
+        filterValue: payload.albumId,
         sortKey: 'date',
         sortDirection: sortDirections.DESCENDING
       };
@@ -50,11 +50,11 @@ const episodeHistoryActionHandlers = {
     };
   },
 
-  [types.EPISODE_HISTORY_MARK_AS_FAILED]: function(payload) {
+  [types.ALBUM_HISTORY_MARK_AS_FAILED]: function(payload) {
     return function(dispatch, getState) {
       const {
         historyId,
-        episodeId
+        albumId
       } = payload;
 
       const promise = $.ajax({
@@ -66,10 +66,10 @@ const episodeHistoryActionHandlers = {
       });
 
       promise.done(() => {
-        dispatch(fetchEpisodeHistory({ episodeId }));
+        dispatch(fetchAlbumHistory({ albumId }));
       });
     };
   }
 };
 
-export default episodeHistoryActionHandlers;
+export default albumHistoryActionHandlers;

frontend/src/Store/Actions/albumHistoryActions.js

@@ -0,0 +1,7 @@
+import { createAction } from 'redux-actions';
+import * as types from './actionTypes';
+import albumHistoryActionHandlers from './albumHistoryActionHandlers';
+
+export const fetchAlbumHistory = albumHistoryActionHandlers[types.FETCH_ALBUM_HISTORY];
+export const clearAlbumHistory = createAction(types.CLEAR_ALBUM_HISTORY);
+export const albumHistoryMarkAsFailed = albumHistoryActionHandlers[types.ALBUM_HISTORY_MARK_AS_FAILED];

frontend/src/Store/Actions/episodeHistoryActions.js

@@ -1,7 +0,0 @@
-import { createAction } from 'redux-actions';
-import * as types from './actionTypes';
-import episodeHistoryActionHandlers from './episodeHistoryActionHandlers';
-
-export const fetchEpisodeHistory = episodeHistoryActionHandlers[types.FETCH_EPISODE_HISTORY];
-export const clearEpisodeHistory = createAction(types.CLEAR_EPISODE_HISTORY);
-export const episodeHistoryMarkAsFailed = episodeHistoryActionHandlers[types.EPISODE_HISTORY_MARK_AS_FAILED];

frontend/src/Store/Reducers/albumHistoryReducers.js

@@ -10,17 +10,17 @@ export const defaultState = {
   items: []
 };
 
-const reducerSection = 'episodeHistory';
+const reducerSection = 'albumHistory';
 
-const episodeHistoryReducers = handleActions({
+const albumHistoryReducers = handleActions({
 
   [types.SET]: createSetReducer(reducerSection),
   [types.UPDATE]: createUpdateReducer(reducerSection),
 
-  [types.CLEAR_EPISODE_HISTORY]: (state) => {
+  [types.CLEAR_ALBUM_HISTORY]: (state) => {
     return Object.assign({}, state, defaultState);
   }
 
 }, defaultState);
 
-export default episodeHistoryReducers;
+export default albumHistoryReducers;

frontend/src/Store/Reducers/index.js

@@ -14,7 +14,7 @@ import queue, { defaultState as defaultQueueState } from './queueReducers';
 import blacklist, { defaultState as defaultBlacklistState } from './blacklistReducers';
 import episodes, { defaultState as defaultEpisodesState } from './episodeReducers';
 import episodeFiles, { defaultState as defaultEpisodeFilesState } from './episodeFileReducers';
-import episodeHistory, { defaultState as defaultEpisodeHistoryState } from './episodeHistoryReducers';
+import albumHistory, { defaultState as defaultAlbumHistoryState } from './albumHistoryReducers';
 import releases, { defaultState as defaultReleasesState } from './releaseReducers';
 import wanted, { defaultState as defaultWantedState } from './wantedReducers';
 import settings, { defaultState as defaultSettingsState } from './settingsReducers';
@@ -42,7 +42,7 @@ export const defaultState = {
   blacklist: defaultBlacklistState,
   episodes: defaultEpisodesState,
   episodeFiles: defaultEpisodeFilesState,
-  episodeHistory: defaultEpisodeHistoryState,
+  albumHistory: defaultAlbumHistoryState,
   releases: defaultReleasesState,
   wanted: defaultWantedState,
   settings: defaultSettingsState,
@@ -71,7 +71,7 @@ export default enableBatching(combineReducers({
   blacklist,
   episodes,
   episodeFiles,
-  episodeHistory,
+  albumHistory,
   releases,
   wanted,
   settings,