Lazy loading keys; Spotify new releases in Spotify reducer, handling duplicates bug

This commit is contained in:
James Barnsley
2018-09-03 14:22:27 +12:00
parent 3344cf5db4
commit 93be7e096b
11 changed files with 14015 additions and 10771 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -98,7 +98,7 @@
// Release details
// These are automatically injected to built HTML
var build = "1535848770";
var build = "1535919926";
var version = "3.25.1";
// Construct the script tag

View File

@ -7,7 +7,7 @@ export default class LazyLoadListener extends React.Component{
constructor(props){
super(props);
this.state = {
listening: false,
listening: (this.props.loadKey ? true : false),
loadKey: this.props.loadKey
}
@ -23,7 +23,7 @@ export default class LazyLoadListener extends React.Component{
}
componentWillReceiveProps(nextProps){
if (nextProps.loadKey !== this.state.loadKey){
if (nextProps.loadKey && nextProps.loadKey !== this.state.loadKey){
this.setState({
loadKey: nextProps.loadKey,
listening: true

View File

@ -158,27 +158,6 @@ export default function reducer(core = {}, action){
return Object.assign({}, core, { users: users });
case 'NEW_RELEASES_LOADED':
if (!action.uris){
return Object.assign({}, core, {
new_releases: null,
new_releases_more: null,
new_releases_total: null
});
}
var new_releases = [];
if (core.new_releases){
new_releases = Object.assign([], core.new_releases);
}
return Object.assign({}, core, {
new_releases: [...new_releases, ...action.uris],
new_releases_more: action.more,
new_releases_total: action.total
});
case 'ARTIST_ALBUMS_LOADED':
var artists = Object.assign({}, core.artists)
var albums_uris = [];

View File

@ -106,12 +106,14 @@ const SpotifyMiddleware = (function(){
type: 'ALBUMS_LOADED',
albums: action.data.albums.items
});
store.dispatch({
type: 'NEW_RELEASES_LOADED',
uris: helpers.arrayOf('uri',action.data.albums.items),
more: action.data.albums.next,
total: action.data.albums.total
});
// Collate result into the three key values we want
action.uris = helpers.arrayOf('uri', action.data.albums.items);
action.more = action.data.albums.next;
action.total = action.data.albums.total;
// And pass on to our reducer
next(action);
break
case 'SPOTIFY_ARTIST_ALBUMS_LOADED':

View File

@ -68,17 +68,17 @@ export default function reducer(spotify = {}, action){
case 'SPOTIFY_FEATURED_PLAYLISTS_LOADED':
return Object.assign({}, spotify, { featured_playlists: action.data })
case 'SPOTIFY_NEW_RELEASES_LOADED':
return Object.assign({}, spotify, { new_releases: action.data });
case 'SPOTIFY_NEW_RELEASES_LOADED_MORE':
console.log([ ...spotify.new_releases.items, ...action.data.albums.items]);
return Object.assign({}, spotify, { new_releases: {
href: action.data.albums.href,
next: action.data.albums.next,
previous: action.data.albums.previous,
items: [ ...spotify.new_releases.items, ...action.data.albums.items]
}});
case 'SPOTIFY_NEW_RELEASES_LOADED':
var new_releases = [];
if (spotify.new_releases){
new_releases = Object.assign([], spotify.new_releases);
}
return Object.assign({}, spotify, {
new_releases: helpers.removeDuplicates([...new_releases, ...action.uris]),
new_releases_more: action.more,
new_releases_total: action.total
});
case 'SPOTIFY_DISCOVER_LOADED':
if (!action.data ){

View File

@ -32,17 +32,11 @@ class DiscoverNewReleases extends React.Component{
}
loadMore(){
// TODO: Figure out how to check for duplicated requests
// perhaps we catch this at Spotify actions, by checking for
// pending requests on the same URL, and invalidate the Promise?
this.props.spotifyActions.getMore(
this.props.new_releases_more,
null,
{
type: 'SPOTIFY_NEW_RELEASES_LOADED',
key: null
type: 'SPOTIFY_NEW_RELEASES_LOADED'
}
);
}
@ -111,12 +105,11 @@ class DiscoverNewReleases extends React.Component{
)
}
var albums = []
var albums = [];
if (this.props.new_releases){
for (var i = 0; i < this.props.new_releases.length; i++){
var uri = this.props.new_releases[i]
for (var uri of this.props.new_releases){
if (this.props.albums.hasOwnProperty(uri)){
albums.push(this.props.albums[uri])
albums.push(this.props.albums[uri]);
}
}
}
@ -166,9 +159,9 @@ const mapStateToProps = (state, ownProps) => {
load_queue: state.ui.load_queue,
artists: state.core.artists,
albums: state.core.albums,
new_releases: state.core.new_releases,
new_releases_more: state.core.new_releases_more,
new_releases_total: state.core.new_releases_total
new_releases: state.spotify.new_releases,
new_releases_more: state.spotify.new_releases_more,
new_releases_total: state.spotify.new_releases_total
}
}

View File

@ -184,7 +184,7 @@ class LibraryAlbums extends React.Component{
className="album-list"
link_prefix={global.baseURL+"album/"} />
<LazyLoadListener
loadKey={total_albums}
loadKey={this.state.limit}
showLoader={this.state.limit < total_albums}
loadMore={() => this.setState({limit: this.state.limit + this.state.per_page})}
/>
@ -197,7 +197,7 @@ class LibraryAlbums extends React.Component{
handleContextMenu={(e,item) => this.handleContextMenu(e,item)}
albums={albums} />
<LazyLoadListener
loadKey={total_albums}
loadKey={this.state.limit}
showLoader={this.state.limit < total_albums}
loadMore={() => this.setState({limit: this.state.limit + this.state.per_page})}
/>

View File

@ -160,7 +160,7 @@ class LibraryArtists extends React.Component{
className="artist-list"
link_prefix={global.baseURL+"artist/"} />
<LazyLoadListener
loadKey={total_artists}
loadKey={this.state.limit}
showLoader={this.state.limit < total_artists}
loadMore={() => this.loadMore()}
/>
@ -173,7 +173,7 @@ class LibraryArtists extends React.Component{
handleContextMenu={(e,item) => this.handleContextMenu(e,item)}
artists={artists} />
<LazyLoadListener
loadKey={total_artists}
loadKey={this.state.limit}
showLoader={this.state.limit < total_artists}
loadMore={() => this.loadMore()}
/>

View File

@ -156,7 +156,7 @@ class LibraryPlaylists extends React.Component{
className="playlist-list"
link_prefix={global.baseURL+"playlist/"} />
<LazyLoadListener
loadKey="playlists"
loadKey={this.state.limit}
loading={this.state.limit < total_playlists}
loadMore={() => this.setState({limit: this.state.limit + this.state.per_page})}
/>
@ -169,7 +169,7 @@ class LibraryPlaylists extends React.Component{
handleContextMenu={(e,item) => this.handleContextMenu(e,item)}
playlists={playlists} />
<LazyLoadListener
loadKey="playlists"
loadKey={this.state.limit}
loading={this.state.limit < total_playlists}
loadMore={() => this.setState({limit: this.state.limit + this.state.per_page})}
/>