Sort update

[brandonhenry]

Used current structure (sortBar) to add sorting by song name, author name, BPM, and difficulty. This is only supported for local songs as such sorting by other factors such as PP, upvotes, etc are not included. Can also sort ascending/descending.

[StarGazer1258]

A couple of observations:

1. Sorting by BPM is slightly confusing, as this is not displayed in the list. If you can find a good place to put it in the list item, that would be fine.

2. Difficulty sorting seems either broken or very confusing. I'm not sure how this sort is supposed to work when songs have multiple difficulty levels available.

Also, implementing some arrows next to the sort criteria might make the UI look a little better. See sorting in the mod list and ModListView.js for examples. This is merely a suggestion. If you think that would be awkward, then you can leave it as it is.

BeatDrop/src/components/ModsListView.js

Lines 62 to 67 in 760853f

	<th onClick={ () => { this.setState({ sortBy: 'name', sortDirection: this.state.sortBy === 'name' ? !this.state.sortDirection : 0 }) } }><span>Mod Name{ this.state.sortBy === 'name' ? this.state.sortDirection ? '▼' : '▲' : null }</span></th>
	<th width={ 80 } onClick={ () => { this.setState({ sortBy: 'version', sortDirection: this.state.sortBy === 'version' ? !this.state.sortDirection : 0 }) } }><span>Version{ this.state.sortBy === 'version' ? this.state.sortDirection ? '▼' : '▲' : null }</span></th>
	<th width={ 80 } onClick={ () => { this.setState({ sortBy: 'gameVersion', sortDirection: this.state.sortBy === 'gameVersion' ? !this.state.sortDirection : 0 }) } }><span>Game V.{ this.state.sortBy === 'gameVersion' ? this.state.sortDirection ? '▼' : '▲' : null }</span></th>
	<th onClick={ () => { this.setState({ sortBy: 'author', sortDirection: this.state.sortBy === 'author' ? !this.state.sortDirection : 0 }) } }><span>Author{ this.state.sortBy === 'author' ? this.state.sortDirection ? '▼' : '▲' : null }</span></th>
	<th onClick={ () => { this.setState({ sortBy: 'category', sortDirection: this.state.sortBy === 'category' ? !this.state.sortDirection : 0 }) } }><span>Category{ this.state.sortBy === 'category' ? this.state.sortDirection ? '▼' : '▲' : null }</span></th>
	<th onClick={ () => { this.setState({ sortBy: 'uploadDate', sortDirection: this.state.sortBy === 'uploadDate' ? !this.state.sortDirection : 0 }) } }><span>Upload Date{ this.state.sortBy === 'uploadDate' ? this.state.sortDirection ? '▼' : '▲' : null }</span></th>

[hound]

Selector should have depth of applicability no greater than 2, but was 3

[zxsdklfhskyrvk]

@brandonhenry Any chance you could continue on this? I think many are interested in sorting and filtering, but it seems like your request has stalled. Maybe re-doing the pull request from a fresh repo would avoid the conflicts?

[StarGazer1258]

This has stalled because there is little that can be done. True sorting/filtering on BeatSaver song cannot be done locally, it must be done by the server. Unless BeatSaver implements these functions, there is nothing to be done unfortunately.