Extend UI shims and fix updates again

scss/main.scss

@@ -36,3 +36,15 @@
   background-repeat: no-repeat;
   background-position: bottom;
 }
+
+.navbar {
+  input[type="text"] {
+    margin-top: 7px;
+    margin-left: 1rem;
+    padding: 0 0.5rem;
+  }
+
+  .navbar-brand {
+    margin-top: -11px;
+  }
+}

src/reducers/torrents.js

@@ -9,7 +9,7 @@ export default function torrents(state = {}, action) {
           .filter(r => r.type === "torrent")
           .reduce((s, r) => ({
             ...s,
-            [r.id]: { ...s[r.id], ...r }
+            [r.id]: { ...state[r.id], ...r }
           }), {})
       };
   }

src/ui/navigation.js

@@ -5,6 +5,11 @@ export default function render(props) {
     <span className="navbar-brand">receptor</span>
     <div className="navbar-collapse collapse">
       <ul className="navbar-nav mr-auto">
+        <li className="nav-item">
+          <a className="nav-link" href="#">add torrent</a>
+        </li>
+        <li className="nav-item" style={{minWidth: "1rem"}}>
+        </li>
         <li className="nav-item">
           <a className="nav-link" href="#">all</a>
         </li>
@@ -14,6 +19,13 @@ export default function render(props) {
         <li className="nav-item">
           <a className="nav-link" href="#">seeding</a>
         </li>
+        <form className="form-inline">
+          <input
+            className="form-control mr-sm-2"
+            type="text"
+            placeholder="Search"
+            aria-label="Search" />
+        </form>
       </ul>
     </div>
   </nav>;

src/ui/torrent_table.js

@@ -8,6 +8,7 @@ class TorrentTable extends Component {
       <table className="table">
         <thead>
           <tr>
+            <th style={{width: "1px"}}></th>
             <th>name</th>
             <th>up</th>
             <th>down</th>
@@ -17,11 +18,14 @@ class TorrentTable extends Component {
           {Object.values(torrents).map(t =>
             <tr
               key={t.id}
-              className={`torrent ${"seeding" || t.status}`}
+              className={`torrent ${t.status}`}
               style={{
                 backgroundSize: `${t.progress * 100}% 3px`
               }}
             >
+              <td>
+                <input type="checkbox" />
+              </td>
               <td>
                 <a href="#">
                   {t.name}