diff --git a/src/js/views/library/LibraryAlbums.js b/src/js/views/library/LibraryAlbums.js index d43a50d2..e92dea42 100755 --- a/src/js/views/library/LibraryAlbums.js +++ b/src/js/views/library/LibraryAlbums.js @@ -13,6 +13,7 @@ import ArtistSentence from '../../components/ArtistSentence' import DropdownField from '../../components/DropdownField' import LazyLoadListener from '../../components/LazyLoadListener' +import * as helpers from '../../helpers' import * as uiActions from '../../services/ui/actions' import * as mopidyActions from '../../services/mopidy/actions' import * as spotifyActions from '../../services/spotify/actions' @@ -32,6 +33,17 @@ class LibraryAlbums extends React.Component{ this.props.spotifyActions.getURL( this.props.library_albums_more, 'SPOTIFY_LIBRARY_ALBUMS_LOADED' ); } + setSort(value){ + var reverse = false + if( this.props.sort == value ) reverse = !this.props.sort_reverse + + var data = { + library_albums_sort_reverse: reverse, + library_albums_sort: value + } + this.props.uiActions.set(data) + } + renderView(albums){ if (!albums || albums.length <= 0) return null @@ -110,6 +122,10 @@ class LibraryAlbums extends React.Component{ albums.push(this.props.albums[uri]) } } + + if( this.props.sort ){ + albums = helpers.sortItems(albums, this.props.sort, this.props.sort_reverse) + } } var view_options = [ @@ -127,8 +143,30 @@ class LibraryAlbums extends React.Component{ } ] + var sort_options = [ + { + value: 'name', + label: 'Name' + }, + { + value: 'added_at', + label: 'Added' + }, + { + value: 'release_date', + label: 'Released' + }, + { + value: 'tracks_total', + label: 'Tracks' + } + ] + var actions = ( - this.props.uiActions.set({ library_albums_view: value }) } /> + + this.setSort(value) } /> + this.props.uiActions.set({ library_albums_view: value }) } /> + ) return ( @@ -152,6 +190,8 @@ const mapStateToProps = (state, ownProps) => { return { view: state.ui.library_albums_view, albums: state.ui.albums, + sort: state.ui.library_albums_sort, + sort_reverse: state.ui.library_albums_sort_reverse, library_albums: state.ui.library_albums, library_albums_more: state.ui.library_albums_more, } diff --git a/src/js/views/library/LibraryArtists.js b/src/js/views/library/LibraryArtists.js index 9fa69475..369ae6f9 100755 --- a/src/js/views/library/LibraryArtists.js +++ b/src/js/views/library/LibraryArtists.js @@ -10,6 +10,7 @@ import ArtistGrid from '../../components/ArtistGrid' import List from '../../components/List' import DropdownField from '../../components/DropdownField' +import * as helpers from '../../helpers' import * as uiActions from '../../services/ui/actions' import * as mopidyActions from '../../services/mopidy/actions' import * as spotifyActions from '../../services/spotify/actions' @@ -29,11 +30,22 @@ class LibraryArtists extends React.Component{ this.props.spotifyActions.getURL( this.props.library_artists_more, 'SPOTIFY_LIBRARY_ARTISTS_LOADED' ); } + setSort(value){ + var reverse = false + if( this.props.sort == value ) reverse = !this.props.sort_reverse + + var data = { + library_artists_sort_reverse: reverse, + library_artists_sort: value + } + this.props.uiActions.set(data) + } + renderView(artists){ if( this.props.view == 'list' ){ var columns = [ { - width: 30, + width: 60, label: 'Name', name: 'name' }, @@ -67,6 +79,10 @@ class LibraryArtists extends React.Component{ artists.push(this.props.artists[uri]) } } + + if( this.props.sort ){ + artists = helpers.sortItems(artists, this.props.sort, this.props.sort_reverse) + } } var view_options = [ @@ -80,8 +96,22 @@ class LibraryArtists extends React.Component{ } ] + var sort_options = [ + { + value: 'name', + label: 'Name' + }, + { + value: 'followers.total', + label: 'Followers' + } + ] + var actions = ( - this.props.uiActions.set({ library_artists_view: value }) } /> + + this.setSort(value) } /> + this.props.uiActions.set({ library_artists_view: value }) } /> + ) return ( @@ -104,6 +134,8 @@ class LibraryArtists extends React.Component{ const mapStateToProps = (state, ownProps) => { return { artists: state.ui.artists, + sort: state.ui.library_artists_sort, + sort_reverse: state.ui.library_artists_sort_reverse, library_artists: state.ui.library_artists, library_artists_more: state.ui.library_artists_more, view: state.ui.library_artists_view