Fixed 'Reverse Sort Order' button not working

.gitignore

@@ -12,4 +12,6 @@ build
 # misc
 .DS_Store
 .env
+.jshintrc
+package-lock.json
 npm-debug.log

src/components/App/index.js

@@ -24,7 +24,7 @@ import StatisticsDialog from 'components/dialogs/StatisticsDialog';
 import AboutDialog from 'components/dialogs/AboutDialog';
 import PromptDialog from 'components/dialogs/PromptDialog';
 
-import 'typeface-roboto'
+import 'typeface-roboto';
 import styles from './styles/index.css';
 
 setLogEnabled(false);

src/components/DrawerMenu/index.js

@@ -8,7 +8,7 @@ import Dropdown from 'react-toolbox/lib/dropdown';
 import { List, ListItem, ListSubHeader, ListDivider } from 'react-toolbox/lib/list';
 import SettingsIcon from 'react-icons/lib/md/settings';
 import FilterToolbar from 'components/toolbars/FilterToolbar';
-import { sortCriteria } from 'stores/torrent-store'
+import { sortCriteria } from 'stores/torrent-store';
 
 import styles from './styles/index.css';
 
@@ -19,10 +19,14 @@ class DrawerMenu extends Component {
     this.props.view_store.selectTorrents([]);
   }
 
-  @autobind onChange(value) {
+  @autobind onChangeSort(value) {
     this.props.prefs_store.setSortCriteria(value);
   }
 
+  @autobind onChangeSortDir(value) {
+    this.props.prefs_store.setSortDirection(value);
+  }
+
   @autobind onChangeSearch(search) {
     this.deselectAllTorrents();
     this.props.torrents_store.setTextFilter(search);
@@ -41,6 +45,7 @@ class DrawerMenu extends Component {
   render() {
     const search = this.props.torrents_store.textFilter;
     const currCriteria = this.props.prefs_store.sortCriteria;
+    const currDir = this.props.prefs_store.sortDirection;
 
     const tracker = this.props.torrents_store.trackerFilter;
     const trackers = this.props.torrents_store.trackers.map((domain) => {
@@ -65,7 +70,15 @@ class DrawerMenu extends Component {
             label='SORT BY'
             source={sortCriteria}
             value={currCriteria}
-            onChange={this.onChange}
+            onChange={this.onChangeSort}
+            theme={{ inputInput: styles.list_item }}
+          />
+          <Dropdown
+            auto
+            label='SORT DIRECTION'
+            source={[{value: 'ascending', label: 'Ascending'}, {value: 'descending', label: 'Descending'}]}
+            value={currDir}
+            onChange={this.onChangeSortDir}
             theme={{ inputInput: styles.list_item }}
           />
           <ListSubHeader caption='Filter by Status' />

src/components/menus/SortByContextMenu/index.js

@@ -14,6 +14,9 @@ class SortByContextMenu extends Component {
   @autobind onSetSortCriteria(sortCriteria) {
     this.props.prefs_store.setSortCriteria(sortCriteria)
   }
+  @autobind onSetSortReverse(sortDirection) {
+    this.props.prefs_store.setSortDirection( (sortDirection==='descending'?'ascending':'descending') )
+  }
 
   render() {
     const { sortCriteria, sortDirection } = this.props.prefs_store;
@@ -37,7 +40,8 @@ class SortByContextMenu extends Component {
         <MenuItem
           selected={true}
           caption='Reverse Sort Order'
-          styleName={sortDirection === 'ascending' ? 'torrentMenuSelected' : 'torrentMenuItem'}
+          onClick={this.onSetSortReverse.bind(this, sortDirection)}
+          styleName={sortDirection === 'descending' ? 'torrentMenuSelected' : 'torrentMenuItem'}
         />
       </Menu>
     );

src/stores/prefs-store.js

@@ -8,7 +8,7 @@ export const PrefCookieKeys = {
   compact: 'compact_display_state',
   skipUpdate: 'skip_update',
   rpcEndpoint: 'rpc_endpoint'
-}
+};
 
 export const FilterStates = [
   {value: -1, label: 'All', persistKey: 'all'},
@@ -33,7 +33,7 @@ class PrefsStore {
     this.rehydrate(init)
   }
 
-  @action rehydrate({ statusFilter = -1, sortCriteria = 'name', sortDirection = '', compact = false, skipUpdate = false, rpcEndpoint = '/transmission/rpc' } = {}) {
+  @action rehydrate({ statusFilter = -1, sortCriteria = 'name', sortDirection = 'ascending', compact = false, skipUpdate = false, rpcEndpoint = '/transmission/rpc' } = {}) {
     this.statusFilter = statusFilter;
     this.sortCriteria = sortCriteria;
     this.sortDirection = sortDirection;

src/stores/util/getFilteredTorrents.js

@@ -3,11 +3,13 @@ import { comparatorsMap, extractDomains } from 'stores/torrent-store';
 export default function getFilteredTorrents (torrentStore, prefsStore) {
   const regexp = new RegExp(torrentStore.textFilter, 'i'); // TODO: Escape!
 
-  return torrentStore.torrents.filter((torrent) => {
+  let sortedTorrents = torrentStore.torrents.filter((torrent) => {
     if (prefsStore.statusFilter !== -1 && prefsStore.statusFilter !== torrent.status) return false;
     if (torrentStore.trackerFilter && !extractDomains(torrent).includes(torrentStore.trackerFilter)) return false;
     if (torrentStore.textFilter && !regexp.test(torrent.name)) return false;
 
     return true;
   }).sort(comparatorsMap[prefsStore.sortCriteria]);
+
+  return ('descending' === prefsStore.sortDirection) ? sortedTorrents.reverse() : sortedTorrents;
 }

src/stores/util/hydrate-prefs-store.js

@@ -6,11 +6,11 @@ export default function () {
   // status filter is saved as a string (i.e. 'all')
   // so we need to make sure to save and read it as so.
   const savedFilter = rehydrateKey(PrefCookieKeys.statusFilter, 'all');
-  
+
   return {
     statusFilter: findByProperty(FilterStates, 'persistKey', savedFilter).value,
     sortCriteria: rehydrateKey(PrefCookieKeys.sortCriteria, 'name'),
-    sortDirection: rehydrateKey(PrefCookieKeys.sortDirection, ''),
+    sortDirection: rehydrateKey(PrefCookieKeys.sortDirection, 'ascending'),
     compact: rehydrateKey(PrefCookieKeys.compact, false),
     skipUpdate: rehydrateKey(PrefCookieKeys.skipUpdate, false),