Fixed: Error refreshing page in Activity/Wanted

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,

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
       };

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 isFetchingAny = isFetching || isArtistFetching || isAlbumsFetching;
-    const isAllPopulated = isPopulated && (isAlbumsPopulated || !items.length);
+    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,

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,

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 isRefreshing = isFetching || isArtistFetching || isAlbumsFetching || isRefreshMonitoredDownloadsExecuting;
-    const isAllPopulated = isPopulated && (isAlbumsPopulated || !items.length || items.every((e) => !e.albumId));
+    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,

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,

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,

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

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,

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