Handle the torrent state in the torrent page

frontend/js/components/details/genres.js

@@ -1,15 +1,15 @@
 import React from "react";
 import PropTypes from "prop-types";
 
+import { upperCaseFirst } from "../../utils";
+
 export const Genres = ({ genres = [] }) => {
   if (!genres || genres.length === 0) {
     return null;
   }
 
   // Uppercase first genres
-  const prettyGenres = genres
+  const prettyGenres = genres.map((w) => upperCaseFirst(w)).join(", ");
-    .map((word) => word[0].toUpperCase() + word.substr(1))
-    .join(", ");
 
   return (
     <span>

frontend/js/components/list/explorerOptions.js

@@ -3,6 +3,8 @@ import PropTypes from "prop-types";
 import { withRouter } from "react-router-dom";
 import { Form, FormGroup, FormControl, FormLabel } from "react-bootstrap";
 
+import { upperCaseFirst } from "../../utils";
+
 const ExplorerOptions = ({
   display,
   params,
@@ -45,7 +47,7 @@ const ExplorerOptions = ({
     return name
       .replace("_", " ")
       .split(" ")
-      .map((w) => w[0].toUpperCase() + w.substr(1))
+      .map((w) => upperCaseFirst(w))
       .join(" ");
   };
 

frontend/js/components/modules/modules.js

@@ -2,6 +2,8 @@ import React from "react";
 import Loader from "../loader/loader";
 import PropTypes from "prop-types";
 
+import { upperCaseFirst } from "../../utils";
+
 // TODO: udpate this
 import { OverlayTrigger, Tooltip } from "react-bootstrap";
 
@@ -24,13 +26,11 @@ Modules.propTypes = {
 };
 export default Modules;
 
-const capitalize = (string) => string.charAt(0).toUpperCase() + string.slice(1);
-
 const ModulesByVideoType = ({ type, modules }) => (
   <div className="col-12 col-md-6">
     <div className="card mb-3">
       <div className="card-header">
-        <h3>{`${capitalize(type)} modules`}</h3>
+        <h3>{`${upperCaseFirst(type)} modules`}</h3>
       </div>
       <div className="card-body">
         {Object.keys(modules).map((moduleType, i) => (
@@ -47,7 +47,7 @@ ModulesByVideoType.propTypes = {
 
 const ModuleByType = ({ type, modules }) => (
   <div>
-    <h4>{capitalize(type)}</h4>
+    <h4>{upperCaseFirst(type)}</h4>
     <table className="table">
       <tbody>
         {modules.map((module, type) => {

frontend/js/components/torrents/list/progress.js

@@ -1,13 +1,16 @@
 import React from "react";
 import PropTypes from "prop-types";
 
-import { prettySize } from "../../../utils";
+import { prettySize, upperCaseFirst } from "../../../utils";
 
 export const Progress = ({ torrent }) => {
-  var progressStyle = torrent.status.is_finished
+  const downloading = torrent.status.state === "downloading";
-    ? "success"
+  let progressBarClass = torrent.status.is_finished
-    : "info progress-bar-striped progress-bar-animated";
+    ? "progress-bar bg-success"
-  const progressBarClass = "progress-bar bg-" + progressStyle;
+    : "progress-bar bg-info";
+  if (torrent.status.state === "downloading") {
+    progressBarClass += " progress-bar-striped progress-bar-animated";
+  }
 
   var percentDone = torrent.status.percent_done;
   const started = percentDone !== 0;
@@ -16,11 +19,8 @@ export const Progress = ({ torrent }) => {
   }
 
   // Pretty sizes
+  const downloadedSize = prettySize(torrent.status.downloaded_size);
   const totalSize = prettySize(torrent.status.total_size);
-  const downloadedSize =
-    torrent.status.downloaded_size >= torrent.status.total_size
-      ? totalSize
-      : prettySize(torrent.status.downloaded_size);
   const downloadRate = prettySize(torrent.status.download_rate) + "/s";
   return (
     <div>
@@ -34,14 +34,14 @@ export const Progress = ({ torrent }) => {
           aria-valuemax="100"
         ></div>
       </div>
-      {started && (
+      {downloading && (
         <p>
           {downloadedSize} / {totalSize} - {percentDone} - {downloadRate}
         </p>
       )}
-      {!started && (
+      {!downloading && (
-        <p>
+        <p className="text-muted">
-          <small>Not yet started</small>
+          <small>{upperCaseFirst(torrent.status.state)}</small>
         </p>
       )}
     </div>

frontend/js/reducers/torrents.js

@@ -48,10 +48,10 @@ export default (state = defaultState, action) =>
 
       case "TORRENTS_FETCH_FULFILLED":
         draft.fetching = false;
-        if (action.payload.response.data) {
+        draft.torrents = formatTorrents(action.payload.response.data);
-          draft.torrents = formatTorrents(action.payload.response.data);
+        draft.count = action.payload.response.data
-          draft.count = action.payload.response.data.length;
+          ? action.payload.response.data.length
-        }
+          : 0;
         break;
 
       case "TORRENTS_SEARCH_PENDING":

frontend/js/utils.js

@@ -28,9 +28,9 @@ export const prettySize = (fileSizeInBytes) => {
   var i = -1;
   var byteUnits = [" kB", " MB", " GB", " TB", "PB", "EB", "ZB", "YB"];
   do {
-    fileSizeInBytes = fileSizeInBytes / 1024;
+    fileSizeInBytes = fileSizeInBytes / 1000;
     i++;
-  } while (fileSizeInBytes > 1024);
+  } while (fileSizeInBytes > 1000);
 
   return Math.max(fileSizeInBytes, 0.1).toFixed(1) + byteUnits[i];
 };
@@ -55,3 +55,6 @@ export const formatTorrents = (input) => {
 
   return torrentMap;
 };
+
+export const upperCaseFirst = (string) =>
+  string.charAt(0).toUpperCase() + string.slice(1);

go.mod

@@ -15,8 +15,8 @@ require (
 	github.com/mattn/go-sqlite3 v1.10.0 // indirect
 	github.com/nfnt/resize v0.0.0-20180221191011-83c6a9932646
 	github.com/odwrtw/errors v0.0.0-20170604160533-c747b9d17833
-	github.com/odwrtw/papi v0.0.0-20200413153625-62744e1c1b73
+	github.com/odwrtw/papi v0.0.0-20200416090004-26e95d2feb66
-	github.com/odwrtw/polochon v0.0.0-20200413153516-6d6ff1d17684
+	github.com/odwrtw/polochon v0.0.0-20200416085801-6331a40936bf
 	github.com/phyber/negroni-gzip v0.0.0-20180113114010-ef6356a5d029
 	github.com/pioz/tvdb v0.0.0-20190503215423-f45c687faba9 // indirect
 	github.com/robfig/cron v1.1.0

go.sum

@@ -134,12 +134,10 @@ github.com/odwrtw/guessit v0.0.0-20200131084001-f88613483547/go.mod h1:W22g7wtc0
 github.com/odwrtw/imdb-watchlist v0.0.0-20190417175016-b7a9f7503d69 h1:ow6b/4Jj7J5iYwU678/rbijvaNUJrYkg13j9Nivkung=
 github.com/odwrtw/imdb-watchlist v0.0.0-20190417175016-b7a9f7503d69/go.mod h1:o2tLH95CtNdqhDb0aS2NbU+1I4PmaNsODpr33Ry0JC0=
 github.com/odwrtw/papi v0.0.0-20190413103029-bd5bfea85ae6/go.mod h1:CXotdtODLpW0/yuFV5XH8Rmrj0eAfPLvdMKykPM2WCk=
-github.com/odwrtw/papi v0.0.0-20200410143325-49e6f827259d/go.mod h1:eY0skvVHJBwbSJ18uq2c1T4SvhdEV8R0XFSb0zKh5Yo=
+github.com/odwrtw/papi v0.0.0-20200416090004-26e95d2feb66 h1:E+UrY1WG5xp65UXs2rbtVVD4FdSffMR9E0lbd7xdf80=
-github.com/odwrtw/papi v0.0.0-20200413153625-62744e1c1b73 h1:19mh4fw/WGFtYg/7oHg1Y5rU9ZRxD3LqrtwY2NI6l6w=
+github.com/odwrtw/papi v0.0.0-20200416090004-26e95d2feb66/go.mod h1:eY0skvVHJBwbSJ18uq2c1T4SvhdEV8R0XFSb0zKh5Yo=
-github.com/odwrtw/papi v0.0.0-20200413153625-62744e1c1b73/go.mod h1:eY0skvVHJBwbSJ18uq2c1T4SvhdEV8R0XFSb0zKh5Yo=
+github.com/odwrtw/polochon v0.0.0-20200416085801-6331a40936bf h1:zzsX9o1Gxe1esokjdcOMa5hMC2aqubWXQoAEqMCMyyY=
-github.com/odwrtw/polochon v0.0.0-20200410143337-006e3fb9fb55/go.mod h1:sAYf/A5tDmins2GHZn2mEFarmYltAZv+bcmSKSxDUaI=
+github.com/odwrtw/polochon v0.0.0-20200416085801-6331a40936bf/go.mod h1:rBjekia21ToZoTxJqR/5Ued8EYwKTtamq+bo/XINOjA=
-github.com/odwrtw/polochon v0.0.0-20200413153516-6d6ff1d17684 h1:b9JDu8423NGXOYN0gtoiVrLKbZ/CfAyc2ouCRuE+mI8=
-github.com/odwrtw/polochon v0.0.0-20200413153516-6d6ff1d17684/go.mod h1:rBjekia21ToZoTxJqR/5Ued8EYwKTtamq+bo/XINOjA=
 github.com/odwrtw/tpb v0.0.0-20200130133144-c846aa382c6f h1:fwEIGT+o3e8+XkBqrwsE3/+9ketTQXflPhCkv3/w990=
 github.com/odwrtw/tpb v0.0.0-20200130133144-c846aa382c6f/go.mod h1:updLvMbQo2xHoz94MX9+GqmSoKhf6E8fs/J+wLvvu6A=
 github.com/odwrtw/trakttv v0.0.0-20200404161731-0d594827e4f9 h1:PuQLHO75MXUsJpf9BcTVxvR/FCkdn1MZnZt6h3o6cJI=