From 9f689c02337810ed743a02a0af33873708a0aef5 Mon Sep 17 00:00:00 2001 From: Qstick Date: Sun, 17 Sep 2017 21:26:38 -0400 Subject: [PATCH] [UI] Fix Album History Showing for Every Album --- .../src/Episode/EpisodeDetailsModalContent.js | 6 +- .../{EpisodeHistory.js => AlbumHistory.js} | 12 ++-- .../Episode/History/AlbumHistoryConnector.js | 63 +++++++++++++++++++ ...sodeHistoryRow.css => AlbumHistoryRow.css} | 0 ...pisodeHistoryRow.js => AlbumHistoryRow.js} | 8 +-- .../History/EpisodeHistoryConnector.js | 63 ------------------- frontend/src/Store/Actions/actionTypes.js | 6 +- ...dlers.js => albumHistoryActionHandlers.js} | 20 +++--- .../src/Store/Actions/albumHistoryActions.js | 7 +++ .../Store/Actions/episodeHistoryActions.js | 7 --- ...oryReducers.js => albumHistoryReducers.js} | 8 +-- frontend/src/Store/Reducers/index.js | 6 +- 12 files changed, 103 insertions(+), 103 deletions(-) rename frontend/src/Episode/History/{EpisodeHistory.js => AlbumHistory.js} (89%) create mode 100644 frontend/src/Episode/History/AlbumHistoryConnector.js rename frontend/src/Episode/History/{EpisodeHistoryRow.css => AlbumHistoryRow.css} (100%) rename frontend/src/Episode/History/{EpisodeHistoryRow.js => AlbumHistoryRow.js} (95%) delete mode 100644 frontend/src/Episode/History/EpisodeHistoryConnector.js rename frontend/src/Store/Actions/{episodeHistoryActionHandlers.js => albumHistoryActionHandlers.js} (74%) create mode 100644 frontend/src/Store/Actions/albumHistoryActions.js delete mode 100644 frontend/src/Store/Actions/episodeHistoryActions.js rename frontend/src/Store/Reducers/{episodeHistoryReducers.js => albumHistoryReducers.js} (74%) diff --git a/frontend/src/Episode/EpisodeDetailsModalContent.js b/frontend/src/Episode/EpisodeDetailsModalContent.js index 243841820..7b0c9d4ba 100644 --- a/frontend/src/Episode/EpisodeDetailsModalContent.js +++ b/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 { - diff --git a/frontend/src/Episode/History/EpisodeHistory.js b/frontend/src/Episode/History/AlbumHistory.js similarity index 89% rename from frontend/src/Episode/History/EpisodeHistory.js rename to frontend/src/Episode/History/AlbumHistory.js index c2690275d..11dfac91b 100644 --- a/frontend/src/Episode/History/EpisodeHistory.js +++ b/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 ( - 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 ( + + ); + } +} + +AlbumHistoryConnector.propTypes = { + albumId: PropTypes.number.isRequired, + fetchAlbumHistory: PropTypes.func.isRequired, + clearAlbumHistory: PropTypes.func.isRequired, + albumHistoryMarkAsFailed: PropTypes.func.isRequired +}; + +export default connect(createMapStateToProps, mapDispatchToProps)(AlbumHistoryConnector); diff --git a/frontend/src/Episode/History/EpisodeHistoryRow.css b/frontend/src/Episode/History/AlbumHistoryRow.css similarity index 100% rename from frontend/src/Episode/History/EpisodeHistoryRow.css rename to frontend/src/Episode/History/AlbumHistoryRow.css diff --git a/frontend/src/Episode/History/EpisodeHistoryRow.js b/frontend/src/Episode/History/AlbumHistoryRow.js similarity index 95% rename from frontend/src/Episode/History/EpisodeHistoryRow.js rename to frontend/src/Episode/History/AlbumHistoryRow.js index 3d3be61ed..f67c8269b 100644 --- a/frontend/src/Episode/History/EpisodeHistoryRow.js +++ b/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; diff --git a/frontend/src/Episode/History/EpisodeHistoryConnector.js b/frontend/src/Episode/History/EpisodeHistoryConnector.js deleted file mode 100644 index cf28b79dc..000000000 --- a/frontend/src/Episode/History/EpisodeHistoryConnector.js +++ /dev/null @@ -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 ( - - ); - } -} - -EpisodeHistoryConnector.propTypes = { - episodeId: PropTypes.number.isRequired, - fetchEpisodeHistory: PropTypes.func.isRequired, - clearEpisodeHistory: PropTypes.func.isRequired, - episodeHistoryMarkAsFailed: PropTypes.func.isRequired -}; - -export default connect(createMapStateToProps, mapDispatchToProps)(EpisodeHistoryConnector); diff --git a/frontend/src/Store/Actions/actionTypes.js b/frontend/src/Store/Actions/actionTypes.js index 22ee4d2b2..30ee48ad1 100644 --- a/frontend/src/Store/Actions/actionTypes.js +++ b/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 CLEAR_EPISODE_HISTORY = 'CLEAR_EPISODE_HISTORY'; -export const EPISODE_HISTORY_MARK_AS_FAILED = 'EPISODE_HISTORY_MARK_AS_FAILED'; +export const FETCH_ALBUM_HISTORY = 'FETCH_ALBUM_HISTORY'; +export const CLEAR_ALBUM_HISTORY = 'CLEAR_ALBUM_HISTORY'; +export const ALBUM_HISTORY_MARK_AS_FAILED = 'ALBUM_HISTORY_MARK_AS_FAILED'; // // Releases diff --git a/frontend/src/Store/Actions/episodeHistoryActionHandlers.js b/frontend/src/Store/Actions/albumHistoryActionHandlers.js similarity index 74% rename from frontend/src/Store/Actions/episodeHistoryActionHandlers.js rename to frontend/src/Store/Actions/albumHistoryActionHandlers.js index 530eade2b..8d1952fa7 100644 --- a/frontend/src/Store/Actions/episodeHistoryActionHandlers.js +++ b/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 = { - [types.FETCH_EPISODE_HISTORY]: function(payload) { - const section = 'episodeHistory'; +const albumHistoryActionHandlers = { + [types.FETCH_ALBUM_HISTORY]: function(payload) { + 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', - filterValue: payload.episodeId, + filterKey: 'albumId', + 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; diff --git a/frontend/src/Store/Actions/albumHistoryActions.js b/frontend/src/Store/Actions/albumHistoryActions.js new file mode 100644 index 000000000..3e15c4b1f --- /dev/null +++ b/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]; diff --git a/frontend/src/Store/Actions/episodeHistoryActions.js b/frontend/src/Store/Actions/episodeHistoryActions.js deleted file mode 100644 index 6c0c90770..000000000 --- a/frontend/src/Store/Actions/episodeHistoryActions.js +++ /dev/null @@ -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]; diff --git a/frontend/src/Store/Reducers/episodeHistoryReducers.js b/frontend/src/Store/Reducers/albumHistoryReducers.js similarity index 74% rename from frontend/src/Store/Reducers/episodeHistoryReducers.js rename to frontend/src/Store/Reducers/albumHistoryReducers.js index 6bf246cb1..44b89b1ee 100644 --- a/frontend/src/Store/Reducers/episodeHistoryReducers.js +++ b/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; diff --git a/frontend/src/Store/Reducers/index.js b/frontend/src/Store/Reducers/index.js index 4fceb05cc..ca9d51903 100644 --- a/frontend/src/Store/Reducers/index.js +++ b/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,