Fixed: Error refreshing page in Activity/Wanted

2025-02-25 15:22:42 +00:00 · 2020-08-18 21:40:59 +01:00 · 2020-08-18 21:40:59 +01:00 · ddef74edde
commit ddef74edde
parent 2639374243
10 changed files with 65 additions and 21 deletions
--- a/frontend/src/Activity/Blacklist/Blacklist.js
+++ b/frontend/src/Activity/Blacklist/Blacklist.js
@ -22,6 +22,8 @@ class Blacklist extends Component {
    const {
      isFetching,
      isPopulated,
+      isArtistFetching,
+      isArtistPopulated,
      error,
      items,
      columns,
@ -31,6 +33,9 @@ class Blacklist extends Component {
      ...otherProps
    } = this.props;

+    const isAllPopulated = isPopulated && isArtistPopulated;
+    const isAnyFetching = isFetching || isArtistFetching;
+
    return (
      <PageContent title="Blacklist">
        <PageToolbar>
@ -58,24 +63,24 @@ class Blacklist extends Component {

        <PageContentBody>
          {
-            isFetching && !isPopulated &&
+            isAnyFetching && !isAllPopulated &&
              <LoadingIndicator />
          }

          {
-            !isFetching && !!error &&
+            !isAnyFetching && !!error &&
              <div>Unable to load blacklist</div>
          }

          {
-            isPopulated && !error && !items.length &&
+            isAllPopulated && !error && !items.length &&
              <div>
                No history blacklist
              </div>
          }

          {
-            isPopulated && !error && !!items.length &&
+            isAllPopulated && !error && !!items.length &&
              <div>
                <Table
                  columns={columns}
@ -110,6 +115,8 @@ class Blacklist extends Component {
 }

 Blacklist.propTypes = {
+  isArtistFetching: PropTypes.bool.isRequired,
+  isArtistPopulated: PropTypes.bool.isRequired,
  isFetching: PropTypes.bool.isRequired,
  isPopulated: PropTypes.bool.isRequired,
  error: PropTypes.object,
--- a/frontend/src/Activity/Blacklist/BlacklistConnector.js
+++ b/frontend/src/Activity/Blacklist/BlacklistConnector.js
@ -13,9 +13,12 @@ import Blacklist from './Blacklist';
 function createMapStateToProps() {
  return createSelector(
    (state) => state.blacklist,
+    (state) => state.artist,
    createCommandExecutingSelector(commandNames.CLEAR_BLACKLIST),
-    (blacklist, isClearingBlacklistExecuting) => {
+    (blacklist, artist, isClearingBlacklistExecuting) => {
      return {
+        isArtistFetching: artist.isFetching,
+        isArtistPopulated: artist.isPopulated,
        isClearingBlacklistExecuting,
        ...blacklist
      };
--- a/frontend/src/Activity/History/History.js
+++ b/frontend/src/Activity/History/History.js
@ -51,6 +51,8 @@ class History extends Component {
      selectedFilterKey,
      filters,
      totalRecords,
+      isArtistFetching,
+      isArtistPopulated,
      isAlbumsFetching,
      isAlbumsPopulated,
      albumsError,
@ -59,8 +61,8 @@ class History extends Component {
      ...otherProps
    } = this.props;

-    const isFetchingAny = isFetching || isAlbumsFetching;
-    const isAllPopulated = isPopulated && (isAlbumsPopulated || !items.length);
+    const isFetchingAny = isFetching || isArtistFetching || isAlbumsFetching;
+    const isAllPopulated = isPopulated && ((isArtistPopulated && isAlbumsPopulated) || !items.length);
    const hasError = error || albumsError;

    return (
@ -162,6 +164,8 @@ History.propTypes = {
  selectedFilterKey: PropTypes.string.isRequired,
  filters: PropTypes.arrayOf(PropTypes.object).isRequired,
  totalRecords: PropTypes.number,
+  isArtistFetching: PropTypes.bool.isRequired,
+  isArtistPopulated: PropTypes.bool.isRequired,
  isAlbumsFetching: PropTypes.bool.isRequired,
  isAlbumsPopulated: PropTypes.bool.isRequired,
  albumsError: PropTypes.object,
--- a/frontend/src/Activity/History/HistoryConnector.js
+++ b/frontend/src/Activity/History/HistoryConnector.js
@ -14,10 +14,13 @@ import History from './History';
 function createMapStateToProps() {
  return createSelector(
    (state) => state.history,
+    (state) => state.artist,
    (state) => state.albums,
    (state) => state.tracks,
-    (history, albums, tracks) => {
+    (history, artist, albums, tracks) => {
      return {
+        isArtistFetching: artist.isFetching,
+        isArtistPopulated: artist.isPopulated,
        isAlbumsFetching: albums.isFetching,
        isAlbumsPopulated: albums.isPopulated,
        albumsError: albums.error,
--- a/frontend/src/Activity/Queue/Queue.js
+++ b/frontend/src/Activity/Queue/Queue.js
@ -125,6 +125,8 @@ class Queue extends Component {
      isPopulated,
      error,
      items,
+      isArtistFetching,
+      isArtistPopulated,
      isAlbumsFetching,
      isAlbumsPopulated,
      albumsError,
@ -145,8 +147,8 @@ class Queue extends Component {
      isPendingSelected
    } = this.state;

-    const isRefreshing = isFetching || isAlbumsFetching || isRefreshMonitoredDownloadsExecuting;
-    const isAllPopulated = isPopulated && (isAlbumsPopulated || !items.length || items.every((e) => !e.albumId));
+    const isRefreshing = isFetching || isArtistFetching || isAlbumsFetching || isRefreshMonitoredDownloadsExecuting;
+    const isAllPopulated = isPopulated && ((isArtistPopulated && isAlbumsPopulated) || !items.length || items.every((e) => !e.albumId));
    const hasError = error || albumsError;
    const selectedIds = this.getSelectedIds();
    const selectedCount = selectedIds.length;
@ -280,6 +282,8 @@ Queue.propTypes = {
  isPopulated: PropTypes.bool.isRequired,
  error: PropTypes.object,
  items: PropTypes.arrayOf(PropTypes.object).isRequired,
+  isArtistFetching: PropTypes.bool.isRequired,
+  isArtistPopulated: PropTypes.bool.isRequired,
  isAlbumsFetching: PropTypes.bool.isRequired,
  isAlbumsPopulated: PropTypes.bool.isRequired,
  albumsError: PropTypes.object,
--- a/frontend/src/Activity/Queue/QueueConnector.js
+++ b/frontend/src/Activity/Queue/QueueConnector.js
@ -15,12 +15,15 @@ import Queue from './Queue';

 function createMapStateToProps() {
  return createSelector(
+    (state) => state.artist,
    (state) => state.albums,
    (state) => state.queue.options,
    (state) => state.queue.paged,
    createCommandExecutingSelector(commandNames.REFRESH_MONITORED_DOWNLOADS),
-    (albums, options, queue, isRefreshMonitoredDownloadsExecuting) => {
+    (artist, albums, options, queue, isRefreshMonitoredDownloadsExecuting) => {
      return {
+        isArtistFetching: artist.isFetching,
+        isArtistPopulated: artist.isPopulated,
        isAlbumsFetching: albums.isFetching,
        isAlbumsPopulated: albums.isPopulated,
        albumsError: albums.error,
--- a/frontend/src/Wanted/CutoffUnmet/CutoffUnmet.js
+++ b/frontend/src/Wanted/CutoffUnmet/CutoffUnmet.js
@ -113,6 +113,8 @@ class CutoffUnmet extends Component {
      isPopulated,
      error,
      items,
+      isArtistFetching,
+      isArtistPopulated,
      selectedFilterKey,
      filters,
      columns,
@ -130,6 +132,9 @@ class CutoffUnmet extends Component {
      isConfirmSearchAllCutoffUnmetModalOpen
    } = this.state;

+    const isAllPopulated = isPopulated && isArtistPopulated;
+    const isAnyFetching = isFetching || isArtistFetching;
+
    const itemsSelected = !!this.getSelectedIds().length;
    const isShowingMonitored = getMonitoredValue(this.props);

@ -178,26 +183,26 @@ class CutoffUnmet extends Component {

        <PageContentBody>
          {
-            isFetching && !isPopulated &&
+            isAnyFetching && !isAllPopulated &&
              <LoadingIndicator />
          }

          {
-            !isFetching && error &&
+            !isAnyFetching && error &&
              <div>
                Error fetching cutoff unmet
              </div>
          }

          {
-            isPopulated && !error && !items.length &&
+            isAllPopulated && !error && !items.length &&
              <div>
                No cutoff unmet items
              </div>
          }

          {
-            isPopulated && !error && !!items.length &&
+            isAllPopulated && !error && !!items.length &&
              <div>
                <Table
                  columns={columns}
@ -261,6 +266,8 @@ CutoffUnmet.propTypes = {
  isPopulated: PropTypes.bool.isRequired,
  error: PropTypes.object,
  items: PropTypes.arrayOf(PropTypes.object).isRequired,
+  isArtistFetching: PropTypes.bool.isRequired,
+  isArtistPopulated: PropTypes.bool.isRequired,
  selectedFilterKey: PropTypes.string.isRequired,
  filters: PropTypes.arrayOf(PropTypes.object).isRequired,
  columns: PropTypes.arrayOf(PropTypes.object).isRequired,
--- a/frontend/src/Wanted/CutoffUnmet/CutoffUnmetConnector.js
+++ b/frontend/src/Wanted/CutoffUnmet/CutoffUnmetConnector.js
@ -17,10 +17,13 @@ import CutoffUnmet from './CutoffUnmet';
 function createMapStateToProps() {
  return createSelector(
    (state) => state.wanted.cutoffUnmet,
+    (state) => state.artist,
    createCommandExecutingSelector(commandNames.CUTOFF_UNMET_ALBUM_SEARCH),
-    (cutoffUnmet, isSearchingForCutoffUnmetAlbums) => {
+    (cutoffUnmet, artist, isSearchingForCutoffUnmetAlbums) => {

      return {
+        isArtistFetching: artist.isFetching,
+        isArtistPopulated: artist.isPopulated,
        isSearchingForCutoffUnmetAlbums,
        isSaving: cutoffUnmet.items.filter((m) => m.isSaving).length > 1,
        ...cutoffUnmet
--- a/frontend/src/Wanted/Missing/Missing.js
+++ b/frontend/src/Wanted/Missing/Missing.js
@ -122,6 +122,8 @@ class Missing extends Component {
      isPopulated,
      error,
      items,
+      isArtistFetching,
+      isArtistPopulated,
      selectedFilterKey,
      filters,
      columns,
@ -140,6 +142,9 @@ class Missing extends Component {
      isInteractiveImportModalOpen
    } = this.state;

+    const isAllPopulated = isPopulated && isArtistPopulated;
+    const isAnyFetching = isFetching || isArtistFetching;
+
    const itemsSelected = !!this.getSelectedIds().length;
    const isShowingMonitored = getMonitoredValue(this.props);

@ -195,26 +200,26 @@ class Missing extends Component {

        <PageContentBody>
          {
-            isFetching && !isPopulated &&
+            isAnyFetching && !isAllPopulated &&
              <LoadingIndicator />
          }

          {
-            !isFetching && error &&
+            !isAnyFetching && error &&
              <div>
                Error fetching missing items
              </div>
          }

          {
-            isPopulated && !error && !items.length &&
+            isAllPopulated && !error && !items.length &&
              <div>
                No missing items
              </div>
          }

          {
-            isPopulated && !error && !!items.length &&
+            isAllPopulated && !error && !!items.length &&
              <div>
                <Table
                  columns={columns}
@ -284,6 +289,8 @@ Missing.propTypes = {
  isPopulated: PropTypes.bool.isRequired,
  error: PropTypes.object,
  items: PropTypes.arrayOf(PropTypes.object).isRequired,
+  isArtistFetching: PropTypes.bool.isRequired,
+  isArtistPopulated: PropTypes.bool.isRequired,
  selectedFilterKey: PropTypes.string.isRequired,
  filters: PropTypes.arrayOf(PropTypes.object).isRequired,
  columns: PropTypes.arrayOf(PropTypes.object).isRequired,
--- a/frontend/src/Wanted/Missing/MissingConnector.js
+++ b/frontend/src/Wanted/Missing/MissingConnector.js
@ -16,10 +16,13 @@ import Missing from './Missing';
 function createMapStateToProps() {
  return createSelector(
    (state) => state.wanted.missing,
+    (state) => state.artist,
    createCommandExecutingSelector(commandNames.MISSING_ALBUM_SEARCH),
-    (missing, isSearchingForMissingAlbums) => {
+    (missing, artist, isSearchingForMissingAlbums) => {

      return {
+        isArtistFetching: artist.isFetching,
+        isArtistPopulated: artist.isPopulated,
        isSearchingForMissingAlbums,
        isSaving: missing.items.filter((m) => m.isSaving).length > 1,
        ...missing