Update subscription cache when subscribing from the channel page (#5717)

* Update subscription cache when subscribing from the channel page

* Remove length checks to support missing channel tabs

src/renderer/components/ChannelDetails/ChannelDetails.vue

@@ -60,6 +60,7 @@
             :channel-id="id"
             :channel-name="name"
             :channel-thumbnail="thumbnailUrl"
+            @subscribed="subscribed"
           />
         </div>
       </div>
@@ -277,7 +278,7 @@ const props = defineProps({
   }
 })
 
-const emit = defineEmits(['change-tab', 'search'])
+const emit = defineEmits(['change-tab', 'search', 'subscribed'])
 
 const hideChannelSubscriptions = computed(() => {
   return store.getters.getHideChannelSubscriptions
@@ -298,6 +299,10 @@ const formattedSubCount = computed(() => {
   return formatNumber(props.subCount)
 })
 
+function subscribed() {
+  emit('subscribed')
+}
+
 /**
  * @param {string} tab
  */

src/renderer/components/ft-subscribe-button/ft-subscribe-button.js

@@ -42,6 +42,7 @@ export default defineComponent({
       required: false
     }
   },
+  emits: ['subscribed'],
   data: function () {
     return {
       isProfileDropdownOpen: false,
@@ -139,6 +140,7 @@ export default defineComponent({
         this.addChannelToProfiles({ channel, profileIds })
 
         showToast(this.$t('Channel.Added channel to your subscriptions'))
+        this.$emit('subscribed')
       }
 
       if (this.isProfileDropdownEnabled && this.openDropdownOnSubscribe && !this.isProfileDropdownOpen) {

src/renderer/views/Channel/Channel.js

@@ -1991,6 +1991,36 @@ export default defineComponent({
       })
     },
 
+    handleSubscription: function () {
+      // We can't cache the shorts data as YouTube doesn't return published dates on the shorts channel tab
+
+      // Create copies of the arrays so that we only cache the first page
+      // If we use the same array, the store will get angry at us for modifying it outside of the store
+      // when the user clicks load more
+
+      if (this.videoSortBy === 'newest') {
+        this.updateSubscriptionVideosCacheByChannel({
+          channelId: this.id,
+          videos: [...this.latestVideos]
+        })
+      }
+
+      if (this.liveSortBy === 'newest') {
+        this.updateSubscriptionLiveCacheByChannel({
+          channelId: this.id,
+          videos: [...this.latestLive]
+        })
+      }
+
+      this.latestCommunityPosts.forEach(post => {
+        post.authorId = this.id
+      })
+      this.updateSubscriptionPostsCacheByChannel({
+        channelId: this.id,
+        posts: [...this.latestCommunityPosts]
+      })
+    },
+
     getIconForSortPreference: (s) => getIconForSortPreference(s),
 
     ...mapActions([

src/renderer/views/Channel/Channel.vue

@@ -20,6 +20,7 @@
       class="card channelDetails"
       @change-tab="changeTab"
       @search="newSearch"
+      @subscribed="handleSubscription"
     />
     <ft-card
       v-if="!isLoading && !errorMessage && (isFamilyFriendly || !showFamilyFriendlyOnly)"