From 86f0377d92036d0d26a6bfeaaf01d76f45663b27 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Gr=C3=A9goire=20Delattre?= <gregoire.delattre@gmail.com>
Date: Sat, 3 Jun 2017 15:40:58 +0200
Subject: [PATCH] Refactor the SubtitlesButton component

---
 src/public/js/components/buttons/subtitles.js | 78 ++++---------------
 src/public/js/components/movies/list.js       |  3 +-
 src/public/js/components/shows/details.js     | 23 +++---
 3 files changed, 30 insertions(+), 74 deletions(-)

diff --git a/src/public/js/components/buttons/subtitles.js b/src/public/js/components/buttons/subtitles.js
index 951eae0..a0c585d 100644
--- a/src/public/js/components/buttons/subtitles.js
+++ b/src/public/js/components/buttons/subtitles.js
@@ -17,71 +17,25 @@ export default class SubtitlesButton extends React.PureComponent {
     this.props.refreshSubtitles(this.props.type, this.props.resourceID, this.props.season, this.props.episode);
   }
   render() {
-    // If there is no URL, the resource is not in polochon, we won't be able to download subtitles
-    if (this.props.url === "") {
-      return null;
-    }
-
-    // Build the button
-    const entries = buildMenuItems(this.props.subtitles);
-    let btnSize = "small";
-    if (this.props.xs) {
-      btnSize = "xsmall";
-    }
-
+    const btnSize = this.props.xs ? "xsmall" : "small";
+    const subtitles = this.props.subtitles;
+    const hasSubtitles = (subtitles !== undefined && subtitles !== null);
     return (
       <DropdownButton bsStyle="success" bsSize={btnSize} title="Subtitles" id="download-subtitles-button" dropup>
-        {entries.map(function(e, index) {
-          switch (e.type) {
-            case "action":
-              return (
-                <MenuItem key={index} onClick={(event) => this.handleClick(event, e.url)}>
-                  <RefreshIndicator refresh={this.props.fetching} />
-                </MenuItem>
-              );
-            case "divider":
-              return (
-                <MenuItem key={index} divider></MenuItem>
-              );
-            case "entry":
-              return (
-                <MenuItem key={index} href={e.url}>
-                  <i className="fa fa-download"></i>     {e.lang}
-                </MenuItem>
-              );
-          }
-        }, this)}
+        <MenuItem onClick={(ev) => this.handleClick(ev)}>
+          <RefreshIndicator refresh={this.props.fetching} />
+        </MenuItem>
+        {hasSubtitles &&
+            <MenuItem divider></MenuItem>
+        }
+        {hasSubtitles && subtitles.toIndexedSeq().map(function(subtitle, index) {
+          return (
+            <MenuItem key={index} href={subtitle.get("url")}>
+              <i className="fa fa-download"></i> &nbsp;{subtitle.get("language").split("_")[1]}
+            </MenuItem>
+          );
+        })}
       </DropdownButton>
     );
   }
 }
-
-function buildMenuItems(subtitles) {
-  // Build the array of entries
-  let entries = [];
-
-  // Push the refresh button
-  entries.push({
-    type: "action",
-    value: "Refresh",
-  });
-
-  // If there is no subtitles, stop here
-  if (subtitles == undefined) {
-    return entries;
-  }
-
-  // Push the divider
-  entries.push({ type: "divider" });
-  // Push the subtitles
-  for (let sub of subtitles) {
-    entries.push({
-      type: "entry",
-      // Take only the last part of fr_FR
-      lang: sub.get("language").split("_")[1],
-      url: sub.get("url"),
-    });
-  }
-
-  return entries;
-}
diff --git a/src/public/js/components/movies/list.js b/src/public/js/components/movies/list.js
index c4cfb1b..d9ef0c2 100644
--- a/src/public/js/components/movies/list.js
+++ b/src/public/js/components/movies/list.js
@@ -57,14 +57,15 @@ function MovieButtons(props) {
       subtitles={props.movie.get("subtitles")}
     />
 
+  {props.movie.get("polochon_url") !== null &&
     <SubtitlesButton
       fetching={props.movie.get("fetchingSubtitles")}
-      url={props.movie.get("polochon_url")}
       subtitles={props.movie.get("subtitles")}
       refreshSubtitles={props.refreshSubtitles}
       resourceID={props.movie.get("imdb_id")}
       type="movie"
     />
+  }
 
     <ImdbButton imdbId={props.movie.get("imdb_id")} size="sm"/>
   </div>
diff --git a/src/public/js/components/shows/details.js b/src/public/js/components/shows/details.js
index 0618fed..e2133b7 100644
--- a/src/public/js/components/shows/details.js
+++ b/src/public/js/components/shows/details.js
@@ -187,16 +187,17 @@ function Episode(props) {
         {props.data.get("title")}
 
         <span className="pull-right episode-buttons">
-          <SubtitlesButton
-            url={props.data.get("polochon_url")}
-            subtitles={props.data.get("subtitles")}
-            refreshSubtitles={props.refreshSubtitles}
-            resourceID={props.data.get("show_imdb_id")}
-            season={props.data.get("season")}
-            episode={props.data.get("episode")}
-            type="episode"
-            xs
-          />
+          {props.data.get("polochon_url") !== "" &&
+              <SubtitlesButton
+                subtitles={props.data.get("subtitles")}
+                refreshSubtitles={props.refreshSubtitles}
+                resourceID={props.data.get("show_imdb_id")}
+                season={props.data.get("season")}
+                episode={props.data.get("episode")}
+                type="episode"
+                xs
+              />
+          }
           {props.data.get("torrents") && props.data.get("torrents").toList().map(function(torrent) {
             let key = `${props.data.get("season")}-${props.data.get("episode")}-${torrent.get("source")}-${torrent.get("quality")}`;
             return (
@@ -220,7 +221,7 @@ function Episode(props) {
       </td>
     </tr>
   )
-}
+          }
 
 class Torrent extends React.PureComponent {
   constructor(props) {