shouldComponentUpdate to plug time-based rerenders?

This commit is contained in:
James Barnsley
2020-09-20 21:04:40 +12:00
parent 59d73d409d
commit 9a3b9cb1bf
16 changed files with 379 additions and 226 deletions

View File

@ -6676,7 +6676,8 @@ main header {
color: #FFFFFF;
pointer-events: none;
width: 220px;
max-width: 98vw; }
max-width: 98vw;
word-break: break-all; }
.debug-info-section {
padding-top: 14px; }
.debug-info-section:first-child {

File diff suppressed because one or more lines are too long

View File

@ -109439,6 +109439,7 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _LazyLoadListener__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./LazyLoadListener */ "./src/js/components/LazyLoadListener.js");
/* harmony import */ var _locale__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../locale */ "./src/js/locale/index.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./Button */ "./src/js/components/Button.js");
/* harmony import */ var _util_selectors__WEBPACK_IMPORTED_MODULE_14__ = __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."); }
@ -109466,6 +109467,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
var SearchResults = function SearchResults(_ref) {
var type = _ref.type,
query = _ref.query,
@ -109577,29 +109579,10 @@ var SearchResults = function SearchResults(_ref) {
}))));
};
var getResults = function getResults(state, provider, type, query) {
var _state$provider = state[provider];
_state$provider = _state$provider === void 0 ? {} : _state$provider;
var _state$provider$searc = _state$provider.search_results;
_state$provider$searc = _state$provider$searc === void 0 ? {} : _state$provider$searc;
var resultsQuery = _state$provider$searc.query,
results = _state$provider$searc[type];
if (!resultsQuery) return [];
if (resultsQuery.term !== query.term) return [];
if (resultsQuery.type !== query.type) return [];
if (type === 'tracks') {
return results || [];
}
var selectedItems = Object(lodash__WEBPACK_IMPORTED_MODULE_0__["pick"])(state.core.items, results);
return Object.keys(selectedItems).length > 0 ? Object(_util_arrays__WEBPACK_IMPORTED_MODULE_4__["indexToArray"])(selectedItems) : [];
};
var mapStateToProps = function mapStateToProps(state, ownProps) {
return {
uri_schemes_priority: state.ui.uri_schemes_priority || [],
results: [].concat(_toConsumableArray(getResults(state, 'mopidy', ownProps.type, ownProps.query)), _toConsumableArray(getResults(state, 'spotify', ownProps.type, ownProps.query))),
results: [].concat(_toConsumableArray(Object(_util_selectors__WEBPACK_IMPORTED_MODULE_14__["getSearchResults"])(state, 'mopidy', ownProps.type, ownProps.query)), _toConsumableArray(Object(_util_selectors__WEBPACK_IMPORTED_MODULE_14__["getSearchResults"])(state, 'spotify', ownProps.type, ownProps.query))),
sort: state.ui.search_results_sort || 'followers',
sort_reverse: !!state.ui.search_results_sort_reverse
};
@ -115580,7 +115563,6 @@ function reducer() {
var mergedItems = action.items.reduce(function (obj, item) {
return obj[item.uri] = item, obj;
}, {});
console.timeEnd('TIMER');
return _objectSpread(_objectSpread({}, core), {}, {
items: _objectSpread(_objectSpread({}, core.items), mergedItems)
});
@ -116992,9 +116974,9 @@ function getImages(context, uri) {
function loveTrack(uri) {
return function (dispatch, getState) {
if (getState().core.items[uri] !== undefined) {
var track = getState().core.items[uri];
var track = getState().core.items[uri];
if (getState().core.items[uri] !== undefined) {
if (!track.artists) {
dispatch(coreActions.handleException('Could not love LastFM track', track, 'Track has no artists'));
return;
@ -128657,6 +128639,68 @@ var encodeMopidyUri = function encodeMopidyUri(uri) {
/***/ }),
/***/ "./src/js/util/selectors.js":
/*!**********************************!*\
!*** ./src/js/util/selectors.js ***!
\**********************************/
/*! exports provided: getItemFromIndex, getItemsFromIndex, getSearchResults, getLibraryItems, default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getItemFromIndex", function() { return getItemFromIndex; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getItemsFromIndex", function() { return getItemsFromIndex; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getSearchResults", function() { return getSearchResults; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getLibraryItems", function() { return getLibraryItems; });
/* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! lodash */ "./node_modules/lodash/lodash.js");
/* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(lodash__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _arrays__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./arrays */ "./src/js/util/arrays.js");
var getItemFromIndex = function getItemFromIndex(state, uri) {
return state.core.items[uri];
};
var getItemsFromIndex = function getItemsFromIndex(state, uris) {
return Object(_arrays__WEBPACK_IMPORTED_MODULE_1__["indexToArray"])(state.core.items, uris);
};
var getSearchResults = function getSearchResults(state, provider, type, query) {
var _state$provider = state[provider];
_state$provider = _state$provider === void 0 ? {} : _state$provider;
var _state$provider$searc = _state$provider.search_results;
_state$provider$searc = _state$provider$searc === void 0 ? {} : _state$provider$searc;
var resultsQuery = _state$provider$searc.query,
results = _state$provider$searc[type];
if (!resultsQuery) return [];
if (resultsQuery.term !== query.term) return [];
if (resultsQuery.type !== query.type) return [];
if (type === 'tracks') {
return results || [];
}
var selectedItems = Object(lodash__WEBPACK_IMPORTED_MODULE_0__["pick"])(state.core.items, results);
return Object.keys(selectedItems).length > 0 ? Object(_arrays__WEBPACK_IMPORTED_MODULE_1__["indexToArray"])(selectedItems) : [];
};
var getLibraryItems = function getLibraryItems(state, uri) {
var library = state.core.libraries[uri];
if (!library || library.items_uris.length <= 0) return [];
return getItemsFromIndex(state, library.items_uris);
};
/* harmony default export */ __webpack_exports__["default"] = ({
getItemFromIndex: getItemFromIndex,
getItemsFromIndex: getItemsFromIndex,
getSearchResults: getSearchResults,
getLibraryItems: getLibraryItems
});
/***/ }),
/***/ "./src/js/util/storage.js":
/*!********************************!*\
!*** ./src/js/util/storage.js ***!
@ -129265,6 +129309,7 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _locale__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../locale */ "./src/js/locale/index.js");
/* harmony import */ var _components_Button__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../components/Button */ "./src/js/components/Button.js");
/* harmony import */ var _components_Trackable__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ../components/Trackable */ "./src/js/components/Trackable.js");
/* harmony import */ var _util_selectors__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ../util/selectors */ "./src/js/util/selectors.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); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@ -129315,6 +129360,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
var Artist = /*#__PURE__*/function (_React$Component) {
@ -129452,17 +129498,12 @@ var Artist = /*#__PURE__*/function (_React$Component) {
uiActions = _this$props5.uiActions,
load_queue = _this$props5.load_queue,
artist = _this$props5.artist,
items = _this$props5.items,
sort = _this$props5.sort,
sort_reverse = _this$props5.sort_reverse,
filter = _this$props5.filter;
var _collate = Object(_util_format__WEBPACK_IMPORTED_MODULE_22__["collate"])(artist, {
albums: items
}),
tracks = _collate.tracks,
related_artists = _collate.related_artists,
albums = _collate.albums;
var tracks = artist.tracks,
related_artists = artist.related_artists,
albums = artist.albums;
if (sort && albums) {
albums = Object(_util_arrays__WEBPACK_IMPORTED_MODULE_23__["sortItems"])(albums, sort, sort_reverse);
@ -130030,20 +130071,24 @@ var Artist = /*#__PURE__*/function (_React$Component) {
var mapStateToProps = function mapStateToProps(state, ownProps) {
var uri = decodeURIComponent(ownProps.match.params.uri);
var artist = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_27__["getItemFromIndex"])(state, uri);
if (artist && artist.albums_uris) {
artist.albums = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_27__["getItemsFromIndex"])(state, artist.albums_uris);
}
return {
uri: uri,
artist: artist,
theme: state.ui.theme,
slim_mode: state.ui.slim_mode,
load_queue: state.ui.load_queue,
artist: state.core.items[uri] || null,
items: state.core.items,
spotify_library_artists: state.core.libraries['spotify:library:artists'] || {
items_uris: []
},
mopidy_library_artists: state.core.libraries['mopidy:library:artists'] || {
items_uris: []
},
albums: state.core.albums ? state.core.albums : [],
filter: state.ui.artist_albums_filter ? state.ui.artist_albums_filter : null,
sort: state.ui.artist_albums_sort ? state.ui.artist_albums_sort : null,
sort_reverse: !!state.ui.artist_albums_sort_reverse,
@ -131324,12 +131369,12 @@ var Playlist = /*#__PURE__*/function (_React$Component) {
date: Object(_components_Dater__WEBPACK_IMPORTED_MODULE_9__["dater"])('ago', playlist.last_modified_date),
"data-qa-node": "I18n",
"data-qa-file": "Playlist"
})))), _this.renderActions(), Object(_util_helpers__WEBPACK_IMPORTED_MODULE_20__["isLoading"])(load_queue, ["(.*)".concat(playlist_id, "/tracks(.*)")]) ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Loader__WEBPACK_IMPORTED_MODULE_12__["default"], {
})))), _this.renderActions(), (!playlist.tracks || playlist.tracks.length <= 0) && Object(_util_helpers__WEBPACK_IMPORTED_MODULE_20__["isLoading"])(load_queue, ["(.*)".concat(playlist_id, "/tracks(.*)")]) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Loader__WEBPACK_IMPORTED_MODULE_12__["default"], {
body: true,
loading: true,
"data-qa-node": "Loader",
"data-qa-file": "Playlist"
}) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("section", {
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("section", {
className: "list-wrapper",
"data-qa-node": "section",
"data-qa-file": "Playlist"
@ -131398,7 +131443,7 @@ var mapStateToProps = function mapStateToProps(state, ownProps) {
slim_mode: slim_mode,
theme: theme,
load_queue: load_queue,
playlist: items[uri] || null,
playlist: items[uri],
spotify_library_playlists: spotify_library_playlists,
local_library_playlists: local_library_playlists,
spotify_authorized: spotify_authorized,
@ -132025,12 +132070,14 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _services_mopidy_actions__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../services/mopidy/actions */ "./src/js/services/mopidy/actions.js");
/* harmony import */ var _locale__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../locale */ "./src/js/locale/index.js");
/* harmony import */ var _components_Button__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../components/Button */ "./src/js/components/Button.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_arrays__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../util/arrays */ "./src/js/util/arrays.js");
/* harmony import */ var _util_selectors__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../util/selectors */ "./src/js/util/selectors.js");
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
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); } }
@ -132066,6 +132113,8 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
var QueueHistory = /*#__PURE__*/function (_React$Component) {
_inherits(QueueHistory, _React$Component);
@ -132082,9 +132131,14 @@ var QueueHistory = /*#__PURE__*/function (_React$Component) {
_this = _super.call.apply(_super, [this].concat(args));
_defineProperty(_assertThisInitialized(_this), "shouldComponentUpdate", function (_ref) {
var nextTracks = _ref.tracks;
var tracks = _this.props.tracks;
return nextTracks.length !== tracks.length;
});
_defineProperty(_assertThisInitialized(_this), "loadHistory", function () {
var getQueueHistory = _this.props.mopidyActions.getQueueHistory;
console.log('get queue history');
getQueueHistory();
});
@ -132095,8 +132149,7 @@ var QueueHistory = /*#__PURE__*/function (_React$Component) {
_defineProperty(_assertThisInitialized(_this), "render", function () {
var _this$props = _this.props,
queue_history = _this$props.queue_history,
items = _this$props.items,
tracks = _this$props.tracks,
uiActions = _this$props.uiActions;
var options = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Button__WEBPACK_IMPORTED_MODULE_11__["default"], {
onClick: _this.onBack,
@ -132116,10 +132169,6 @@ var QueueHistory = /*#__PURE__*/function (_React$Component) {
"data-qa-node": "Icon",
"data-qa-file": "QueueHistory"
}), ' '));
if (!queue_history) return null;
var tracks = queue_history.map(function (item) {
return _objectSpread(_objectSpread({}, item), items[item.uri] || {});
});
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: "view queue-history-view",
"data-qa-node": "div",
@ -132138,7 +132187,7 @@ var QueueHistory = /*#__PURE__*/function (_React$Component) {
type: "material",
"data-qa-node": "Icon",
"data-qa-file": "QueueHistory"
}))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("section", {
}))), tracks && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("section", {
className: "content-wrapper",
"data-qa-node": "section",
"data-qa-file": "QueueHistory"
@ -132169,9 +132218,14 @@ var QueueHistory = /*#__PURE__*/function (_React$Component) {
}(react__WEBPACK_IMPORTED_MODULE_0___default.a.Component);
var mapStateToProps = function mapStateToProps(state) {
var queue_history = state.mopidy.queue_history;
var uris = Object(_util_arrays__WEBPACK_IMPORTED_MODULE_12__["arrayOf"])('uri', queue_history);
var storedTracks = Object(_util_selectors__WEBPACK_IMPORTED_MODULE_13__["getItemsFromIndex"])(state, uris);
var tracks = queue_history.map(function (item) {
return _objectSpread(_objectSpread({}, item), storedTracks[item.uri] || {});
});
return {
items: state.core.items,
queue_history: state.mopidy.queue_history
tracks: tracks
};
};
@ -132797,8 +132851,9 @@ var Settings = /*#__PURE__*/function (_React$Component) {
_defineProperty(_assertThisInitialized(_this), "resetAllSettings", function () {
localforage__WEBPACK_IMPORTED_MODULE_4___default.a.clear(function () {
console.debug('Cleared settings, reloading...'); //window.location = '#';
//window.location.reload(true);
console.debug('Cleared settings, reloading...');
window.location = '#';
window.location.reload(true);
});
return false;
});
@ -133815,6 +133870,7 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _util_helpers__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../util/helpers */ "./src/js/util/helpers.js");
/* harmony import */ var _locale__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../locale */ "./src/js/locale/index.js");
/* harmony import */ var _components_Button__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../components/Button */ "./src/js/components/Button.js");
/* harmony import */ var _util_selectors__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../util/selectors */ "./src/js/util/selectors.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); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@ -133861,6 +133917,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
var Track = /*#__PURE__*/function (_React$Component) {
@ -133900,7 +133957,7 @@ var Track = /*#__PURE__*/function (_React$Component) {
} // We have just received our full track or our track artists
if (!prevTrack && track || !prevTrack.artists && track.artists) {
if (!prevTrack && track || prevTrack && !prevTrack.artists && track.artists) {
_this.setWindowTitle(track);
if (lastfm_authorized) getTrack(track.uri);
@ -134315,7 +134372,7 @@ var mapStateToProps = function mapStateToProps(state, ownProps) {
uri: uri,
slim_mode: state.ui.slim_mode,
load_queue: state.ui.load_queue,
track: state.core.items && state.core.items[uri] !== undefined ? state.core.items[uri] : false,
track: Object(_util_selectors__WEBPACK_IMPORTED_MODULE_23__["getItemFromIndex"])(state, uri),
spotify_library_albums: state.spotify.library_albums,
local_library_albums: state.mopidy.library_albums,
lastfm_authorized: state.lastfm.authorization,
@ -136390,8 +136447,7 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _locale__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../locale */ "./src/js/locale/index.js");
/* harmony import */ var _util_helpers__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../util/helpers */ "./src/js/util/helpers.js");
/* harmony import */ var _components_Loader__WEBPACK_IMPORTED_MODULE_20__ = __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_21__ = __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."); }
@ -136404,6 +136460,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 ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
@ -136450,6 +136508,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
@ -136477,6 +136536,33 @@ 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();
@ -136490,9 +136576,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$props = _this.props,
source = _this$props.source,
loadLibrary = _this$props.coreActions.loadLibrary;
var _this$props2 = _this.props,
source = _this$props2.source,
loadLibrary = _this$props2.coreActions.loadLibrary;
if (source !== 'local' && source !== 'all') return;
loadLibrary('mopidy:library:albums', {
forceRefetch: forceRefetch
@ -136501,10 +136587,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$props2 = _this.props,
source = _this$props2.source,
google_available = _this$props2.google_available,
loadLibrary = _this$props2.coreActions.loadLibrary;
var _this$props3 = _this.props,
source = _this$props3.source,
google_available = _this$props3.google_available,
loadLibrary = _this$props3.coreActions.loadLibrary;
if (!google_available) return;
if (source !== 'google' && source !== 'all') return;
loadLibrary('google:library:albums', {
@ -136514,10 +136600,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$props3 = _this.props,
source = _this$props3.source,
spotify_available = _this$props3.spotify_available,
loadLibrary = _this$props3.coreActions.loadLibrary;
var _this$props4 = _this.props,
source = _this$props4.source,
spotify_available = _this$props4.spotify_available,
loadLibrary = _this$props4.coreActions.loadLibrary;
if (!spotify_available) return;
if (source !== 'spotify' && source !== 'all') return;
loadLibrary('spotify:library:albums', {
@ -136536,12 +136622,12 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
});
_defineProperty(_assertThisInitialized(_this), "loadMore", function () {
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 _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 new_limit = limit + per_page;
_this.setState({
@ -136556,10 +136642,10 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
});
_defineProperty(_assertThisInitialized(_this), "setSort", function (value) {
var _this$props5 = _this.props,
sort = _this$props5.sort,
sort_reverse = _this$props5.sort_reverse,
set = _this$props5.uiActions.set;
var _this$props6 = _this.props,
sort = _this$props6.sort,
sort_reverse = _this$props6.sort_reverse,
set = _this$props6.uiActions.set;
var reverse = false;
if (sort === value) reverse = !sort_reverse;
set({
@ -136569,19 +136655,15 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
});
_defineProperty(_assertThisInitialized(_this), "renderView", function () {
var _this$props6 = _this.props,
spotify_library = _this$props6.spotify_library,
google_library = _this$props6.google_library,
mopidy_library = _this$props6.mopidy_library,
items = _this$props6.items,
source = _this$props6.source,
sort = _this$props6.sort,
sort_reverse = _this$props6.sort_reverse,
view = _this$props6.view,
load_queue = _this$props6.load_queue;
var _this$state2 = _this.state,
limit = _this$state2.limit,
filter = _this$state2.filter;
var _this$props7 = _this.props,
sort = _this$props7.sort,
sort_reverse = _this$props7.sort_reverse,
view = _this$props7.view,
load_queue = _this$props7.load_queue;
var _this$state3 = _this.state,
limit = _this$state3.limit,
filter = _this$state3.filter;
var albums = _this.props.albums;
if (Object(_util_helpers__WEBPACK_IMPORTED_MODULE_19__["isLoading"])(load_queue, ['(.*):library:albums'])) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Loader__WEBPACK_IMPORTED_MODULE_20__["default"], {
@ -136592,14 +136674,6 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
});
}
var albums = [].concat(_toConsumableArray(source === 'all' || source === 'spotify' ? Object(_util_format__WEBPACK_IMPORTED_MODULE_16__["collate"])(spotify_library, {
items: items
}).items : []), _toConsumableArray(source === 'all' || source === 'google' ? Object(_util_format__WEBPACK_IMPORTED_MODULE_16__["collate"])(google_library, {
items: items
}).items : []), _toConsumableArray(source === 'all' || source === 'local' ? Object(_util_format__WEBPACK_IMPORTED_MODULE_16__["collate"])(mopidy_library, {
items: items
}).items : []));
if (sort) {
albums = Object(_util_arrays__WEBPACK_IMPORTED_MODULE_15__["sortItems"])(albums, sort, sort_reverse);
}
@ -136659,17 +136733,18 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
});
_defineProperty(_assertThisInitialized(_this), "render", function () {
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 _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;
console.log('RENDER');
var source_options = [{
value: 'all',
label: Object(_locale__WEBPACK_IMPORTED_MODULE_18__["i18n"])('fields.filters.all')
@ -136827,10 +136902,10 @@ var LibraryAlbums = /*#__PURE__*/function (_React$Component) {
_createClass(LibraryAlbums, [{
key: "componentDidMount",
value: function componentDidMount() {
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
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
if (state.limit) {
this.setState({
@ -136849,23 +136924,16 @@ var LibraryAlbums = /*#__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 albums = [].concat(_toConsumableArray(source === 'all' || source === 'spotify' ? Object(_util_selectors__WEBPACK_IMPORTED_MODULE_21__["getLibraryItems"])(state, 'spotify:library:albums') : []), _toConsumableArray(source === 'all' || source === 'google' ? Object(_util_selectors__WEBPACK_IMPORTED_MODULE_21__["getLibraryItems"])(state, 'google:library:albums') : []), _toConsumableArray(source === 'all' || source === 'local' ? Object(_util_selectors__WEBPACK_IMPORTED_MODULE_21__["getLibraryItems"])(state, 'mopidy:library:albums') : []));
return {
mopidy_uri_schemes: state.mopidy.uri_schemes,
load_queue: state.ui.load_queue,
items: state.core.items,
mopidy_library: state.core.libraries['mopidy:library:albums'] || {
items_uris: []
},
spotify_library: state.core.libraries['spotify:library:albums'] || {
items_uris: []
},
google_library: state.core.libraries['google:library:albums'] || {
items_uris: []
},
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: state.ui.library_albums_source ? state.ui.library_albums_source : 'all',
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
};

File diff suppressed because one or more lines are too long

View File

@ -12,6 +12,7 @@ import TrackList from './TrackList';
import LazyLoadListener from './LazyLoadListener';
import { I18n } from '../locale';
import Button from './Button';
import { getSearchResults } from '../util/selectors';
const SearchResults = ({
type,
@ -92,33 +93,11 @@ const SearchResults = ({
);
};
const getResults = (state, provider, type, query) => {
const {
[provider]: {
search_results: {
query: resultsQuery,
[type]: results,
} = {},
} = {},
} = state;
if (!resultsQuery) return [];
if (resultsQuery.term !== query.term) return [];
if (resultsQuery.type !== query.type) return [];
if (type === 'tracks') {
return results || [];
}
const selectedItems = pick(state.core.items, results);
return Object.keys(selectedItems).length > 0 ? indexToArray(selectedItems) : [];
};
const mapStateToProps = (state, ownProps) => ({
uri_schemes_priority: state.ui.uri_schemes_priority || [],
results: [
...getResults(state, 'mopidy', ownProps.type, ownProps.query),
...getResults(state, 'spotify', ownProps.type, ownProps.query),
...getSearchResults(state, 'mopidy', ownProps.type, ownProps.query),
...getSearchResults(state, 'spotify', ownProps.type, ownProps.query),
],
sort: state.ui.search_results_sort || 'followers',
sort_reverse: !!state.ui.search_results_sort_reverse,

View File

@ -80,7 +80,6 @@ export default function reducer(core = {}, action) {
(obj, item) => (obj[item.uri] = item, obj),
{},
);
console.timeEnd('TIMER');
return {
...core,
items: {

View File

@ -355,8 +355,8 @@ export function getImages(context, uri) {
export function loveTrack(uri) {
return (dispatch, getState) => {
const track = getState().core.items[uri];
if (getState().core.items[uri] !== undefined) {
var track = getState().core.items[uri];
if (!track.artists) {
dispatch(coreActions.handleException(
'Could not love LastFM track',

View File

@ -1,11 +1,13 @@
import * as arrays from './arrays';
import * as helpers from './helpers';
import * as selectors from './selectors';
import * as storage from './storage';
import * as format from './format';
export {
arrays,
helpers,
selectors,
storage,
format,
};
@ -13,6 +15,7 @@ export {
export default {
arrays,
helpers,
selectors,
storage,
format,
};

48
src/js/util/selectors.js Executable file
View File

@ -0,0 +1,48 @@
import { pick } from 'lodash';
import { indexToArray } from './arrays';
const getItemFromIndex = (state, uri) => state.core.items[uri];
const getItemsFromIndex = (state, uris) => indexToArray(state.core.items, uris);
const getSearchResults = (state, provider, type, query) => {
const {
[provider]: {
search_results: {
query: resultsQuery,
[type]: results,
} = {},
} = {},
} = state;
if (!resultsQuery) return [];
if (resultsQuery.term !== query.term) return [];
if (resultsQuery.type !== query.type) return [];
if (type === 'tracks') {
return results || [];
}
const selectedItems = pick(state.core.items, results);
return Object.keys(selectedItems).length > 0 ? indexToArray(selectedItems) : [];
};
const getLibraryItems = (state, uri) => {
const library = state.core.libraries[uri];
if (!library || library.items_uris.length <= 0) return [];
return getItemsFromIndex(state, library.items_uris);
}
export {
getItemFromIndex,
getItemsFromIndex,
getSearchResults,
getLibraryItems,
};
export default {
getItemFromIndex,
getItemsFromIndex,
getSearchResults,
getLibraryItems,
};

View File

@ -32,6 +32,7 @@ import { sortItems, applyFilter, arrayOf } from '../util/arrays';
import { i18n, I18n } from '../locale';
import Button from '../components/Button';
import { trackEvent } from '../components/Trackable';
import { getItemFromIndex, getItemsFromIndex } from '../util/selectors';
class Artist extends React.Component {
componentDidMount() {
@ -154,7 +155,6 @@ class Artist extends React.Component {
uiActions,
load_queue,
artist,
items,
sort,
sort_reverse,
filter,
@ -163,7 +163,7 @@ class Artist extends React.Component {
tracks,
related_artists,
albums,
} = collate(artist, { albums: items });
} = artist;
if (sort && albums) {
albums = sortItems(albums, sort, sort_reverse);
@ -527,16 +527,18 @@ class Artist extends React.Component {
const mapStateToProps = (state, ownProps) => {
const uri = decodeURIComponent(ownProps.match.params.uri);
const artist = getItemFromIndex(state, uri);
if (artist && artist.albums_uris) {
artist.albums = getItemsFromIndex(state, artist.albums_uris);
}
return {
uri,
artist,
theme: state.ui.theme,
slim_mode: state.ui.slim_mode,
load_queue: state.ui.load_queue,
artist: (state.core.items[uri] || null),
items: state.core.items,
spotify_library_artists: state.core.libraries['spotify:library:artists'] || { items_uris: [] },
mopidy_library_artists: state.core.libraries['mopidy:library:artists'] || { items_uris: [] },
albums: (state.core.albums ? state.core.albums : []),
filter: (state.ui.artist_albums_filter ? state.ui.artist_albums_filter : null),
sort: (state.ui.artist_albums_sort ? state.ui.artist_albums_sort : null),
sort_reverse: (!!state.ui.artist_albums_sort_reverse),

View File

@ -349,20 +349,23 @@ class Playlist extends React.Component {
{this.renderActions()}
{isLoading(load_queue, [`(.*)${playlist_id}/tracks(.*)`]) ? (
<Loader body loading />
) : (
<section className="list-wrapper">
<TrackList
uri={playlist.uri}
className="playlist-track-list"
track_context={context}
tracks={playlist.tracks}
removeTracks={this.removeTracks}
reorderTracks={this.reorderTracks}
/>
</section>
)}
{
(!playlist.tracks || playlist.tracks.length <= 0)
&& isLoading(load_queue, [`(.*)${playlist_id}/tracks(.*)`])
&& (
<Loader body loading />
)
}
<section className="list-wrapper">
<TrackList
uri={playlist.uri}
className="playlist-track-list"
track_context={context}
tracks={playlist.tracks}
removeTracks={this.removeTracks}
reorderTracks={this.reorderTracks}
/>
</section>
</div>
);
}
@ -397,7 +400,7 @@ const mapStateToProps = (state, ownProps) => {
slim_mode,
theme,
load_queue,
playlist: items[uri] || null,
playlist: items[uri],
spotify_library_playlists,
local_library_playlists,
spotify_authorized,

View File

@ -11,6 +11,8 @@ import * as spotifyActions from '../services/spotify/actions';
import * as mopidyActions from '../services/mopidy/actions';
import { i18n, I18n } from '../locale';
import Button from '../components/Button';
import { arrayOf } from '../util/arrays';
import { getItemsFromIndex } from '../util/selectors';
class QueueHistory extends React.Component {
componentDidMount() {
@ -19,6 +21,12 @@ class QueueHistory extends React.Component {
this.loadHistory();
}
shouldComponentUpdate = ({ tracks: nextTracks }) => {
const { tracks } = this.props;
return nextTracks.length !== tracks.length;
}
loadHistory = () => {
const {
mopidyActions: {
@ -26,8 +34,6 @@ class QueueHistory extends React.Component {
},
} = this.props;
console.log('get queue history');
getQueueHistory();
}
@ -38,8 +44,7 @@ class QueueHistory extends React.Component {
render = () => {
const {
queue_history,
items,
tracks,
uiActions,
} = this.props;
@ -56,13 +61,6 @@ class QueueHistory extends React.Component {
</Button>
);
if (!queue_history) return null;
const tracks = queue_history.map((item) => ({
...item,
...(items[item.uri] || {}),
}));
return (
<div className="view queue-history-view">
<Header options={options} uiActions={uiActions}>
@ -70,25 +68,41 @@ class QueueHistory extends React.Component {
<Icon name="play_arrow" type="material" />
</I18n>
</Header>
<section className="content-wrapper">
<TrackList
uri="iris:queue-history"
className="queue-history-track-list"
track_context="history"
tracks={tracks}
show_source_icon
/>
</section>
{tracks && (
<section className="content-wrapper">
<TrackList
uri="iris:queue-history"
className="queue-history-track-list"
track_context="history"
tracks={tracks}
show_source_icon
/>
</section>
)}
</div>
);
}
}
const mapStateToProps = (state) => ({
items: state.core.items,
queue_history: state.mopidy.queue_history,
});
const mapStateToProps = (state) => {
const {
mopidy: {
queue_history,
},
} = state;
const uris = arrayOf('uri', queue_history);
const storedTracks = getItemsFromIndex(state, uris);
const tracks = queue_history.map((item) => ({
...item,
...(storedTracks[item.uri] || {}),
}));
return {
tracks,
};
};
const mapDispatchToProps = (dispatch) => ({
uiActions: bindActionCreators(uiActions, dispatch),

View File

@ -73,8 +73,8 @@ class Settings extends React.Component {
resetAllSettings = () => {
localForage.clear(() => {
console.debug('Cleared settings, reloading...');
//window.location = '#';
//window.location.reload(true);
window.location = '#';
window.location.reload(true);
});
return false;
}

View File

@ -28,6 +28,7 @@ import {
} from '../util/helpers';
import { i18n, I18n } from '../locale';
import Button from '../components/Button';
import { getItemFromIndex } from '../util/selectors';
class Track extends React.Component {
componentDidMount() {
@ -81,7 +82,7 @@ class Track extends React.Component {
}
// We have just received our full track or our track artists
if ((!prevTrack && track) || (!prevTrack.artists && track.artists)) {
if ((!prevTrack && track) || (prevTrack && !prevTrack.artists && track.artists)) {
this.setWindowTitle(track);
if (lastfm_authorized) getTrack(track.uri);
if (genius_authorized && !track.lyrics_results) findTrackLyrics(track);
@ -354,7 +355,7 @@ const mapStateToProps = (state, ownProps) => {
uri,
slim_mode: state.ui.slim_mode,
load_queue: state.ui.load_queue,
track: (state.core.items && state.core.items[uri] !== undefined ? state.core.items[uri] : false),
track: getItemFromIndex(state, uri),
spotify_library_albums: state.spotify.library_albums,
local_library_albums: state.mopidy.library_albums,
lastfm_authorized: state.lastfm.authorization,

View File

@ -20,6 +20,7 @@ import Button from '../../components/Button';
import { i18n, I18n } from '../../locale';
import { isLoading } from '../../util/helpers';
import Loader from '../../components/Loader';
import { getLibraryItems } from '../../util/selectors';
class LibraryAlbums extends React.Component {
constructor(props) {
@ -65,6 +66,40 @@ class LibraryAlbums extends React.Component {
}
}
shouldComponentUpdate = ({
albums: prevAlbums,
sort: prevSort,
sort_reverse: prevSortReverse,
source: prevSource,
view: prevView,
},
{
filter: prevFilter,
limit: prevLimit,
}) => {
const {
albums,
sort,
sort_reverse,
source,
view,
} = this.props;
const {
filter,
limit,
} = this.state;
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;
}
onRefresh = () => {
const { uiActions: { hideContextMenu } } = this.props;
@ -169,11 +204,6 @@ class LibraryAlbums extends React.Component {
renderView = () => {
const {
spotify_library,
google_library,
mopidy_library,
items,
source,
sort,
sort_reverse,
view,
@ -183,17 +213,12 @@ class LibraryAlbums extends React.Component {
limit,
filter,
} = this.state;
let { albums } = this.props;
if (isLoading(load_queue, ['(.*):library:albums'])) {
return <Loader body loading />;
}
let albums = [
...(source === 'all' || source === 'spotify' ? collate(spotify_library, { items }).items : []),
...(source === 'all' || source === 'google' ? collate(google_library, { items }).items : []),
...(source === 'all' || source === 'local' ? collate(mopidy_library, { items }).items : []),
];
if (sort) {
albums = sortItems(albums, sort, sort_reverse);
}
@ -256,6 +281,8 @@ class LibraryAlbums extends React.Component {
per_page,
} = this.state;
console.log('RENDER')
const source_options = [
{
value: 'all',
@ -374,20 +401,27 @@ class LibraryAlbums extends React.Component {
}
}
const mapStateToProps = (state) => ({
mopidy_uri_schemes: state.mopidy.uri_schemes,
load_queue: state.ui.load_queue,
items: state.core.items,
mopidy_library: state.core.libraries['mopidy:library:albums'] || { items_uris: [] },
spotify_library: state.core.libraries['spotify:library:albums'] || { items_uris: [] },
google_library: state.core.libraries['google:library:albums'] || { items_uris: [] },
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: (state.ui.library_albums_source ? state.ui.library_albums_source : 'all'),
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),
});
const mapStateToProps = (state) => {
const source = state.ui.library_albums_source ? state.ui.library_albums_source : 'all';
const albums = [
...(source === 'all' || source === 'spotify' ? getLibraryItems(state, 'spotify:library:albums') : []),
...(source === 'all' || source === 'google' ? getLibraryItems(state, 'google:library:albums') : []),
...(source === 'all' || source === 'local' ? getLibraryItems(state, 'mopidy:library:albums') : []),
];
return {
mopidy_uri_schemes: state.mopidy.uri_schemes,
load_queue: state.ui.load_queue,
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,
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),
};
};
const mapDispatchToProps = (dispatch) => ({
coreActions: bindActionCreators(coreActions, dispatch),

View File

@ -12,6 +12,7 @@
pointer-events: none;
width: 220px;
max-width: 98vw;
word-break: break-all;
&-section {
padding-top: 14px;