Hide active subscriptions (#918)

* Update distraction-settings.js

* Update side-nav.js

* added hiding subscription activity

* Update distraction-settings.js

* Update distraction-settings.js

* Update side-nav.js

* Update side-nav.vue

* Update distraction-settings.vue

* Update settings.js

* Update side-nav.vue

* Update distraction-settings.js

* Update en-US.yaml

* Update en_GB.yaml

* Update distraction-settings.js

* Update settings.js

* Update side-nav.vue

* Update side-nav.vue

* Update side-nav.vue

Co-authored-by: Pablo <8d1d1de7-176f-4d40-b5f0-5a552aabd433@4wrd.cc>

src/renderer/components/distraction-settings/distraction-settings.js

@@ -39,6 +39,9 @@ export default Vue.extend({
     },
     hideLiveChat: function () {
       return this.$store.getters.getHideLiveChat
+    },
+    hideActiveSubscriptions: function () {
+      return this.$store.getters.getHideActiveSubscriptions
     }
   },
   methods: {
@@ -60,6 +63,7 @@ export default Vue.extend({
       'updateHideTrendingVideos',
       'updateHidePopularVideos',
       'updateHideLiveChat',
+      'updateHideActiveSubscriptions',
       'updatePlayNextVideo',
       'updateDefaultTheatreMode'
     ])

src/renderer/components/distraction-settings/distraction-settings.vue

@@ -33,6 +33,12 @@
           :default-value="hideCommentLikes"
           @change="updateHideCommentLikes"
         />
+        <ft-toggle-switch
+          :label="$t('Settings.Distraction Free Settings.Hide Active Subscriptions')"
+          :compact="true"
+          :default-value="hideActiveSubscriptions"
+          @change="updateHideActiveSubscriptions"
+        />
       </div>
       <div class="switchColumn">
         <ft-toggle-switch

src/renderer/components/side-nav/side-nav.js

@@ -50,6 +50,9 @@ export default Vue.extend({
     },
     hideTrendingVideos: function () {
       return this.$store.getters.getHideTrendingVideos
+    },
+    hideActiveSubscriptions: function () {
+      return this.$store.getters.getHideActiveSubscriptions
     }
   },
   methods: {

src/renderer/components/side-nav/side-nav.vue

@@ -97,26 +97,30 @@
       </div>
       <hr>
       <div
-        v-for="(channel, index) in activeSubscriptions"
+        v-if="!hideActiveSubscriptions"
-        :key="index"
-        class="navChannel mobileHidden"
-        :title="channel.name"
-        @click="goToChannel(channel.id)"
       >
         <div
-          class="thumbnailContainer"
+          v-for="(channel, index) in activeSubscriptions"
+          :key="index"
+          class="navChannel mobileHidden"
+          :title="channel.name"
+          @click="goToChannel(channel.id)"
         >
-          <img
+          <div
-            class="channelThumbnail"
+            class="thumbnailContainer"
-            :src="channel.thumbnail"
           >
+            <img
+              class="channelThumbnail"
+              :src="channel.thumbnail"
+            >
+          </div>
+          <p
+            v-if="isOpen"
+            class="navLabel"
+          >
+            {{ channel.name }}
+          </p>
         </div>
-        <p
-          v-if="isOpen"
-          class="navLabel"
-        >
-          {{ channel.name }}
-        </p>
       </div>
     </div>
   </ft-flex-box>

src/renderer/store/modules/settings.js

@@ -71,7 +71,8 @@ const state = {
   hideRecommendedVideos: false,
   hideTrendingVideos: false,
   hidePopularVideos: false,
-  hideLiveChat: false
+  hideLiveChat: false,
+  hideActiveSubscriptions: false
 }
 
 const getters = {
@@ -224,6 +225,9 @@ const getters = {
   },
   getHideLiveChat: () => {
     return state.hideLiveChat
+  },
+  getHideActiveSubscriptions: () => {
+    return state.hideActiveSubscriptions
   }
 }
 
@@ -351,6 +355,9 @@ const actions = {
             case 'hideLiveChat':
               commit('setHideLiveChat', result.value)
               break
+            case 'hideActiveSubscriptions':
+              commit('setHideActiveSubscriptions', result.value)
+              break
           }
         })
       }
@@ -655,6 +662,14 @@ const actions = {
     })
   },
 
+  updateHideActiveSubscriptions ({ commit }, hideActiveSubscriptions) {
+    settingsDb.update({ _id: 'hideActiveSubscriptions' }, { _id: 'hideActiveSubscriptions', value: hideActiveSubscriptions }, { upsert: true }, (err, numReplaced) => {
+      if (!err) {
+        commit('setHideActiveSubscriptions', hideActiveSubscriptions)
+      }
+    })
+  },
+
   updateHideLiveChat ({ commit }, hideLiveChat) {
     settingsDb.update({ _id: 'hideLiveChat' }, { _id: 'hideLiveChat', value: hideLiveChat }, { upsert: true }, (err, numReplaced) => {
       if (!err) {
@@ -796,6 +811,9 @@ const mutations = {
   },
   setHideLiveChat (state, hideLiveChat) {
     state.hideLiveChat = hideLiveChat
+  },
+  setHideActiveSubscriptions (state, hideActiveSubscriptions) {
+    state.hideActiveSubscriptions = hideActiveSubscriptions
   }
 }
 

static/locales/en-US.yaml

@@ -213,6 +213,7 @@ Settings:
     Hide Trending Videos: Hide Trending Videos
     Hide Popular Videos: Hide Popular Videos
     Hide Live Chat: Hide Live Chat
+    Hide Active Subscriptions: Hide Active Subscriptions
   Data Settings:
     Data Settings: Data Settings
     Select Import Type: Select Import Type

static/locales/en_GB.yaml

@@ -275,6 +275,7 @@ Settings:
     Hide Channel Subscribers: Hide Channel Subscribers
     Hide Video Likes And Dislikes: Hide Video Likes And Dislikes
     Hide Video Views: Hide Video Views
+    Hide Active Subscriptions: Hide Active Subscriptions
     Distraction Free Settings: Distraction Free Settings
   The app needs to restart for changes to take effect. Restart and apply change?: The
     app needs to restart for changes to take effect. Do you want to restart and apply