secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Selectors not properly memoized for Library views, renders every second (track position changing)

Browse Source
This commit is contained in:
James Barnsley
2020-09-25 06:54:19 +12:00
parent 6dbcb6ee8e
commit a409ca0f85
13 changed files with 490 additions and 474 deletions
Download Patch File Download Diff File Expand all files Collapse all files

742
mopidy_iris/static/app.js
View File

@ -100281,13 +100281,13 @@ var ContextMenu = /*#__PURE__*/function (_React$Component) {
var items = _this$props24$menu.items,
push = _this$props24.history.push;
if (!items || items.length <= 0 || !items[0].artists_uris || items[0].artists_uris.length <= 0) {
if (!items || items.length <= 0 || !items[0].artists || items[0].artists.length <= 0) {
return null;
}
hideContextMenu(); // note: we can only go to one artist (even if this item has multiple artists, just go to the first one)
push(Object(_util_helpers__WEBPACK_IMPORTED_MODULE_5__["buildLink"])(items[0].artists_uris[0]));
push(Object(_util_helpers__WEBPACK_IMPORTED_MODULE_5__["buildLink"])(items[0].artists[0].uri));
});
_defineProperty(_assertThisInitialized(_this), "goToUser", function () {
@ -101655,6 +101655,36 @@ var DebugInfo = /*#__PURE__*/function (_React$Component) {
_this = _super.call(this, props);
_defineProperty(_assertThisInitialized(_this), "renderLoadQueue", function () {
var load_queue = _this.props.ui.load_queue;
if (!load_queue) return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: "debug-info-item mid_grey-text",
"data-qa-node": "div",
"data-qa-file": "DebugInfo"
}, "Nothing loading");
var queue = Object(_util_arrays__WEBPACK_IMPORTED_MODULE_6__["indexToArray"])(load_queue);
if (queue.length > 0) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: "debug-info-item",
"data-qa-node": "div",
"data-qa-file": "DebugInfo"
}, queue.map(function (item, index) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
key: "".concat(item, "_").concat(index),
"data-qa-node": "div",
"data-qa-file": "DebugInfo"
}, item);
}));
}
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: "debug-info-item mid_grey-text",
"data-qa-node": "div",
"data-qa-file": "DebugInfo"
}, "Nothing loading");
});
_defineProperty(_assertThisInitialized(_this), "render", function () {
var localStorageUsage = _this.localStorageSize();
@ -101768,7 +101798,7 @@ var DebugInfo = /*#__PURE__*/function (_React$Component) {
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("h5", {
"data-qa-node": "h5",
"data-qa-file": "DebugInfo"
}, "Load queue"), _this.renderload_queue()));
}, "Load queue"), _this.renderLoadQueue()));
});
_this.state = {
@ -101811,37 +101841,6 @@ var DebugInfo = /*#__PURE__*/function (_React$Component) {
percent: (used / total * 100).toFixed(2)
};
}
}, {
key: "renderload_queue",
value: function renderload_queue() {
var load_queue = this.props.ui.load_queue;
if (!load_queue) return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: "debug-info-item mid_grey-text",
"data-qa-node": "div",
"data-qa-file": "DebugInfo"
}, "Nothing loading");
var queue = Object(_util_arrays__WEBPACK_IMPORTED_MODULE_6__["indexToArray"])(load_queue, null, true);
if (queue.length > 0) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: "debug-info-item",
"data-qa-node": "div",
"data-qa-file": "DebugInfo"
}, queue.map(function (item, index) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
key: "".concat(item, "_").concat(index),
"data-qa-node": "div",
"data-qa-file": "DebugInfo"
}, item);
}));
}
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: "debug-info-item mid_grey-text",
"data-qa-node": "div",
"data-qa-file": "DebugInfo"
}, "Nothing loading");
}
}]);
return DebugInfo;
@ -114934,8 +114933,6 @@ var CoreMiddleware = function () {
break;
case 'LOAD_ARTIST':
console.log(action);
var fetchArtist = function fetchArtist() {
switch (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_6__["uriSource"])(action.uri)) {
case 'spotify':
@ -115081,7 +115078,7 @@ var CoreMiddleware = function () {
break;
case 'LOAD_LIBRARY':
store.dispatch(uiActions.startLoading(action.uri));
store.dispatch(uiActions.startLoading(action.uri, action.uri));
var fetchLibrary = function fetchLibrary() {
switch (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_6__["uriSource"])(action.uri)) {
@ -115526,7 +115523,7 @@ var CoreMiddleware = function () {
break;
case 'RESTORE_ITEMS_FROM_COLD_STORE':
store.dispatch(uiActions.stopLoading(action.items));
store.dispatch(uiActions.stopLoading(Object(_util_arrays__WEBPACK_IMPORTED_MODULE_4__["arrayOf"])('uri', action.items)));
next(action);
break;
@ -118526,18 +118523,25 @@ var MopidyMiddleware = function () {
break;
case 'SET_WINDOW_FOCUS':
// Focus has just been regained
if (action.window_focus === true) {
store.dispatch(mopidyActions.getCurrentTrack());
store.dispatch(mopidyActions.getPlayState());
store.dispatch(mopidyActions.getVolume());
store.dispatch(mopidyActions.getMute());
store.dispatch(mopidyActions.getConsume());
store.dispatch(mopidyActions.getRandom());
store.dispatch(mopidyActions.getRepeat());
store.dispatch(mopidyActions.getTimePosition());
}
/**
* Disabled because it causes so many requests without any conscious user input.
* Will monitor to see if it has any adverse impact.
*/
/*
// Focus has just been regained
if (action.window_focus === true) {
store.dispatch(mopidyActions.getCurrentTrack());
store.dispatch(mopidyActions.getPlayState());
store.dispatch(mopidyActions.getVolume());
store.dispatch(mopidyActions.getMute());
store.dispatch(mopidyActions.getConsume());
store.dispatch(mopidyActions.getRandom());
store.dispatch(mopidyActions.getRepeat());
store.dispatch(mopidyActions.getTimePosition());
}
*/
next(action);
break;
case 'MOPIDY_REQUEST':
@ -119825,61 +119829,74 @@ var MopidyMiddleware = function () {
break;
case 'MOPIDY_GET_ARTIST':
request(store, 'library.lookup', {
uris: [action.uri]
}).then(function (_response) {
if (!_response) return;
var response = _response[action.uri];
if (!response || !response.length) return;
var albums = [];
{
request(store, 'library.lookup', {
uris: [action.uri]
}).then(function (_response) {
if (!_response) return;
var response = _response[action.uri];
if (!response || !response.length) return;
var albums = [];
for (var _i8 = 0; _i8 < response.length; _i8++) {
if (response[_i8].album) {
var album = _objectSpread(_objectSpread({}, response[_i8].album), {}, {
uri: response[_i8].album.uri
});
for (var _i8 = 0; _i8 < response.length; _i8++) {
if (response[_i8].album) {
(function () {
var album = _objectSpread(_objectSpread({}, response[_i8].album), {}, {
uri: response[_i8].album.uri
});
if (album) {
var getByURI = function getByURI(albumToCheck) {
return album.uri == albumToCheck.uri;
};
if (album) {
var existingAlbum = albums.find(function (albumToCheck) {
return album.uri === albumToCheck.uri;
});
var existingAlbum = albums.find(getByURI);
if (!existingAlbum) {
albums.push(album);
}
if (!existingAlbum) {
albums.push(album);
}
}
})();
}
}
}
if (albums) {
store.dispatch(coreActions.itemsLoaded(albums));
} // Get the artist object from the track. This is a bit ugly because it's a simplified
// (Mopidy) artist object but gives us enough to fetch their name and artwork.
if (albums) {
store.dispatch(coreActions.itemsLoaded(albums));
} // Get the artist object from the track. This is a bit ugly because it's a simplified
// (Mopidy) artist object but gives us enough to fetch their name and artwork.
var raw_artist = response[0].artists.find(function (item) {
return item.uri === action.uri;
var raw_artist = null;
response.forEach(function (track) {
var matchingArtist = track.artists.find(function (artist) {
return artist.uri === action.uri;
});
if (matchingArtist) {
raw_artist = matchingArtist;
}
});
var artist = _objectSpread({
uri: action.uri,
provider: 'mopidy',
albums_uris: Object(_util_arrays__WEBPACK_IMPORTED_MODULE_7__["arrayOf"])('uri', albums),
tracks: Object(_util_format__WEBPACK_IMPORTED_MODULE_6__["formatTracks"])(response)
}, raw_artist ? Object(_util_format__WEBPACK_IMPORTED_MODULE_6__["formatArtist"])(raw_artist) : {});
store.dispatch(coreActions.itemLoaded(artist)); // We may not have a raw_artist if the tracks' artist is not found (ie the requested
// artist may be the albumartist).
if (raw_artist) {
store.dispatch(lastfmActions.getArtist(artist.uri, artist.name, artist.musicbrainz_id)); // Load supprting information from LastFM and Discogs
if (store.getState().spotify.enabled) {
store.dispatch(spotifyActions.getArtistImages(artist));
} else {
store.dispatch(discogsActions.getArtistImages(artist.uri, artist));
}
}
});
var artist = _objectSpread({
uri: action.uri,
provider: 'mopidy',
albums_uris: Object(_util_arrays__WEBPACK_IMPORTED_MODULE_7__["arrayOf"])('uri', albums),
tracks: Object(_util_format__WEBPACK_IMPORTED_MODULE_6__["formatTracks"])(response)
}, raw_artist ? Object(_util_format__WEBPACK_IMPORTED_MODULE_6__["formatArtist"])(raw_artist) : {});
store.dispatch(coreActions.itemLoaded(artist));
store.dispatch(lastfmActions.getArtist(artist.uri, artist.name, artist.musicbrainz_id)); // Load supprting information from LastFM and Discogs
if (store.getState().spotify.enabled) {
store.dispatch(spotifyActions.getArtistImages(artist));
} else {
store.dispatch(discogsActions.getArtistImages(artist.uri, artist));
}
});
break;
break;
}
case 'MOPIDY_GET_ARTISTS':
request(store, 'library.lookup', {
@ -126250,7 +126267,7 @@ function reducer() {
case 'STOP_LOADING':
return _objectSpread(_objectSpread({}, ui), {}, {
load_queue: Object(lodash__WEBPACK_IMPORTED_MODULE_0__["omit"])(load_queue, action.keys)
load_queue: Object(lodash__WEBPACK_IMPORTED_MODULE_0__["omit"])(ui.load_queue, action.keys)
});
case 'START_PROCESS':
@ -134278,12 +134295,12 @@ var Track = /*#__PURE__*/function (_React$Component) {
var _this$props6 = _this.props,
uri = _this$props6.uri,
track = _this$props6.track,
load_queue = _this$props6.load_queue,
loading = _this$props6.loading,
slim_mode = _this$props6.slim_mode,
uiActions = _this$props6.uiActions,
genius_authorized = _this$props6.genius_authorized;
if (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_20__["isLoading"])(load_queue, ["(.*)".concat(uri, "(.*)")])) {
if (loading) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Loader__WEBPACK_IMPORTED_MODULE_13__["default"], {
body: true,
loading: true,
@ -134506,11 +134523,13 @@ var rebuildUri = function rebuildUri(uri) {
var mapStateToProps = function mapStateToProps(state, ownProps) {
var uri = decodeURIComponent(ownProps.match.params.uri);
uri = rebuildUri(uri);
var loadingSelector = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_23__["makeLoadingSelector"])(["(.*)".concat(uri, "(.*)")]);
var trackSelector = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_23__["makeItemSelector"])(uri);
return {
uri: uri,
slim_mode: state.ui.slim_mode,
load_queue: state.ui.load_queue,
track: Object(_util_selectors__WEBPACK_IMPORTED_MODULE_23__["getItemFromIndex"])(state, uri),
loading: loadingSelector(state),
track: trackSelector(state),
spotify_library_albums: state.spotify.library_albums,
local_library_albums: state.mopidy.library_albums,
lastfm_authorized: state.lastfm.authorization,
@ -136670,33 +136689,6 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
}
});
_defineProperty(_assertThisInitialized(_this), "shouldComponentUpdate", function (_ref2, _ref3) {
var prevAlbums = _ref2.albums,
prevSort = _ref2.sort,
prevSortReverse = _ref2.sort_reverse,
prevSource = _ref2.source,
prevView = _ref2.view;
var prevFilter = _ref3.filter,
prevLimit = _ref3.limit;
var _this$props = _this.props,
albums = _this$props.albums,
sort = _this$props.sort,
sort_reverse = _this$props.sort_reverse,
source = _this$props.source,
view = _this$props.view;
var _this$state = _this.state,
filter = _this$state.filter,
limit = _this$state.limit;
if (prevAlbums.length !== albums.length) return true;
if (prevSource !== source) return true;
if (prevSort !== sort) return true;
if (prevSortReverse !== sort_reverse) return true;
if (prevView !== view) return true;
if (prevFilter !== filter) return true;
if (prevLimit !== limit) return true;
return false;
});
_defineProperty(_assertThisInitialized(_this), "onRefresh", function () {
var hideContextMenu = _this.props.uiActions.hideContextMenu;
hideContextMenu();
@ -136710,9 +136702,9 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
_defineProperty(_assertThisInitialized(_this), "getMopidyLibrary", function () {
var forceRefetch = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var _this$props2 = _this.props,
source = _this$props2.source,
loadLibrary = _this$props2.coreActions.loadLibrary;
var _this$props = _this.props,
source = _this$props.source,
loadLibrary = _this$props.coreActions.loadLibrary;
if (source !== 'local' && source !== 'all') return;
loadLibrary('mopidy:library:albums', {
forceRefetch: forceRefetch
@ -136721,10 +136713,10 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
_defineProperty(_assertThisInitialized(_this), "getGoogleLibrary", function () {
var forceRefetch = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var _this$props3 = _this.props,
source = _this$props3.source,
google_available = _this$props3.google_available,
loadLibrary = _this$props3.coreActions.loadLibrary;
var _this$props2 = _this.props,
source = _this$props2.source,
google_available = _this$props2.google_available,
loadLibrary = _this$props2.coreActions.loadLibrary;
if (!google_available) return;
if (source !== 'google' && source !== 'all') return;
loadLibrary('google:library:albums', {
@ -136734,10 +136726,10 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
_defineProperty(_assertThisInitialized(_this), "getSpotifyLibrary", function () {
var forceRefetch = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var _this$props4 = _this.props,
source = _this$props4.source,
spotify_available = _this$props4.spotify_available,
loadLibrary = _this$props4.coreActions.loadLibrary;
var _this$props3 = _this.props,
source = _this$props3.source,
spotify_available = _this$props3.spotify_available,
loadLibrary = _this$props3.coreActions.loadLibrary;
if (!spotify_available) return;
if (source !== 'spotify' && source !== 'all') return;
loadLibrary('spotify:library:albums', {
@ -136756,12 +136748,12 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
});
_defineProperty(_assertThisInitialized(_this), "loadMore", function () {
var _this$state2 = _this.state,
limit = _this$state2.limit,
per_page = _this$state2.per_page;
var _this$props5 = _this.props,
state = _this$props5.location.state,
history = _this$props5.history;
var _this$state = _this.state,
limit = _this$state.limit,
per_page = _this$state.per_page;
var _this$props4 = _this.props,
state = _this$props4.location.state,
history = _this$props4.history;
var new_limit = limit + per_page;
_this.setState({
@ -136776,10 +136768,10 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
});
_defineProperty(_assertThisInitialized(_this), "setSort", function (value) {
var _this$props6 = _this.props,
sort = _this$props6.sort,
sort_reverse = _this$props6.sort_reverse,
set = _this$props6.uiActions.set;
var _this$props5 = _this.props,
sort = _this$props5.sort,
sort_reverse = _this$props5.sort_reverse,
set = _this$props5.uiActions.set;
var reverse = false;
if (sort === value) reverse = !sort_reverse;
set({
@ -136789,15 +136781,16 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
});
_defineProperty(_assertThisInitialized(_this), "renderView", function () {
var _this$props7 = _this.props,
sort = _this$props7.sort,
sort_reverse = _this$props7.sort_reverse,
view = _this$props7.view,
loading = _this$props7.loading;
var _this$state3 = _this.state,
limit = _this$state3.limit,
filter = _this$state3.filter;
var _this$props6 = _this.props,
sort = _this$props6.sort,
sort_reverse = _this$props6.sort_reverse,
view = _this$props6.view,
loading = _this$props6.loading;
var _this$state2 = _this.state,
limit = _this$state2.limit,
filter = _this$state2.filter;
var albums = _this.props.albums;
console.log('library albums render', loading, albums.length);
if (loading) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Loader__WEBPACK_IMPORTED_MODULE_18__["default"], {
@ -136867,17 +136860,17 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
});
_defineProperty(_assertThisInitialized(_this), "render", function () {
var _this$props8 = _this.props,
spotify_available = _this$props8.spotify_available,
google_available = _this$props8.google_available,
sort = _this$props8.sort,
view = _this$props8.view,
source = _this$props8.source,
sort_reverse = _this$props8.sort_reverse,
uiActions = _this$props8.uiActions;
var _this$state4 = _this.state,
filter = _this$state4.filter,
per_page = _this$state4.per_page;
var _this$props7 = _this.props,
spotify_available = _this$props7.spotify_available,
google_available = _this$props7.google_available,
sort = _this$props7.sort,
view = _this$props7.view,
source = _this$props7.source,
sort_reverse = _this$props7.sort_reverse,
uiActions = _this$props7.uiActions;
var _this$state3 = _this.state,
filter = _this$state3.filter,
per_page = _this$state3.per_page;
var source_options = [{
value: 'all',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_17__["i18n"])('fields.filters.all')
@ -137035,10 +137028,10 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
_createClass(LibraryAlbums, [{
key: "componentDidMount",
value: function componentDidMount() {
var _this$props9 = this.props,
_this$props9$location = _this$props9.location.state,
state = _this$props9$location === void 0 ? {} : _this$props9$location,
setWindowTitle = _this$props9.uiActions.setWindowTitle; // Restore any limit defined in our location state
var _this$props8 = this.props,
_this$props8$location = _this$props8.location.state,
state = _this$props8$location === void 0 ? {} : _this$props8$location,
setWindowTitle = _this$props8.uiActions.setWindowTitle; // Restore any limit defined in our location state
if (state.limit) {
this.setState({
@ -137051,6 +137044,19 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
this.getGoogleLibrary();
this.getSpotifyLibrary();
}
/*
componentDidUpdate(prevProps, prevState) {
Object.entries(this.props).forEach(([key, val]) =>
prevProps[key] !== val && console.log(`Prop '${key}' changed`)
);
if (this.state) {
Object.entries(this.state).forEach(([key, val]) =>
prevState[key] !== val && console.log(`State '${key}' changed`)
);
}
}
*/
}]);
return LibraryAlbums;
@ -137064,15 +137070,15 @@ var mapStateToProps = function mapStateToProps(state) {
var mopidyLibrarySelector = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_19__["makeLibrarySelector"])('mopidy:library:albums');
var albums = [].concat(_toConsumableArray(source === 'all' || source === 'spotify' ? spotifyLibrarySelector(state) : []), _toConsumableArray(source === 'all' || source === 'google' ? googleLibrarySelector(state) : []), _toConsumableArray(source === 'all' || source === 'local' ? mopidyLibrarySelector(state) : []));
return {
mopidy_uri_schemes: state.mopidy.uri_schemes,
loading: loadingSelector(state),
mopidy_uri_schemes: state.mopidy.uri_schemes,
albums: albums,
google_available: state.mopidy.uri_schemes && state.mopidy.uri_schemes.includes('gmusic:'),
spotify_available: state.spotify.access_token,
view: state.ui.library_albums_view,
source: source,
sort: state.ui.library_albums_sort ? state.ui.library_albums_sort : null,
sort_reverse: state.ui.library_albums_sort_reverse ? state.ui.library_albums_sort_reverse : false
sort: state.ui.library_albums_sort,
sort_reverse: state.ui.library_albums_sort_reverse
};
};
@ -137546,7 +137552,7 @@ var LibraryArtists = /*#__PURE__*/function (_React$Component) {
}(react__WEBPACK_IMPORTED_MODULE_0___default.a.Component);
var mapStateToProps = function mapStateToProps(state) {
var source = state.ui.library_albums_source ? state.ui.library_albums_source : 'all';
var source = state.ui.library_artists_source || 'all';
var loadingSelector = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_18__["makeLoadingSelector"])(['(.*):library:artists']);
var spotifyLibrarySelector = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_18__["makeLibrarySelector"])('spotify:library:artists');
var googleLibrarySelector = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_18__["makeLibrarySelector"])('google:library:artists');
@ -138278,8 +138284,7 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _util_format__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../util/format */ "./src/js/util/format.js");
/* harmony import */ var _util_helpers__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../util/helpers */ "./src/js/util/helpers.js");
/* harmony import */ var _components_Loader__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/Loader */ "./src/js/components/Loader.js");
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
/* harmony import */ var _util_selectors__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../util/selectors */ "./src/js/util/selectors.js");
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@ -138292,6 +138297,8 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@ -138333,6 +138340,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
var LibraryPlaylists = /*#__PURE__*/function (_React$Component) {
@ -138393,19 +138401,17 @@ var LibraryPlaylists = /*#__PURE__*/function (_React$Component) {
_defineProperty(_assertThisInitialized(_this), "renderView", function () {
var _this$props3 = _this.props,
spotify_library = _this$props3.spotify_library,
mopidy_library = _this$props3.mopidy_library,
items = _this$props3.items,
sort = _this$props3.sort,
sort_reverse = _this$props3.sort_reverse,
view = _this$props3.view,
source = _this$props3.source,
load_queue = _this$props3.load_queue;
loading = _this$props3.loading;
var _this$state = _this.state,
filter = _this$state.filter,
limit = _this$state.limit;
var playlists = _this.props.playlists;
if (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_18__["isLoading"])(load_queue, ['(.*):library:playlists'])) {
if (loading) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Loader__WEBPACK_IMPORTED_MODULE_19__["default"], {
body: true,
loading: true,
@ -138414,12 +138420,6 @@ var LibraryPlaylists = /*#__PURE__*/function (_React$Component) {
});
}
var playlists = [].concat(_toConsumableArray(source === 'all' || source === 'spotify' ? Object(_util_format__WEBPACK_IMPORTED_MODULE_17__["collate"])(spotify_library, {
items: items
}).items : []), _toConsumableArray(source === 'all' || source === 'local' ? Object(_util_format__WEBPACK_IMPORTED_MODULE_17__["collate"])(mopidy_library, {
items: items
}).items : []));
if (sort) {
playlists = Object(_util_arrays__WEBPACK_IMPORTED_MODULE_15__["sortItems"])(playlists, sort, sort_reverse);
}
@ -138484,6 +138484,173 @@ var LibraryPlaylists = /*#__PURE__*/function (_React$Component) {
}));
});
_defineProperty(_assertThisInitialized(_this), "render", function () {
var _this$props4 = _this.props,
uiActions = _this$props4.uiActions,
spotify_available = _this$props4.spotify_available,
source = _this$props4.source,
sort = _this$props4.sort,
sort_reverse = _this$props4.sort_reverse,
view = _this$props4.view;
var filter = _this.state.filter;
var source_options = [{
value: 'all',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.all')
}, {
value: 'local',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('services.mopidy.local')
}];
if (spotify_available) {
source_options.push({
value: 'spotify',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('services.spotify.title')
});
}
var view_options = [{
value: 'thumbnails',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.thumbnails')
}, {
value: 'list',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.list')
}];
var sort_options = [{
value: null,
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.as_loaded')
}, {
value: 'name',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.name')
}, {
value: 'last_modified',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.updated')
}, {
value: 'can_edit',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.editable')
}, {
value: 'owner.id',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.owner')
}, {
value: 'tracks_total',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.tracks')
}, {
value: 'source',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.source')
}];
var options = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
"data-qa-node": "span",
"data-qa-file": "LibraryPlaylists"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Fields_FilterField__WEBPACK_IMPORTED_MODULE_8__["default"], {
initialValue: filter,
handleChange: function handleChange(value) {
return _this.setState({
filter: value
});
},
onSubmit: function onSubmit() {
return uiActions.hideContextMenu();
},
"data-qa-node": "FilterField",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Fields_DropdownField__WEBPACK_IMPORTED_MODULE_6__["default"], {
icon: "swap_vert",
name: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.sort'),
value: sort,
valueAsLabel: true,
options: sort_options,
selected_icon: sort ? sort_reverse ? 'keyboard_arrow_up' : 'keyboard_arrow_down' : null,
handleChange: function handleChange(value) {
_this.setSort(value);
uiActions.hideContextMenu();
},
"data-qa-node": "DropdownField",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Fields_DropdownField__WEBPACK_IMPORTED_MODULE_6__["default"], {
icon: "visibility",
name: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.view'),
valueAsLabel: true,
value: view,
options: view_options,
handleChange: function handleChange(value) {
uiActions.set({
library_playlists_view: value
});
uiActions.hideContextMenu();
},
"data-qa-node": "DropdownField",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Fields_DropdownField__WEBPACK_IMPORTED_MODULE_6__["default"], {
icon: "cloud",
name: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.source'),
valueAsLabel: true,
value: source,
options: source_options,
handleChange: function handleChange(value) {
uiActions.set({
library_playlists_source: value
});
uiActions.hideContextMenu();
},
"data-qa-node": "DropdownField",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
to: "/playlist/create",
noHover: true,
discrete: true,
tracking: {
category: 'Playlist',
action: 'Create'
},
"data-qa-node": "Button",
"data-qa-file": "LibraryPlaylists"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Icon__WEBPACK_IMPORTED_MODULE_10__["default"], {
name: "add_box",
"data-qa-node": "Icon",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_locale__WEBPACK_IMPORTED_MODULE_16__["I18n"], {
path: "actions.add",
"data-qa-node": "I18n",
"data-qa-file": "LibraryPlaylists"
})), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
noHover: true,
onClick: _this.onRefresh,
tracking: {
category: 'LibraryAlbums',
action: 'Refresh'
},
"data-qa-node": "Button",
"data-qa-file": "LibraryPlaylists"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Icon__WEBPACK_IMPORTED_MODULE_10__["default"], {
name: "refresh",
"data-qa-node": "Icon",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_locale__WEBPACK_IMPORTED_MODULE_16__["I18n"], {
path: "actions.refresh",
"data-qa-node": "I18n",
"data-qa-file": "LibraryPlaylists"
})));
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: "view library-playlists-view",
"data-qa-node": "div",
"data-qa-file": "LibraryPlaylists"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Header__WEBPACK_IMPORTED_MODULE_7__["default"], {
options: options,
uiActions: uiActions,
"data-qa-node": "Header",
"data-qa-file": "LibraryPlaylists"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Icon__WEBPACK_IMPORTED_MODULE_10__["default"], {
name: "queue_music",
type: "material",
"data-qa-node": "Icon",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_locale__WEBPACK_IMPORTED_MODULE_16__["I18n"], {
path: "library.playlists.title",
"data-qa-node": "I18n",
"data-qa-file": "LibraryPlaylists"
})), _this.renderView());
});
_this.state = {
filter: '',
limit: 50,
@ -138495,13 +138662,13 @@ var LibraryPlaylists = /*#__PURE__*/function (_React$Component) {
_createClass(LibraryPlaylists, [{
key: "componentDidMount",
value: function componentDidMount() {
var _this$props4 = this.props,
_this$props4$location = _this$props4.location;
_this$props4$location = _this$props4$location === void 0 ? {} : _this$props4$location;
var _this$props4$location2 = _this$props4$location.state;
_this$props4$location2 = _this$props4$location2 === void 0 ? {} : _this$props4$location2;
var limit = _this$props4$location2.limit,
setWindowTitle = _this$props4.uiActions.setWindowTitle;
var _this$props5 = this.props,
_this$props5$location = _this$props5.location;
_this$props5$location = _this$props5$location === void 0 ? {} : _this$props5$location;
var _this$props5$location2 = _this$props5$location.state;
_this$props5$location2 = _this$props5$location2 === void 0 ? {} : _this$props5$location2;
var limit = _this$props5$location2.limit,
setWindowTitle = _this$props5.uiActions.setWindowTitle;
if (limit) {
this.setState({
@ -138549,194 +138716,29 @@ var LibraryPlaylists = /*#__PURE__*/function (_React$Component) {
state: state
});
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var source_options = [{
value: 'all',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.all')
}, {
value: 'local',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('services.mopidy.local')
}];
if (this.props.spotify_available) {
source_options.push({
value: 'spotify',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('services.spotify.title')
});
}
var view_options = [{
value: 'thumbnails',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.thumbnails')
}, {
value: 'list',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.list')
}];
var sort_options = [{
value: null,
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.as_loaded')
}, {
value: 'name',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.name')
}, {
value: 'last_modified',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.updated')
}, {
value: 'can_edit',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.editable')
}, {
value: 'owner.id',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.owner')
}, {
value: 'tracks_total',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.tracks')
}, {
value: 'source',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.filters.source')
}];
var options = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
"data-qa-node": "span",
"data-qa-file": "LibraryPlaylists"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Fields_FilterField__WEBPACK_IMPORTED_MODULE_8__["default"], {
initialValue: this.state.filter,
handleChange: function handleChange(value) {
return _this2.setState({
filter: value
});
},
onSubmit: function onSubmit(e) {
return _this2.props.uiActions.hideContextMenu();
},
"data-qa-node": "FilterField",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Fields_DropdownField__WEBPACK_IMPORTED_MODULE_6__["default"], {
icon: "swap_vert",
name: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.sort'),
value: this.props.sort,
valueAsLabel: true,
options: sort_options,
selected_icon: this.props.sort ? this.props.sort_reverse ? 'keyboard_arrow_up' : 'keyboard_arrow_down' : null,
handleChange: function handleChange(value) {
_this2.setSort(value);
_this2.props.uiActions.hideContextMenu();
},
"data-qa-node": "DropdownField",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Fields_DropdownField__WEBPACK_IMPORTED_MODULE_6__["default"], {
icon: "visibility",
name: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.view'),
valueAsLabel: true,
value: this.props.view,
options: view_options,
handleChange: function handleChange(value) {
_this2.props.uiActions.set({
library_playlists_view: value
});
_this2.props.uiActions.hideContextMenu();
},
"data-qa-node": "DropdownField",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Fields_DropdownField__WEBPACK_IMPORTED_MODULE_6__["default"], {
icon: "cloud",
name: Object(_locale__WEBPACK_IMPORTED_MODULE_16__["i18n"])('fields.source'),
valueAsLabel: true,
value: this.props.source,
options: source_options,
handleChange: function handleChange(value) {
_this2.props.uiActions.set({
library_playlists_source: value
});
_this2.props.uiActions.hideContextMenu();
},
"data-qa-node": "DropdownField",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
to: "/playlist/create",
noHover: true,
discrete: true,
tracking: {
category: 'Playlist',
action: 'Create'
},
"data-qa-node": "Button",
"data-qa-file": "LibraryPlaylists"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Icon__WEBPACK_IMPORTED_MODULE_10__["default"], {
name: "add_box",
"data-qa-node": "Icon",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_locale__WEBPACK_IMPORTED_MODULE_16__["I18n"], {
path: "actions.add",
"data-qa-node": "I18n",
"data-qa-file": "LibraryPlaylists"
})), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
noHover: true,
onClick: this.onRefresh,
tracking: {
category: 'LibraryAlbums',
action: 'Refresh'
},
"data-qa-node": "Button",
"data-qa-file": "LibraryPlaylists"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Icon__WEBPACK_IMPORTED_MODULE_10__["default"], {
name: "refresh",
"data-qa-node": "Icon",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_locale__WEBPACK_IMPORTED_MODULE_16__["I18n"], {
path: "actions.refresh",
"data-qa-node": "I18n",
"data-qa-file": "LibraryPlaylists"
})));
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: "view library-playlists-view",
"data-qa-node": "div",
"data-qa-file": "LibraryPlaylists"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Header__WEBPACK_IMPORTED_MODULE_7__["default"], {
options: options,
uiActions: this.props.uiActions,
"data-qa-node": "Header",
"data-qa-file": "LibraryPlaylists"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Icon__WEBPACK_IMPORTED_MODULE_10__["default"], {
name: "queue_music",
type: "material",
"data-qa-node": "Icon",
"data-qa-file": "LibraryPlaylists"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_locale__WEBPACK_IMPORTED_MODULE_16__["I18n"], {
path: "library.playlists.title",
"data-qa-node": "I18n",
"data-qa-file": "LibraryPlaylists"
})), this.renderView());
}
}]);
return LibraryPlaylists;
}(react__WEBPACK_IMPORTED_MODULE_0___default.a.Component);
var mapStateToProps = function mapStateToProps(state) {
var source = state.ui.library_playlists_source || 'all';
var loadingSelector = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_20__["makeLoadingSelector"])(['(.*):library:playlists']);
var spotifyLibrarySelector = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_20__["makeLibrarySelector"])('spotify:library:playlists');
var googleLibrarySelector = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_20__["makeLibrarySelector"])('google:library:playlists');
var mopidyLibrarySelector = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_20__["makeLibrarySelector"])('mopidy:library:playlists');
var playlists = [].concat(_toConsumableArray(source === 'all' || source === 'spotify' ? spotifyLibrarySelector(state) : []), _toConsumableArray(source === 'all' || source === 'google' ? googleLibrarySelector(state) : []), _toConsumableArray(source === 'all' || source === 'local' ? mopidyLibrarySelector(state) : []));
return {
slim_mode: state.ui.slim_mode,
mopidy_uri_schemes: state.mopidy.uri_schemes,
spotify_available: state.spotify.access_token,
items: state.core.items,
mopidy_library: state.core.libraries['mopidy:library:playlists'] || {
items_uris: []
},
spotify_library: state.core.libraries['spotify:library:playlists'] || {
items_uris: []
},
load_queue: state.ui.load_queue,
playlists: playlists,
loading: loadingSelector(state),
source: source,
me_id: state.spotify.me ? state.spotify.me.id : false,
view: state.ui.library_playlists_view,
source: state.ui.library_playlists_source ? state.ui.library_playlists_source : 'all',
sort: state.ui.library_playlists_sort ? state.ui.library_playlists_sort : null,
sort_reverse: state.ui.library_playlists_sort_reverse ? state.ui.library_playlists_sort_reverse : false,
playlists: state.core.playlists
sort_reverse: state.ui.library_playlists_sort_reverse ? state.ui.library_playlists_sort_reverse : false
};
};

2
mopidy_iris/static/app.js.map
View File

File diff suppressed because one or more lines are too long

16
mopidy_iris/static/app.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
mopidy_iris/static/index.html
View File

@ -106,7 +106,7 @@
// Release details
// These are automatically injected to built HTML
var build = "1600883187";
var build = "1600971729";
var version = "3.52.4";
// Construct the script tag