[Feature]: Hide videos immediately when marking as watched (#7866)

* Add computed properties for history cache and filtered video list

* Refactor activeVideoList to use filteredVideoList and exclude watched videos from videoList

* Creating a computed property to de-couple filteredVideoList from the store getters (SRP)

* Transferred filtering logic to SubscriptionsTabUi component

* Fix variable name

* Don't try to filter videos on the posts tab

---------

Co-authored-by: absidue <[email protected]>

Author: palharesf

src/renderer/components/SubscriptionsTabUi/SubscriptionsTabUi.vue

@@ -125,10 +125,10 @@ const subscriptionLimit = sessionStorage.getItem('subscriptionLimit')
 const dataLimit = ref(subscriptionLimit !== null ? parseInt(subscriptionLimit) : props.initialDataLimit)
 
 const activeVideoList = computed(() => {
-  if (props.videoList.length < dataLimit.value) {
-    return props.videoList
+  if (filteredVideoList.value.length < dataLimit.value) {
+    return filteredVideoList.value
   } else {
-    return props.videoList.slice(0, dataLimit.value)
+    return filteredVideoList.value.slice(0, dataLimit.value)
   }
 })
 
@@ -141,6 +141,24 @@ const fetchSubscriptionsAutomatically = computed(() => {
   return store.getters.getFetchSubscriptionsAutomatically
 })
 
+const historyCacheById = computed(() => {
+  return store.getters.getHistoryCacheById
+})
+
+const hideWatchedSubs = computed(() => {
+  return store.getters.getHideWatchedSubs
+})
+
+const filteredVideoList = computed(() => {
+  if (hideWatchedSubs.value && !props.isCommunity) {
+    return props.videoList.filter((video) => {
+      return !Object.hasOwn(historyCacheById.value, video.videoId)
+    })
+  } else {
+    return props.videoList
+  }
+})
+
 function increaseLimit() {
   dataLimit.value += props.initialDataLimit
   sessionStorage.setItem('subscriptionLimit', dataLimit.value.toFixed(0))

src/renderer/helpers/subscriptions.js

@@ -31,14 +31,6 @@ export function updateVideoListAfterProcessing(videos) {
     })
   }
 
-  if (store.getters.getHideWatchedSubs) {
-    const historyCacheById = store.getters.getHistoryCacheById
-
-    videoList = videoList.filter((video) => {
-      return !Object.hasOwn(historyCacheById, video.videoId)
-    })
-  }
-
   // ordered last to show first eligible video from channel
   // if the first one incidentally failed one of the above checks
   if (store.getters.getOnlyShowLatestFromChannel) {