Introduce uiSettings DB

client/source/scripts/components/modals/AddTorrents.js

@@ -2,8 +2,10 @@ import _ from 'lodash';
 import classnames from 'classnames';
 import React from 'react';
 
+import EventTypes from '../../constants/EventTypes';
 import TextboxRepeater from '../forms/TextboxRepeater';
 import TorrentActions from '../../actions/TorrentActions';
+import UIStore from '../../stores/UIStore';
 
 const METHODS_TO_BIND = [
   'getContent',
@@ -11,7 +13,8 @@ const METHODS_TO_BIND = [
   'handleUrlAdd',
   'handleUrlChange',
   'handleUrlRemove',
-  'handleAddTorrents'
+  'handleAddTorrents',
+  'onLatestTorrentLocationChange'
 ];
 
 export default class AddTorrents extends React.Component {
@@ -29,6 +32,23 @@ export default class AddTorrents extends React.Component {
     });
   }
 
+  componentWillMount() {
+    this.setState({destination: UIStore.getLatestTorrentLocation()});
+  }
+
+  componentDidMount() {
+    UIStore.listen(EventTypes.UI_LATEST_TORRENT_LOCATION_CHANGE, this.onLatestTorrentLocationChange);
+  }
+
+  componentWillUnmount() {
+    UIStore.unlisten(EventTypes.UI_LATEST_TORRENT_LOCATION_CHANGE, this.onLatestTorrentLocationChange);
+    UIStore.fetchLatestTorrentLocation();
+  }
+
+  onLatestTorrentLocationChange() {
+    this.setState({destination: UIStore.getLatestTorrentLocation()});
+  }
+
   getContent() {
     return (
       <div className="modal__content" onClick={this.handleMenuWrapperClick}>

client/source/scripts/components/sidebar/SpeedLimitDropdown.js

@@ -1,12 +1,12 @@
 import React from 'react';
 
 import ClientActions from '../../actions/ClientActions';
-import ClientDataStore from '../../stores/ClientDataStore';
 import Dropdown from '../forms/Dropdown';
 import EventTypes from '../../constants/EventTypes';
 import format from '../../util/formatData';
 import Limits from '../icons/Limits';
 import SidebarItem from '../sidebar/SidebarItem';
+import TransferDataStore from '../../stores/TransferDataStore';
 
 const METHODS_TO_BIND = ['onTransferDataRequestSuccess'];
 const SPEEDS = [1024, 10240, 102400, 512000, 1048576, 2097152, 5242880, 10485760, 0];
@@ -25,15 +25,15 @@ class Sidebar extends React.Component {
   }
 
   componentDidMount() {
-    ClientDataStore.listen(
+    TransferDataStore.listen(
       EventTypes.CLIENT_TRANSFER_DATA_REQUEST_SUCCESS,
       this.onTransferDataRequestSuccess
     );
-    ClientDataStore.fetchTransferData();
+    TransferDataStore.fetchTransferData();
   }
 
   componentWillUnmount() {
-    ClientDataStore.unlisten(
+    TransferDataStore.unlisten(
       EventTypes.CLIENT_TRANSFER_DATA_REQUEST_SUCCESS,
       this.onTransferDataRequestSuccess
     );
@@ -41,7 +41,7 @@ class Sidebar extends React.Component {
 
   onTransferDataRequestSuccess() {
     this.setState({
-      throttle: ClientDataStore.getThrottles({latest: true})
+      throttle: TransferDataStore.getThrottles({latest: true})
     });
   }
 

client/source/scripts/components/sidebar/TransferData.js

@@ -1,16 +1,18 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 
-import ClientDataStore from '../../stores/ClientDataStore';
 import Download from '../icons/Download';
 import EventTypes from '../../constants/EventTypes';
 import format from '../../util/formatData';
 import LineChart from '../ui/LineChart';
+import LoadingIndicator from '../ui/LoadingIndicator';
+import TransferDataStore from '../../stores/TransferDataStore';
 import Upload from '../icons/Upload';
 
 const METHODS_TO_BIND = [
   'onTransferDataRequestError',
-  'onTransferDataRequestSuccess'
+  'onTransferDataRequestSuccess',
+  'onTransferHistoryRequestSuccess'
 ];
 
 class ClientStats extends React.Component {
@@ -19,6 +21,7 @@ class ClientStats extends React.Component {
 
     this.state = {
       sidebarWidth: 0,
+      transferHistoryRequestSuccess: false,
       transferDataRequestError: false,
       transferDataRequestSuccess: false
     };
@@ -32,20 +35,25 @@ class ClientStats extends React.Component {
     this.setState({
       sidebarWidth: ReactDOM.findDOMNode(this).offsetWidth
     });
-    ClientDataStore.listen(
-      EventTypes.CLIENT_TRANSFER_DATA_REQUEST_SUCCESS,
-      this.onTransferDataRequestSuccess
-    );
-    ClientDataStore.fetchTransferData();
+    TransferDataStore.listen(EventTypes.CLIENT_TRANSFER_DATA_REQUEST_SUCCESS,
+      this.onTransferDataRequestSuccess);
+    TransferDataStore.listen(EventTypes.CLIENT_TRANSFER_HISTORY_REQUEST_SUCCESS,
+      this.onTransferHistoryRequestSuccess);
+    TransferDataStore.fetchTransferData();
   }
 
   componentWillUnmount() {
-    ClientDataStore.unlisten(
+    TransferDataStore.unlisten(
       EventTypes.CLIENT_TRANSFER_DATA_REQUEST_SUCCESS,
       this.onTransferDataRequestSuccess
     );
   }
 
+  isLoading() {
+    return !this.state.transferHistoryRequestSuccess ||
+      !this.state.transferDataRequestSuccess;
+  }
+
   onTransferDataRequestError() {
     this.setState({
       transferDataRequestError: true,
@@ -60,17 +68,25 @@ class ClientStats extends React.Component {
     });
   }
 
+  onTransferHistoryRequestSuccess() {
+    if (!this.state.transferHistoryRequestSuccess) {
+      this.setState({
+        transferHistoryRequestSuccess: true
+      });
+    }
+  }
+
   render() {
     if (this.state.transferDataRequestError) {
       return <div>Error</div>;
-    } else if (!this.state.transferDataRequestSuccess) {
-      return <div>Loading</div>;
+    } else if (this.isLoading()) {
+      return <LoadingIndicator />;
     }
 
-    let throttles = ClientDataStore.getThrottles();
-    let transferRate = ClientDataStore.getTransferRate();
-    let transferRates = ClientDataStore.getTransferRates();
-    let transferTotals = ClientDataStore.getTransferTotals();
+    let throttles = TransferDataStore.getThrottles();
+    let transferRate = TransferDataStore.getTransferRate();
+    let transferRates = TransferDataStore.getTransferRates();
+    let transferTotals = TransferDataStore.getTransferTotals();
 
     let downloadRate = format.data(transferRate.download, '/s');
     let downloadTotal = format.data(transferTotals.download);

client/source/scripts/components/torrent-list/ActionBar.js

@@ -34,6 +34,7 @@ export default class ActionBar extends React.Component {
   }
 
   componentDidMount() {
+    TorrentFilterStore.fetchSortProps();
     TorrentFilterStore.listen(EventTypes.UI_TORRENTS_SORT_CHANGE, this.onSortChange);
   }
 

client/source/scripts/components/ui/LineChart.js

@@ -41,16 +41,18 @@ export default class LineChart extends React.Component {
         })
       ]);
 
-    let lineFunc = d3
-      .svg
-      .line()
-      .x(function(dataPoint, index) {
-        return xRange(index);
-      })
-      .y(function(dataPoint) {
-        return yRange(dataPoint);
-      })
-      .interpolate('basis');
+    let lineFunc = function (interpolation) {
+      return d3
+        .svg
+        .line()
+        .x(function(dataPoint, index) {
+          return xRange(index);
+        })
+        .y(function(dataPoint) {
+          return yRange(dataPoint);
+        })
+        .interpolate(interpolation);
+    }
 
     let areaFunc = d3
       .svg
@@ -64,8 +66,8 @@ export default class LineChart extends React.Component {
       })
       .interpolate('basis');
 
-    let transferDataLinePoints = lineFunc(transferData);
-    let transferLimitLinePoints = lineFunc(transferLimit);
+    let transferDataLinePoints = lineFunc('basis')(transferData);
+    let transferLimitLinePoints = lineFunc('step-after')(transferLimit);
     let transferDataAreaPoints = areaFunc(transferData);
 
     graph