Fix directly loading a torrent detail page

src/index.js

@@ -12,27 +12,23 @@ import { filter_subscribe } from './actions/filter_subscribe';
 
 import Nav from './ui/navigation';
 import Main from './ui/main';
+import Connection from './ui/connection';
+
+const root = document.getElementById('root');
+ReactDOM.render(<Connection />, root);
 
 ws_init(() => {
   store.dispatch(filter_subscribe());
   store.dispatch(filter_subscribe('server'));
-});
-
-const render = App => ReactDOM.render(
-  <Provider store={store}>
-    <ConnectedRouter history={history}>
-      <div>
-        <Nav />
-        <div className="container">
-          <App />
+  ReactDOM.render(
+    <Provider store={store}>
+      <ConnectedRouter history={history}>
+        <div>
+          <Nav />
+          <div className="container">
+            <Main />
+          </div>
         </div>
-      </div>
-    </ConnectedRouter>
-  </Provider>,
-  document.getElementById('root'));
-
-render(Main);
-
-if (module.hot) {
-  module.hot.accept('./ui/main', () => render(Main));
-}
+      </ConnectedRouter>
+    </Provider>, root);
+});

src/ui/connection.js

@@ -0,0 +1,9 @@
+import React, { Component } from 'react';
+
+export default class Connection extends Component {
+  render() {
+    return (
+      <p>Connecting...</p>
+    );
+  }
+}

src/ui/torrent_details.js

@@ -13,9 +13,8 @@ import {
   Progress
 } from 'reactstrap';
 import ws_send from '../socket';
+import selectTorrent, { UNION } from '../actions/selection';
 
-// TODO: use component lifecycle functions here to invoke
-// torrent_state.updateSubscriptions
 // TODO: fix navigating directly to torrent pages
 
 function File({ file }) {
@@ -152,6 +151,13 @@ class TorrentDetails extends Component {
     };
   }
 
+  componentDidMount() {
+    const { dispatch } = this.props;
+    const { ids } = this.props.match.params;
+    const _ids = ids.split(",");
+    _ids.forEach(id => dispatch(selectTorrent(id, UNION)));
+  }
+
   renderHeader(selection) {
     return (
       <div>
@@ -197,5 +203,6 @@ export default connect(state => ({
   router: state.router,
   torrents: state.torrents,
   files: state.files,
-  selection: state.selection
+  selection: state.selection,
+  server: state.server
 }))(TorrentDetails);