From 74dc309803c061cc5f55d8bae3f6812384d78fed Mon Sep 17 00:00:00 2001 From: ChunkyProgrammer <78101139+ChunkyProgrammer@users.noreply.github.com> Date: Fri, 3 Jun 2022 08:52:35 -0400 Subject: [PATCH] Fix: Update thumbnail url and channel name for subscriptions when change detected (#1783) * Update thumbnails of subscriptions * refactor * update channel names * movie update thumbnail action to profiles.js * fix updating with invidious * apply code changes * simplify update condition logic * remove unneeded variables * inline variables, use for of * fix channel null check --- src/renderer/store/modules/profiles.js | 25 +++++++++++++++++++++++++ src/renderer/views/Channel/Channel.js | 24 ++++++++++++++++-------- src/renderer/views/Playlist/Playlist.js | 15 ++++++++++++++- src/renderer/views/Watch/Watch.js | 18 ++++++++++++++++-- 4 files changed, 71 insertions(+), 11 deletions(-) diff --git a/src/renderer/store/modules/profiles.js b/src/renderer/store/modules/profiles.js index ed69e53c..046f3224 100644 --- a/src/renderer/store/modules/profiles.js +++ b/src/renderer/store/modules/profiles.js @@ -89,6 +89,31 @@ const actions = { commit('setProfileList', profiles) }, + async updateSubscriptionDetails({ getters, dispatch }, { channelThumbnailUrl, channelName, channelId }) { + const thumbnail = channelThumbnailUrl?.replace(/=s\d*/, '=s176') ?? null // change thumbnail size if different + const profileList = getters.getProfileList + for (const profile of profileList) { + const currentProfileCopy = JSON.parse(JSON.stringify(profile)) + const channel = currentProfileCopy.subscriptions.find((channel) => { + return channel.id === channelId + }) ?? null + if (channel === null) { continue } + let updated = false + if (channel.name !== channelName || (channel.thumbnail !== thumbnail && thumbnail !== null)) { + if (thumbnail !== null) { + channel.thumbnail = thumbnail + } + channel.name = channelName + updated = true + } + if (updated) { + await dispatch('updateProfile', currentProfileCopy) + } else { // channel has not been updated, stop iterating through profiles + break + } + } + }, + async createProfile({ commit }, profile) { try { const newProfile = await DBProfileHandlers.create(profile) diff --git a/src/renderer/views/Channel/Channel.js b/src/renderer/views/Channel/Channel.js index af451826..1fd79744 100644 --- a/src/renderer/views/Channel/Channel.js +++ b/src/renderer/views/Channel/Channel.js @@ -255,16 +255,19 @@ export default Vue.extend({ return } - this.id = response.authorId - this.channelName = response.author + const channelId = response.authorId + const channelName = response.author + const channelThumbnailUrl = response.authorThumbnails[2].url + this.id = channelId + this.channelName = channelName document.title = `${this.channelName} - ${process.env.PRODUCT_NAME}` if (this.hideChannelSubscriptions || response.subscriberCount === 0) { this.subCount = null } else { this.subCount = response.subscriberCount.toFixed(0) } - console.log(response) - this.thumbnailUrl = response.authorThumbnails[2].url + this.thumbnailUrl = channelThumbnailUrl + this.updateSubscriptionDetails({ channelThumbnailUrl, channelName, channelId }) this.channelDescription = autolinker.link(response.description) this.relatedChannels = response.relatedChannels.items this.relatedChannels.forEach(relatedChannel => { @@ -371,15 +374,19 @@ export default Vue.extend({ } console.log(response) - this.channelName = response.author + const channelName = response.author + const channelId = response.authorId + this.channelName = channelName document.title = `${this.channelName} - ${process.env.PRODUCT_NAME}` - this.id = response.authorId + this.id = channelId if (this.hideChannelSubscriptions) { this.subCount = null } else { this.subCount = response.subCount } - this.thumbnailUrl = response.authorThumbnails[3].url.replace('https://yt3.ggpht.com', `${this.currentInvidiousInstance}/ggpht/`) + const thumbnail = response.authorThumbnails[3].url + this.thumbnailUrl = thumbnail.replace('https://yt3.ggpht.com', `${this.currentInvidiousInstance}/ggpht/`) + this.updateSubscriptionDetails({ channelThumbnailUrl: thumbnail, channelName: channelName, channelId: channelId }) this.channelDescription = autolinker.link(response.description) this.relatedChannels = response.relatedChannels.map((channel) => { channel.authorThumbnails[channel.authorThumbnails.length - 1].url = channel.authorThumbnails[channel.authorThumbnails.length - 1].url.replace('https://yt3.ggpht.com', `${this.currentInvidiousInstance}/ggpht/`) @@ -779,7 +786,8 @@ export default Vue.extend({ 'showToast', 'updateProfile', 'invidiousGetChannelInfo', - 'invidiousAPICall' + 'invidiousAPICall', + 'updateSubscriptionDetails' ]) } }) diff --git a/src/renderer/views/Playlist/Playlist.js b/src/renderer/views/Playlist/Playlist.js index 8b754d31..2719a5c0 100644 --- a/src/renderer/views/Playlist/Playlist.js +++ b/src/renderer/views/Playlist/Playlist.js @@ -84,6 +84,12 @@ export default Vue.extend({ infoSource: 'local' } + this.updateSubscriptionDetails({ + channelThumbnailUrl: this.infoData.channelThumbnail, + channelName: this.infoData.channelName, + channelId: this.infoData.channelId + }) + this.playlistItems = result.items.map((video) => { if (typeof video.author !== 'undefined') { const channelName = video.author.name @@ -136,6 +142,12 @@ export default Vue.extend({ infoSource: 'invidious' } + this.updateSubscriptionDetails({ + channelThumbnailUrl: result.authorThumbnails[2].url, + channelName: this.infoData.channelName, + channelId: this.infoData.channelId + }) + const dateString = new Date(result.updated * 1000) this.infoData.lastUpdated = dateString.toLocaleDateString(this.currentLocale, { year: 'numeric', month: 'short', day: 'numeric' }) @@ -174,7 +186,8 @@ export default Vue.extend({ ...mapActions([ 'ytGetPlaylistInfo', - 'invidiousGetPlaylistInfo' + 'invidiousGetPlaylistInfo', + 'updateSubscriptionDetails' ]) } }) diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js index d62ce05c..c3210f15 100644 --- a/src/renderer/views/Watch/Watch.js +++ b/src/renderer/views/Watch/Watch.js @@ -276,6 +276,12 @@ export default Vue.extend({ this.channelName = result.player_response.videoDetails.author this.channelThumbnail = result.player_response.embedPreview.thumbnailPreviewRenderer.videoDetails.embeddedPlayerOverlayVideoDetailsRenderer.channelThumbnail.thumbnails[0].url } + this.updateSubscriptionDetails({ + channelThumbnailUrl: this.channelThumbnail, + channelName: this.channelName, + channelId: this.channelId + }) + this.videoPublished = new Date(result.videoDetails.publishDate.replace('-', '/')).getTime() this.videoDescription = result.player_response.videoDetails.shortDescription @@ -561,7 +567,14 @@ export default Vue.extend({ } this.channelId = result.authorId this.channelName = result.author - this.channelThumbnail = result.authorThumbnails[1] ? result.authorThumbnails[1].url.replace('https://yt3.ggpht.com', `${this.currentInvidiousInstance}/ggpht/`) : '' + const channelThumb = result.authorThumbnails[1] + this.channelThumbnail = channelThumb ? channelThumb.url.replace('https://yt3.ggpht.com', `${this.currentInvidiousInstance}/ggpht/`) : '' + this.updateSubscriptionDetails({ + channelThumbnailUrl: channelThumb?.url, + channelName: result.author, + channelId: result.authorId + }) + this.videoPublished = result.published * 1000 this.videoDescriptionHtml = result.descriptionHtml this.recommendedVideos = result.recommendedVideos @@ -1268,7 +1281,8 @@ export default Vue.extend({ 'updateWatchProgress', 'getUserDataPath', 'ytGetVideoInformation', - 'invidiousGetVideoInformation' + 'invidiousGetVideoInformation', + 'updateSubscriptionDetails' ]) } })