feat: 🏗️ add event bus to manage updating episode list

src/components/Feed/Episodes.vue

@@ -100,6 +100,7 @@
 import { NcActionButton, NcActionLink, NcActions, NcAvatar, NcListItem, NcModal, NcProgressBar } from '@nextcloud/vue'
 import { durationToSeconds, formatEpisodeTimestamp, formatLocaleDate } from '../../utils/time.js'
 import Download from 'vue-material-design-icons/Download.vue'
+import { EventBus } from '../../store/bus.js'
 import Loading from '../Atoms/Loading.vue'
 import Modal from '../Atoms/Modal.vue'
 import OpenInNew from 'vue-material-design-icons/OpenInNew.vue'
@@ -172,6 +173,7 @@ export default {
 			this.loading = true
 			const episodes = await axios.get(generateUrl('/apps/repod/episodes/list?url={url}', { url: this.url }))
 			this.episodes = [...episodes.data].sort((a, b) => new Date(b.pubDate?.date) - new Date(a.pubDate?.date))
+			EventBus.$on('updateEpisodesList', this.updateList)
 		} catch (e) {
 			console.error(e)
 			showError(t('repod', 'Could not fetch episodes'))
@@ -179,6 +181,9 @@ export default {
 			this.loading = false
 		}
 	},
+	destroyed() {
+		EventBus.$off('updateEpisodesList')
+	},
 	methods: {
 		formatLocaleDate,
 		hasEnded(episode) {
@@ -199,7 +204,7 @@ export default {
 		async markAs(episode, read) {
 			try {
 				this.loadingAction = true
-				const action = {
+				episode.action = {
 					podcast: this.url,
 					episode: episode.url,
 					guid: episode.guid,
@@ -209,13 +214,8 @@ export default {
 					position: read ? durationToSeconds(episode.duration) : 0,
 					total: durationToSeconds(episode.duration),
 				}
-				await axios.post(generateUrl('/apps/gpoddersync/episode_action/create'), [action])
+				await axios.post(generateUrl('/apps/gpoddersync/episode_action/create'), [episode.action])
-				this.episodes = this.episodes.map((e) => {
+				this.updateList(episode)
-					if (e.url === episode.url) {
-						e.action = action
-					}
-					return e
-				})
 			} catch (e) {
 				console.error(e)
 				showError(t('repod', 'Could not change the status of the episode'))
@@ -223,6 +223,9 @@ export default {
 				this.loadingAction = false
 			}
 		},
+		updateList(episode) {
+			this.episodes = this.episodes.map((e) => e.url === episode.url ? episode : e)
+		},
 	},
 }
 </script>

src/store/bus.js

@@ -0,0 +1,3 @@
+import Vue from 'vue'
+
+export const EventBus = new Vue()