Fixed: Queue not always clearing checked items when updated

This commit is contained in:
Mark McDowall 2020-04-03 08:44:58 -07:00
parent 8c24cd9864
commit bba57bb434
2 changed files with 31 additions and 23 deletions
frontend/src
Activity/Queue
Utilities/Object

View File

@ -1,6 +1,7 @@
import _ from 'lodash';
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import getRemovedItems from 'Utilities/Object/getRemovedItems';
import hasDifferentItems from 'Utilities/Object/hasDifferentItems';
import getSelectedIds from 'Utilities/Table/getSelectedIds';
import removeOldSelectedState from 'Utilities/Table/removeOldSelectedState';
@ -36,34 +37,26 @@ class Queue extends Component {
lastToggled: null,
selectedState: {},
isPendingSelected: false,
isConfirmRemoveModalOpen: false
isConfirmRemoveModalOpen: false,
items: props.items
};
}
shouldComponentUpdate(nextProps) {
// Don't update when fetching has completed if items have changed,
// before episodes start fetching or when episodes start fetching.
componentDidUpdate(prevProps) {
const {
items,
isEpisodesFetching
} = this.props;
if (
this.props.isFetching &&
nextProps.isPopulated &&
hasDifferentItems(this.props.items, nextProps.items) &&
nextProps.items.some((e) => e.episodeId)
(!isEpisodesFetching && prevProps.isEpisodesFetching) ||
(hasDifferentItems(prevProps.items, items) && !items.some((e) => e.episodeId))
) {
return false;
}
if (!this.props.isEpisodesFetching && nextProps.isEpisodesFetching) {
return false;
}
return true;
}
componentDidUpdate(prevProps) {
if (hasDifferentItems(prevProps.items, this.props.items)) {
this.setState((state) => {
return removeOldSelectedState(state, prevProps.items);
return {
...removeOldSelectedState(state, getRemovedItems(prevProps.items, items)),
items
};
});
return;
@ -124,7 +117,6 @@ class Queue extends Component {
isFetching,
isPopulated,
error,
items,
isEpisodesFetching,
isEpisodesPopulated,
episodesError,
@ -142,7 +134,8 @@ class Queue extends Component {
allUnselected,
selectedState,
isConfirmRemoveModalOpen,
isPendingSelected
isPendingSelected,
items
} = this.state;
const isRefreshing = isFetching || isEpisodesFetching || isRefreshMonitoredDownloadsExecuting;

View File

@ -0,0 +1,15 @@
function getRemovedItems(prevItems, currentItems, idProp = 'id') {
if (prevItems === currentItems) {
return [];
}
const currentItemIds = new Set();
currentItems.forEach((currentItem) => {
currentItemIds.add(currentItem[idProp]);
});
return prevItems.filter((prevItem) => !currentItemIds.has(prevItem[idProp]));
}
export default getRemovedItems;