Loading playlist group with images (need to batch to avoid timeout)

This commit is contained in:
James Barnsley
2022-05-22 20:58:38 +12:00
parent 73a02caf9f
commit 649442600d
9 changed files with 264 additions and 244 deletions

View File

@ -160118,8 +160118,8 @@ var GridItem = function GridItem(_ref2) {
}
break;
// case 'playlist':
case 'playlist':
case 'album':
dispatch(_services_mopidy_actions__WEBPACK_IMPORTED_MODULE_11__["getImages"]([item.uri]));
break;
@ -164819,7 +164819,7 @@ var Sidebar = function Sidebar() {
path: "sidebar.discover",
"data-qa-node": "I18n",
"data-qa-file": "Sidebar"
})), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Link__WEBPACK_IMPORTED_MODULE_2__["default"], {
})), spotify_available && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Link__WEBPACK_IMPORTED_MODULE_2__["default"], {
to: "/discover/recommendations",
className: "sidebar__menu__item",
activeClassName: "sidebar__menu__item--active",
@ -164849,22 +164849,7 @@ var Sidebar = function Sidebar() {
path: "sidebar.moods",
"data-qa-node": "I18n",
"data-qa-file": "Sidebar"
})), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Link__WEBPACK_IMPORTED_MODULE_2__["default"], {
to: "/discover/categories",
className: "sidebar__menu__item",
activeClassName: "sidebar__menu__item--active",
"data-qa-node": "Link",
"data-qa-file": "Sidebar"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Icon__WEBPACK_IMPORTED_MODULE_3__["default"], {
name: "mood",
type: "material",
"data-qa-node": "Icon",
"data-qa-file": "Sidebar"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_locale__WEBPACK_IMPORTED_MODULE_6__["I18n"], {
path: "sidebar.genre",
"data-qa-node": "I18n",
"data-qa-file": "Sidebar"
})), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Link__WEBPACK_IMPORTED_MODULE_2__["default"], {
})), spotify_available && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Link__WEBPACK_IMPORTED_MODULE_2__["default"], {
to: "/discover/featured",
className: "sidebar__menu__item",
activeClassName: "sidebar__menu__item--active",
@ -169963,7 +169948,7 @@ var CoreMiddleware = function () {
var uri = action.uri,
_options2 = action.options;
var _fetch = function _fetch() {
var fetch = function fetch() {
switch (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_6__["uriSource"])(action.uri)) {
case 'spotify':
store.dispatch(spotifyActions.getTrack(uri, _options2));
@ -169983,7 +169968,7 @@ var CoreMiddleware = function () {
Object(_util_library__WEBPACK_IMPORTED_MODULE_7__["ensureLoaded"])({
store: store,
action: action,
fetch: _fetch,
fetch: fetch,
dependents: ['images'],
fullDependents: _options2.lyrics ? ['lyrics_results'] : [],
type: 'track'
@ -169994,7 +169979,7 @@ var CoreMiddleware = function () {
case 'LOAD_ALBUM':
{
var _fetch2 = function _fetch2() {
var _fetch = function _fetch() {
switch (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_6__["uriSource"])(action.uri)) {
case 'spotify':
store.dispatch(spotifyActions.getAlbum(action.uri, action.options));
@ -170014,7 +169999,7 @@ var CoreMiddleware = function () {
Object(_util_library__WEBPACK_IMPORTED_MODULE_7__["ensureLoaded"])({
store: store,
action: action,
fetch: _fetch2,
fetch: _fetch,
dependents: ['images'],
fullDependents: ['tracks'],
type: 'album'
@ -170025,7 +170010,7 @@ var CoreMiddleware = function () {
case 'LOAD_ARTIST':
{
var _fetch3 = function _fetch3() {
var _fetch2 = function _fetch2() {
switch (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_6__["uriSource"])(action.uri)) {
case 'spotify':
store.dispatch(spotifyActions.getArtist(action.uri, action.options));
@ -170045,7 +170030,7 @@ var CoreMiddleware = function () {
Object(_util_library__WEBPACK_IMPORTED_MODULE_7__["ensureLoaded"])({
store: store,
action: action,
fetch: _fetch3,
fetch: _fetch2,
dependents: ['images'],
fullDependents: ['tracks', 'albums_uris'],
type: 'artist'
@ -170056,7 +170041,7 @@ var CoreMiddleware = function () {
case 'LOAD_PLAYLIST':
{
var _fetch4 = function _fetch4() {
var _fetch3 = function _fetch3() {
switch (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_6__["uriSource"])(action.uri)) {
case 'spotify':
store.dispatch(spotifyActions.getPlaylist(action.uri, action.options));
@ -170076,7 +170061,7 @@ var CoreMiddleware = function () {
Object(_util_library__WEBPACK_IMPORTED_MODULE_7__["ensureLoaded"])({
store: store,
action: action,
fetch: _fetch4,
fetch: _fetch3,
dependents: ['images'],
fullDependents: ['tracks'],
type: 'playlist'
@ -170087,10 +170072,10 @@ var CoreMiddleware = function () {
case 'LOAD_PLAYLIST_GROUP':
{
var _fetch5 = function _fetch5() {
var _fetch4 = function _fetch4() {
switch (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_6__["uriSource"])(action.uri)) {
case 'spotify':
store.dispatch(spotifyActions.getCategory(action.uri, action.options));
store.dispatch(spotifyActions.getMood(action.uri, action.options));
break;
default:
@ -170102,10 +170087,9 @@ var CoreMiddleware = function () {
Object(_util_library__WEBPACK_IMPORTED_MODULE_7__["ensureLoaded"])({
store: store,
action: action,
fetch: _fetch5,
fetch: _fetch4,
dependents: ['playlists_uris'],
type: 'playlist' // Refers to dependent's type
type: 'playlist'
});
next(action);
break;
@ -170113,7 +170097,7 @@ var CoreMiddleware = function () {
case 'LOAD_USER':
{
var _fetch6 = function _fetch6() {
var _fetch5 = function _fetch5() {
switch (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_6__["uriSource"])(action.uri)) {
case 'spotify':
store.dispatch(spotifyActions.getUser(action.uri, action.options));
@ -170133,7 +170117,7 @@ var CoreMiddleware = function () {
Object(_util_library__WEBPACK_IMPORTED_MODULE_7__["ensureLoaded"])({
store: store,
action: action,
fetch: _fetch6,
fetch: _fetch5,
fullDependents: ['playlists_uris'],
type: 'user'
});
@ -170141,29 +170125,6 @@ var CoreMiddleware = function () {
break;
}
case 'LOAD_CATEGORY':
var fetch = function fetch() {
switch (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_6__["uriSource"])(action.uri)) {
case 'spotify':
store.dispatch(spotifyActions.getCategory(action.uri, action.options));
break;
default:
// No mopidy category model
break;
}
};
Object(_util_library__WEBPACK_IMPORTED_MODULE_7__["ensureLoaded"])({
store: store,
action: action,
fetch: fetch,
fullDependents: ['playlists_uris'],
type: 'category'
});
next(action);
break;
case 'LOAD_LIBRARY':
store.dispatch(uiActions.startLoading(action.uri, action.uri));
@ -174445,11 +174406,26 @@ var MopidyMiddleware = function () {
}).then(function (browse) {
var playlists = Object(_util_format__WEBPACK_IMPORTED_MODULE_6__["formatPlaylists"])(browse);
var playlists_uris = Object(_util_arrays__WEBPACK_IMPORTED_MODULE_7__["arrayOf"])('uri', playlists);
store.dispatch(coreActions.itemsLoaded(playlists));
store.dispatch(coreActions.itemLoaded(_objectSpread(_objectSpread({}, playlistGroup), {}, {
loading: false,
playlists_uris: playlists_uris
})));
request(store, 'library.getImages', {
uris: playlists_uris
}).then(function (response) {
var playlistsWithImages = playlists.map(function (playlist) {
var images = response[playlist.uri] || [];
if (images) {
images = Object(_util_format__WEBPACK_IMPORTED_MODULE_6__["formatImages"])(Object(_util_format__WEBPACK_IMPORTED_MODULE_6__["digestMopidyImages"])(store.getState().mopidy, images));
}
return _objectSpread(_objectSpread({}, playlist), {}, {
images: images
});
});
store.dispatch(coreActions.itemsLoaded(playlistsWithImages));
store.dispatch(coreActions.itemLoaded(_objectSpread(_objectSpread({}, playlistGroup), {}, {
loading: false,
playlists_uris: playlists_uris
})));
});
});
break;
}
@ -177225,7 +177201,7 @@ function reducer() {
/*!********************************************!*\
!*** ./src/js/services/spotify/actions.js ***!
\********************************************/
/*! exports provided: set, connect, authorizationGranted, revokeAuthorization, refreshingToken, tokenChanged, importAuthorization, getMe, getTrack, getFeaturedPlaylists, getLibraryMoods, getCategory, getNewReleases, getURL, getMore, getSearchResults, getAutocompleteResults, clearAutocompleteResults, following, resolveRadioSeeds, getArtist, getArtistImages, playArtistTopTracks, getUser, getAlbum, createPlaylist, savePlaylist, getPlaylistTracks, getPlaylist, addTracksToPlaylist, deleteTracksFromPlaylist, reorderPlaylistTracks, getRecommendations, getGenres, flushLibrary, getLibraryPlaylists, getLibraryAlbums, getLibraryArtists, getLibraryTracks */
/*! exports provided: set, connect, authorizationGranted, revokeAuthorization, refreshingToken, tokenChanged, importAuthorization, getMe, getTrack, getFeaturedPlaylists, getLibraryMoods, getMood, getNewReleases, getURL, getMore, getSearchResults, getAutocompleteResults, clearAutocompleteResults, following, resolveRadioSeeds, getArtist, getArtistImages, playArtistTopTracks, getUser, getAlbum, createPlaylist, savePlaylist, getPlaylistTracks, getPlaylist, addTracksToPlaylist, deleteTracksFromPlaylist, reorderPlaylistTracks, getRecommendations, getGenres, flushLibrary, getLibraryPlaylists, getLibraryAlbums, getLibraryArtists, getLibraryTracks */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
@ -177241,7 +177217,7 @@ __webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getTrack", function() { return getTrack; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getFeaturedPlaylists", function() { return getFeaturedPlaylists; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getLibraryMoods", function() { return getLibraryMoods; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getCategory", function() { return getCategory; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getMood", function() { return getMood; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getNewReleases", function() { return getNewReleases; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getURL", function() { return getURL; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getMore", function() { return getMore; });
@ -177662,64 +177638,77 @@ function getFeaturedPlaylists() {
});
};
}
function getLibraryMoods() {
function getLibraryMoods(forceRefetch) {
return function (dispatch, getState) {
var loaderId = Object(_util_helpers__WEBPACK_IMPORTED_MODULE_2__["generateGuid"])();
dispatch(uiActions.startLoading(loaderId, 'spotify_moods'));
var endpoint = 'browse/categories';
endpoint += '?limit=50';
endpoint += "&country=".concat(getState().spotify.country);
endpoint += "&locale=".concat(getState().spotify.locale);
request({
dispatch: dispatch,
getState: getState,
endpoint: endpoint
}).then(function (response) {
var results = Object(_util_format__WEBPACK_IMPORTED_MODULE_3__["formatCategories"])(response.categories.items);
var _getState = getState(),
_getState$spotify = _getState.spotify;
var fetchResults = function fetchResults(resultsEndpoint) {
return request({
dispatch: dispatch,
getState: getState,
endpoint: resultsEndpoint
}).then(function (response) {
results = [].concat(_toConsumableArray(results), _toConsumableArray(Object(_util_format__WEBPACK_IMPORTED_MODULE_3__["formatCategories"])(response.categories.items)));
_getState$spotify = _getState$spotify === void 0 ? {} : _getState$spotify;
var country = _getState$spotify.country,
locale = _getState$spotify.locale;
var processKey = 'SPOTIFY_GET_LIBRARY_MOODS';
dispatch(uiActions.startProcess(processKey, {
notification: false
}));
var libraryItems = [];
if (response.categories.next) {
fetchResults(response.categories.next);
} else {
dispatch({
type: 'SPOTIFY_CATEGORIES_LOADED',
categories: results
});
dispatch(uiActions.stopLoading(loaderId));
}
});
};
var fetch = function fetch(endpoint) {
return request({
dispatch: dispatch,
getState: getState,
endpoint: endpoint
}).then(function (response) {
var processor = getState().ui.processes[processKey];
fetchResults(endpoint);
}, function (error) {
dispatch(uiActions.stopLoading(loaderId));
dispatch(coreActions.handleException('Could not load categories', error));
});
if (processor && processor.status === 'cancelling') {
dispatch(uiActions.stopLoading('spotify:library:moods'));
dispatch(uiActions.processCancelled(processKey));
return;
}
dispatch(uiActions.updateProcess(processKey, {
total: response.total,
remaining: response.total - libraryItems.length
}));
var items = Object(_util_format__WEBPACK_IMPORTED_MODULE_3__["formatPlaylistGroups"])(response.categories.items);
libraryItems = [].concat(_toConsumableArray(libraryItems), _toConsumableArray(items));
if (response.next) {
fetch("".concat(response.next).concat(forceRefetch ? "&refetch=".concat(Date.now()) : ''));
} else {
dispatch(uiActions.processFinished(processKey));
dispatch(coreActions.itemsLoaded(libraryItems));
dispatch(coreActions.libraryLoaded({
uri: 'spotify:categories',
type: 'moods',
items_uris: Object(_util_arrays__WEBPACK_IMPORTED_MODULE_1__["arrayOf"])('uri', libraryItems)
}));
}
});
};
var endpoint = "browse/categories?limit=50&country=".concat(country, "&locale=").concat(locale);
if (forceRefetch) endpoint += "&refetch=".concat(Date.now());
fetch(endpoint);
};
}
function getCategory(uri) {
function getMood(uri) {
var _ref3 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
forceRefetch = _ref3.forceRefetch;
return function (dispatch, getState) {
var _getState2 = getState(),
_getState2$spotify = _getState2.spotify;
_getState2$spotify = _getState2$spotify === void 0 ? {} : _getState2$spotify;
var country = _getState2$spotify.country,
locale = _getState2$spotify.locale;
var loaderId = Object(_util_helpers__WEBPACK_IMPORTED_MODULE_2__["generateGuid"])();
dispatch(uiActions.startLoading(loaderId, "spotify_category_".concat(uri)));
dispatch(uiActions.startLoading(loaderId, "spotify_mood_".concat(uri)));
var id = Object(_util_helpers__WEBPACK_IMPORTED_MODULE_2__["getFromUri"])('categoryid', uri);
var endpoint = "browse/categories/".concat(id);
endpoint += "?country=".concat(getState().spotify.country);
endpoint += "&locale=".concat(getState().spotify.locale);
var endpoint = "browse/categories/".concat(id, "?country=").concat(country, "&locale=").concat(locale);
if (forceRefetch) endpoint += "&refetch=".concat(Date.now());
var plEndpoint = "browse/categories/".concat(id, "/playlists");
plEndpoint += '?limit=50';
plEndpoint += "&country=".concat(getState().spotify.country);
plEndpoint += "&locale=".concat(getState().spotify.locale);
var plEndpoint = "browse/categories/".concat(id, "/playlists?limit=50&country=").concat(country, "&locale=").concat(locale);
if (forceRefetch) plEndpoint += "&refetch=".concat(Date.now());
request({
dispatch: dispatch,
@ -177727,7 +177716,7 @@ function getCategory(uri) {
endpoint: endpoint,
uri: uri
}).then(function (response) {
var category = Object(_util_format__WEBPACK_IMPORTED_MODULE_3__["formatCategory"])(response);
var playlistGroup = Object(_util_format__WEBPACK_IMPORTED_MODULE_3__["formatPlaylistGroup"])(response);
var playlists = [];
var fetchPlaylists = function fetchPlaylists(plEndpoint) {
@ -177741,7 +177730,7 @@ function getCategory(uri) {
if (response.playlists.next) {
fetchPlaylists(response.playlists.next);
} else {
dispatch(coreActions.itemLoaded(_objectSpread(_objectSpread({}, category), {}, {
dispatch(coreActions.itemLoaded(_objectSpread(_objectSpread({}, playlistGroup), {}, {
playlists_uris: Object(_util_arrays__WEBPACK_IMPORTED_MODULE_1__["arrayOf"])('uri', playlists)
})));
dispatch(coreActions.itemsLoaded(playlists));
@ -177826,11 +177815,11 @@ function getSearchResults(_ref4) {
var offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
var processKey = 'SPOTIFY_GET_SEARCH_RESULTS';
return function (dispatch, getState) {
var _getState = getState(),
_getState$spotify$me = _getState.spotify.me;
var _getState3 = getState(),
_getState3$spotify$me = _getState3.spotify.me;
_getState$spotify$me = _getState$spotify$me === void 0 ? {} : _getState$spotify$me;
var meId = _getState$spotify$me.id;
_getState3$spotify$me = _getState3$spotify$me === void 0 ? {} : _getState3$spotify$me;
var meId = _getState3$spotify$me.id;
dispatch(uiActions.startProcess(processKey, {
content: 'Searching Spotify'
}));
@ -178024,11 +178013,11 @@ function following(uri) {
break;
case 'playlist':
var _getState2 = getState(),
_getState2$spotify$me = _getState2.spotify.me;
var _getState4 = getState(),
_getState4$spotify$me = _getState4.spotify.me;
_getState2$spotify$me = _getState2$spotify$me === void 0 ? {} : _getState2$spotify$me;
var meId = _getState2$spotify$me.id;
_getState4$spotify$me = _getState4$spotify$me === void 0 ? {} : _getState4$spotify$me;
var meId = _getState4$spotify$me.id;
if (method === 'GET') {
endpoint = "playlists/".concat(Object(_util_helpers__WEBPACK_IMPORTED_MODULE_2__["getFromUri"])('playlistid', uri), "/followers/contains?ids=").concat(meId);
@ -178413,11 +178402,11 @@ function createPlaylist(playlist) {
collaborative: playlist.collaborative
};
var _getState3 = getState(),
_getState3$spotify$me = _getState3.spotify.me;
var _getState5 = getState(),
_getState5$spotify$me = _getState5.spotify.me;
_getState3$spotify$me = _getState3$spotify$me === void 0 ? {} : _getState3$spotify$me;
var meId = _getState3$spotify$me.id;
_getState5$spotify$me = _getState5$spotify$me === void 0 ? {} : _getState5$spotify$me;
var meId = _getState5$spotify$me.id;
request({
dispatch: dispatch,
getState: getState,
@ -178455,11 +178444,11 @@ function savePlaylist(uri, name, description, is_public, is_collaborative, image
collaborative: is_collaborative
};
var _getState4 = getState(),
_getState4$spotify$me = _getState4.spotify.me;
var _getState6 = getState(),
_getState6$spotify$me = _getState6.spotify.me;
_getState4$spotify$me = _getState4$spotify$me === void 0 ? {} : _getState4$spotify$me;
var meId = _getState4$spotify$me.id; // Update the playlist fields
_getState6$spotify$me = _getState6$spotify$me === void 0 ? {} : _getState6$spotify$me;
var meId = _getState6$spotify$me.id; // Update the playlist fields
request({
dispatch: dispatch,
@ -178576,11 +178565,11 @@ function getPlaylist(uri) {
var full = options.full,
forceRefetch = options.forceRefetch;
return function (dispatch, getState) {
var _getState5 = getState(),
_getState5$spotify$me = _getState5.spotify.me;
var _getState7 = getState(),
_getState7$spotify$me = _getState7.spotify.me;
_getState5$spotify$me = _getState5$spotify$me === void 0 ? {} : _getState5$spotify$me;
var meId = _getState5$spotify$me.id;
_getState7$spotify$me = _getState7$spotify$me === void 0 ? {} : _getState7$spotify$me;
var meId = _getState7$spotify$me.id;
var endpoint = "playlists/".concat(Object(_util_helpers__WEBPACK_IMPORTED_MODULE_2__["getFromUri"])('playlistid', uri));
endpoint += "?market=".concat(getState().spotify.country);
if (forceRefetch) endpoint += "&refetch=".concat(Date.now());
@ -178849,11 +178838,11 @@ function flushLibrary() {
}
function getLibraryPlaylists(forceRefetch) {
return function (dispatch, getState) {
var _getState6 = getState(),
_getState6$spotify$me = _getState6.spotify.me;
var _getState8 = getState(),
_getState8$spotify$me = _getState8.spotify.me;
_getState6$spotify$me = _getState6$spotify$me === void 0 ? {} : _getState6$spotify$me;
var meId = _getState6$spotify$me.id;
_getState8$spotify$me = _getState8$spotify$me === void 0 ? {} : _getState8$spotify$me;
var meId = _getState8$spotify$me.id;
var processKey = 'SPOTIFY_GET_LIBRARY_PLAYLISTS';
dispatch(uiActions.startProcess(processKey, {
notification: false
@ -181860,7 +181849,7 @@ var formatClient = function formatClient(data) {
var client = {
type: 'client'
};
var fields = ['id', 'connected', 'name', 'host_name', 'volume', 'mute', 'latency', 'power_on_command', 'power_off_command'];
var fields = ['id', 'loading', 'connected', 'name', 'host_name', 'volume', 'mute', 'latency', 'power_on_command', 'power_off_command'];
for (var _i8 = 0, _fields8 = fields; _i8 < _fields8.length; _i8++) {
var field = _fields8[_i8];
@ -181922,7 +181911,7 @@ var formatCategory = function formatCategory(data) {
var category = {
type: 'category'
};
var fields = ['id', 'uri', 'name', 'playlists_uris'];
var fields = ['id', 'uri', 'loading', 'name', 'playlists_uris'];
for (var _i9 = 0, _fields9 = fields; _i9 < _fields9.length; _i9++) {
var field = _fields9[_i9];
@ -181947,7 +181936,7 @@ var formatPlaylistGroup = function formatPlaylistGroup(data) {
var playlistGroup = {
type: 'playlist_group'
};
var fields = ['id', 'uri', 'name', 'playlists_uris'];
var fields = ['id', 'uri', 'loading', 'name', 'playlists_uris'];
for (var _i10 = 0, _fields10 = fields; _i10 < _fields10.length; _i10++) {
var field = _fields10[_i10];
@ -181957,6 +181946,10 @@ var formatPlaylistGroup = function formatPlaylistGroup(data) {
}
}
if (data.id) {
playlistGroup.uri = "spotify:category:".concat(data.id);
}
if (data.icons) {
playlistGroup.images = formatImages(data.icons);
}
@ -181975,7 +181968,7 @@ var formatGroup = function formatGroup(data) {
var group = {
type: 'group'
};
var fields = ['id', 'name', 'mute', 'stream_id', 'clients_ids'];
var fields = ['id', 'name', 'loading', 'mute', 'stream_id', 'clients_ids'];
for (var _i11 = 0, _fields11 = fields; _i11 < _fields11.length; _i11++) {
var field = _fields11[_i11];
@ -187279,6 +187272,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
var SORT_KEY = 'playlist_group';
var PlaylistGroup = function PlaylistGroup(_ref) {
var _playlistGroup$playli, _playlistGroup$playli2;
var uri = _ref.uri,
playlistGroup = _ref.playlistGroup,
playlistsProp = _ref.playlists,
@ -187328,7 +187323,7 @@ var PlaylistGroup = function PlaylistGroup(_ref) {
hideContextMenu();
};
if (loading || (playlistGroup === null || playlistGroup === void 0 ? void 0 : playlistGroup.loading)) {
if (loading) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Loader__WEBPACK_IMPORTED_MODULE_9__["default"], {
body: true,
loading: true,
@ -187417,7 +187412,16 @@ var PlaylistGroup = function PlaylistGroup(_ref) {
type: "material",
"data-qa-node": "Icon",
"data-qa-file": "PlaylistGroup"
}), playlistGroup.name || name), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
}), playlistGroup.name || name), (playlistGroup === null || playlistGroup === void 0 ? void 0 : playlistGroup.loading) ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Loader__WEBPACK_IMPORTED_MODULE_9__["default"], {
progress: {
remaining: playlistGroup === null || playlistGroup === void 0 ? void 0 : (_playlistGroup$playli = playlistGroup.playlists_uris) === null || _playlistGroup$playli === void 0 ? void 0 : _playlistGroup$playli.length,
total: playlistGroup === null || playlistGroup === void 0 ? void 0 : (_playlistGroup$playli2 = playlistGroup.playlists_uris) === null || _playlistGroup$playli2 === void 0 ? void 0 : _playlistGroup$playli2.length
},
body: true,
loading: true,
"data-qa-node": "Loader",
"data-qa-file": "PlaylistGroup"
}) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: "content-wrapper",
"data-qa-node": "div",
"data-qa-file": "PlaylistGroup"

File diff suppressed because one or more lines are too long

View File

@ -99,7 +99,7 @@ const GridItem = ({
dispatch(spotifyActions.getArtistImages(item));
}
break;
case 'playlist':
// case 'playlist':
case 'album':
dispatch(mopidyActions.getImages([item.uri]));
break;

View File

@ -89,22 +89,26 @@ const Sidebar = () => {
<title className="sidebar__menu__section__title">
<I18n path="sidebar.discover" />
</title>
<Link to="/discover/recommendations" className="sidebar__menu__item" activeClassName="sidebar__menu__item--active">
<Icon name="explore" type="material" />
<I18n path="sidebar.discover" />
</Link>
{spotify_available && (
<Link
to="/discover/recommendations"
className="sidebar__menu__item"
activeClassName="sidebar__menu__item--active"
>
<Icon name="explore" type="material" />
<I18n path="sidebar.discover" />
</Link>
)}
<Link to="/discover/moods" className="sidebar__menu__item" activeClassName="sidebar__menu__item--active">
<Icon name="mood" type="material" />
<I18n path="sidebar.moods" />
</Link>
<Link to="/discover/categories" className="sidebar__menu__item" activeClassName="sidebar__menu__item--active">
<Icon name="mood" type="material" />
<I18n path="sidebar.genre" />
</Link>
<Link to="/discover/featured" className="sidebar__menu__item" activeClassName="sidebar__menu__item--active">
<Icon name="star" type="material" />
<I18n path="sidebar.featured_playlists" />
</Link>
{spotify_available && (
<Link to="/discover/featured" className="sidebar__menu__item" activeClassName="sidebar__menu__item--active">
<Icon name="star" type="material" />
<I18n path="sidebar.featured_playlists" />
</Link>
)}
<Link to="/discover/new-releases" className="sidebar__menu__item" activeClassName="sidebar__menu__item--active">
<Icon name="new_releases" type="material" />
<I18n path="sidebar.new_releases" />

View File

@ -504,7 +504,7 @@ const CoreMiddleware = (function () {
const fetch = () => {
switch (uriSource(action.uri)) {
case 'spotify':
store.dispatch(spotifyActions.getCategory(action.uri, action.options));
store.dispatch(spotifyActions.getMood(action.uri, action.options));
break;
default:
store.dispatch(mopidyActions.getPlaylistGroup(action.uri, action.options));
@ -516,7 +516,7 @@ const CoreMiddleware = (function () {
action,
fetch,
dependents: ['playlists_uris'],
type: 'playlist', // Refers to dependent's type
type: 'playlist',
});
next(action);
break;
@ -547,28 +547,6 @@ const CoreMiddleware = (function () {
break;
}
case 'LOAD_CATEGORY':
const fetch = () => {
switch (uriSource(action.uri)) {
case 'spotify':
store.dispatch(spotifyActions.getCategory(action.uri, action.options));
break;
default:
// No mopidy category model
break;
}
};
ensureLoaded({
store,
action,
fetch,
fullDependents: ['playlists_uris'],
type: 'category',
});
next(action);
break;
case 'LOAD_LIBRARY':
store.dispatch(uiActions.startLoading(action.uri, action.uri));
const fetchLibrary = () => {

View File

@ -1996,13 +1996,27 @@ const MopidyMiddleware = (function () {
.then((browse) => {
const playlists = formatPlaylists(browse);
const playlists_uris = arrayOf('uri', playlists);
store.dispatch(coreActions.itemsLoaded(playlists));
store.dispatch(coreActions.itemLoaded({
...playlistGroup,
loading: false,
playlists_uris,
}));
})
request(store, 'library.getImages', { uris: playlists_uris })
.then((response) => {
const playlistsWithImages = playlists.map((playlist) => {
let images = response[playlist.uri] || [];
if (images) {
images = formatImages(digestMopidyImages(store.getState().mopidy, images));
}
return {
...playlist,
images,
};
});
store.dispatch(coreActions.itemsLoaded(playlistsWithImages));
store.dispatch(coreActions.itemLoaded({
...playlistGroup,
loading: false,
playlists_uris,
}));
});
});
break;
}
case 'MOPIDY_GET_LIBRARY_PLAYLISTS': {

View File

@ -7,8 +7,8 @@ import {
upgradeSpotifyPlaylistUris,
} from '../../util/helpers';
import {
formatCategory,
formatCategories,
formatPlaylistGroup,
formatPlaylistGroups,
formatTracks,
formatPlaylist,
formatPlaylists,
@ -421,68 +421,69 @@ export function getFeaturedPlaylists(forceRefetch = false) {
};
}
export function getLibraryMoods() {
export function getLibraryMoods(forceRefetch) {
return (dispatch, getState) => {
const loaderId = generateGuid();
dispatch(uiActions.startLoading(loaderId, 'spotify_moods'));
const {
spotify: {
country,
locale,
} = {},
} = getState();
const processKey = 'SPOTIFY_GET_LIBRARY_MOODS';
dispatch(uiActions.startProcess(processKey, { notification: false }));
let endpoint = 'browse/categories';
endpoint += '?limit=50';
endpoint += `&country=${getState().spotify.country}`;
endpoint += `&locale=${getState().spotify.locale}`;
let libraryItems = [];
const fetch = (endpoint) => request({ dispatch, getState, endpoint })
.then((response) => {
const processor = getState().ui.processes[processKey];
if (processor && processor.status === 'cancelling') {
dispatch(uiActions.stopLoading('spotify:library:moods'));
dispatch(uiActions.processCancelled(processKey));
return;
}
request({ dispatch, getState, endpoint })
.then(
(response) => {
let results = formatCategories(response.categories.items);
dispatch(uiActions.updateProcess(
processKey,
{ total: response.total, remaining: response.total - libraryItems.length },
));
const fetchResults = (resultsEndpoint) => request({
dispatch,
getState,
endpoint: resultsEndpoint,
}).then((response) => {
results = [
...results,
...formatCategories(response.categories.items),
];
if (response.categories.next) {
fetchResults(response.categories.next);
} else {
dispatch({
type: 'SPOTIFY_CATEGORIES_LOADED',
categories: results,
});
dispatch(uiActions.stopLoading(loaderId));
}
});
fetchResults(endpoint);
},
(error) => {
dispatch(uiActions.stopLoading(loaderId));
dispatch(coreActions.handleException(
'Could not load categories',
error,
));
},
);
const items = formatPlaylistGroups(response.categories.items);
libraryItems = [...libraryItems, ...items];
if (response.next) {
fetch(`${response.next}${forceRefetch ? `&refetch=${Date.now()}` : ''}`);
} else {
dispatch(uiActions.processFinished(processKey));
dispatch(coreActions.itemsLoaded(libraryItems));
dispatch(coreActions.libraryLoaded({
uri: 'spotify:categories',
type: 'moods',
items_uris: arrayOf('uri', libraryItems),
}));
}
});
let endpoint = `browse/categories?limit=50&country=${country}&locale=${locale}`;
if (forceRefetch) endpoint += `&refetch=${Date.now()}`;
fetch(endpoint);
};
}
export function getCategory(uri, { forceRefetch } = {}) {
export function getMood(uri, { forceRefetch } = {}) {
return (dispatch, getState) => {
const {
spotify: {
country,
locale,
} = {},
} = getState();
const loaderId = generateGuid();
dispatch(uiActions.startLoading(loaderId, `spotify_category_${uri}`));
dispatch(uiActions.startLoading(loaderId, `spotify_mood_${uri}`));
const id = getFromUri('categoryid', uri);
let endpoint = `browse/categories/${id}`;
endpoint += `?country=${getState().spotify.country}`;
endpoint += `&locale=${getState().spotify.locale}`;
let endpoint = `browse/categories/${id}?country=${country}&locale=${locale}`;
if (forceRefetch) endpoint += `&refetch=${Date.now()}`;
let plEndpoint = `browse/categories/${id}/playlists`;
plEndpoint += '?limit=50';
plEndpoint += `&country=${getState().spotify.country}`;
plEndpoint += `&locale=${getState().spotify.locale}`;
let plEndpoint = `browse/categories/${id}/playlists?limit=50&country=${country}&locale=${locale}`;
if (forceRefetch) plEndpoint += `&refetch=${Date.now()}`;
request({
@ -492,7 +493,7 @@ export function getCategory(uri, { forceRefetch } = {}) {
uri,
}).then(
(response) => {
const category = formatCategory(response);
const playlistGroup = formatPlaylistGroup(response);
let playlists = [];
const fetchPlaylists = (plEndpoint) => request({
@ -505,7 +506,7 @@ export function getCategory(uri, { forceRefetch } = {}) {
fetchPlaylists(response.playlists.next);
} else {
dispatch(coreActions.itemLoaded({
...category,
...playlistGroup,
playlists_uris: arrayOf('uri', playlists),
}));
dispatch(coreActions.itemsLoaded(playlists));

View File

@ -760,6 +760,7 @@ const formatClient = function (data) {
const client = { type: 'client' };
const fields = [
'id',
'loading',
'connected',
'name',
'host_name',
@ -825,6 +826,7 @@ const formatCategory = function (data) {
const fields = [
'id',
'uri',
'loading',
'name',
'playlists_uris',
];
@ -851,6 +853,7 @@ const formatPlaylistGroup = function (data) {
const fields = [
'id',
'uri',
'loading',
'name',
'playlists_uris',
];
@ -861,6 +864,10 @@ const formatPlaylistGroup = function (data) {
}
}
if (data.id) {
playlistGroup.uri = `spotify:category:${data.id}`
}
if (data.icons) {
playlistGroup.images = formatImages(data.icons);
}
@ -879,6 +886,7 @@ const formatGroup = function (data) {
const fields = [
'id',
'name',
'loading',
'mute',
'stream_id',
'clients_ids',

View File

@ -72,7 +72,7 @@ const PlaylistGroup = ({
hideContextMenu();
}
if (loading || playlistGroup?.loading) {
if (loading) {
return <Loader body loading />;
}
@ -138,11 +138,22 @@ const PlaylistGroup = ({
<Icon name="mood" type="material" />
{playlistGroup.name || name}
</Header>
<div className="content-wrapper">
<section className="grid-wrapper">
<Grid items={playlists} />
</section>
</div>
{playlistGroup?.loading ? (
<Loader
progress={{
remaining: playlistGroup?.playlists_uris?.length,
total: playlistGroup?.playlists_uris?.length,
}}
body
loading
/>
) : (
<div className="content-wrapper">
<section className="grid-wrapper">
<Grid items={playlists} />
</section>
</div>
)}
</div>
);
}