Loader for AddToPlaylist modal

src/js/views/library/LibraryPlaylists.js

@@ -19,7 +19,6 @@ import { I18n, i18n } from '../../locale';
 import Loader from '../../components/Loader';
 import {
   makeLibrarySelector,
-  makeLoadingSelector,
   makeProcessProgressSelector,
 } from '../../util/selectors';
 

src/js/views/modals/AddToPlaylist.js

@@ -14,12 +14,22 @@ import { sourceIcon, decodeMopidyUri } from '../../util/helpers';
 import { sortItems } from '../../util/arrays';
 import { I18n, i18n } from '../../locale';
 import { collate } from '../../util/format';
+import { makeProcessProgressSelector } from '../../util/selectors';
+
+const processKeys = [
+  'MOPIDY_GET_LIBRARY_PLAYLISTS',
+  'SPOTIFY_GET_LIBRARY_PLAYLISTS',
+];
 
 class AddToPlaylist extends React.Component {
   componentDidMount = () => {
     const {
-      spotify_library,
-      mopidy_library,
+      spotify_library: {
+        items_uris: spotify_library,
+      },
+      mopidy_library: {
+        items_uris: mopidy_library,
+      },
       spotify_available,
       coreActions: {
         loadLibrary,
@@ -29,11 +39,11 @@ class AddToPlaylist extends React.Component {
       },
     } = this.props;
 
-    if (!spotify_library && spotify_available) {
+    if (!spotify_library.length && spotify_available) {
       loadLibrary('spotify:library:playlists');
     }
 
-    if (!mopidy_library) {
+    if (!mopidy_library.length) {
       loadLibrary('mopidy:library:playlists');
     }
 
@@ -58,8 +68,13 @@ class AddToPlaylist extends React.Component {
       items,
       spotify_library = { items_uris: [] },
       mopidy_library = { items_uris: [] },
+      loading_progress,
     } = this.props;
 
+    if (loading_progress !== null) {
+      return <Loader body loading progress={loading_progress} />;
+    }
+
     let playlists = [
       ...(collate(spotify_library, { items }).items),
       ...(collate(mopidy_library, { items }).items),
@@ -114,9 +129,6 @@ const mapStateToProps = (state, ownProps) => {
       } = {},
       access_token: spotify_available,
     },
-    ui: {
-      load_queue,
-    },
     core: {
       playlists,
       items,
@@ -124,17 +136,19 @@ const mapStateToProps = (state, ownProps) => {
     },
     mopidy: {
       uri_schemes: mopidy_uri_schemes,
-    }
+    },
   } = state;
 
+  const processProgressSelector = makeProcessProgressSelector(processKeys);
+
   return {
     uris: (ownProps.match.params.uris ? decodeURIComponent(ownProps.match.params.uris).split(',') : []),
     mopidy_uri_schemes,
     items,
-    mopidy_library: libraries['mopidy:library:playlists'],
-    spotify_library: libraries['spotify:library:playlists'],
+    mopidy_library: libraries['mopidy:library:playlists'] || { items_uris: [] },
+    spotify_library: libraries['spotify:library:playlists'] || { items_uris: [] },
     spotify_available,
-    load_queue,
+    loading_progress: processProgressSelector(state),
     me_id,
     playlists,
   };