From fd1c8ee51332e990ab5633f78fe5179962ca4f85 Mon Sep 17 00:00:00 2001
From: advplyr <advplyr@protonmail.com>
Date: Tue, 25 Feb 2025 17:25:56 -0600
Subject: [PATCH] Update episode list to come from component ref, populate
 queue from table order when playing episode

---
 .../tables/podcast/LazyEpisodesTable.vue      | 23 +++++++------------
 client/pages/item/_id/index.vue               |  9 +++-----
 client/store/index.js                         |  7 ------
 3 files changed, 11 insertions(+), 28 deletions(-)

diff --git a/client/components/tables/podcast/LazyEpisodesTable.vue b/client/components/tables/podcast/LazyEpisodesTable.vue
index 0e62e9e4..af0f5584 100644
--- a/client/components/tables/podcast/LazyEpisodesTable.vue
+++ b/client/components/tables/podcast/LazyEpisodesTable.vue
@@ -89,13 +89,6 @@ export default {
       handler() {
         this.refresh()
       }
-    },
-    episodesList: {
-      handler(newList) {
-        const episodeIds = newList.map((ep) => ep.id)
-        this.$store.commit('setSortedEpisodeIds', episodeIds)
-      },
-      immediate: true
     }
   },
   computed: {
@@ -368,20 +361,20 @@ export default {
     playEpisode(episode) {
       const queueItems = []
 
-      const episodesInListeningOrder = this.episodesCopy.map((ep) => ({ ...ep })).sort((a, b) => String(a.publishedAt).localeCompare(String(b.publishedAt), undefined, { numeric: true, sensitivity: 'base' }))
+      const episodesInListeningOrder = this.episodesList
       const episodeIndex = episodesInListeningOrder.findIndex((e) => e.id === episode.id)
       for (let i = episodeIndex; i < episodesInListeningOrder.length; i++) {
-        const episode = episodesInListeningOrder[i]
-        const podcastProgress = this.$store.getters['user/getUserMediaProgress'](this.libraryItem.id, episode.id)
-        if (!podcastProgress || !podcastProgress.isFinished) {
+        const _episode = episodesInListeningOrder[i]
+        const podcastProgress = this.$store.getters['user/getUserMediaProgress'](this.libraryItem.id, _episode.id)
+        if (!podcastProgress?.isFinished || episode.id === _episode.id) {
           queueItems.push({
             libraryItemId: this.libraryItem.id,
             libraryId: this.libraryItem.libraryId,
-            episodeId: episode.id,
-            title: episode.title,
+            episodeId: _episode.id,
+            title: _episode.title,
             subtitle: this.mediaMetadata.title,
-            caption: episode.publishedAt ? this.$getString('LabelPublishedDate', [this.$formatDate(episode.publishedAt, this.dateFormat)]) : this.$strings.LabelUnknownPublishDate,
-            duration: episode.audioFile.duration || null,
+            caption: _episode.publishedAt ? this.$getString('LabelPublishedDate', [this.$formatDate(_episode.publishedAt, this.dateFormat)]) : this.$strings.LabelUnknownPublishDate,
+            duration: _episode.audioFile.duration || null,
             coverPath: this.media.coverPath || null
           })
         }
diff --git a/client/pages/item/_id/index.vue b/client/pages/item/_id/index.vue
index 81dfe35c..bec80ca6 100644
--- a/client/pages/item/_id/index.vue
+++ b/client/pages/item/_id/index.vue
@@ -132,7 +132,7 @@
 
           <tables-tracks-table v-if="tracks.length" :title="$strings.LabelStatsAudioTracks" :tracks="tracksWithAudioFile" :is-file="isFile" :library-item-id="libraryItemId" class="mt-6" />
 
-          <tables-podcast-lazy-episodes-table v-if="isPodcast" :library-item="libraryItem" />
+          <tables-podcast-lazy-episodes-table ref="episodesTable" v-if="isPodcast" :library-item="libraryItem" />
 
           <tables-ebook-files-table v-if="ebookFiles.length" :library-item="libraryItem" class="mt-6" />
 
@@ -267,9 +267,6 @@ export default {
     podcastEpisodes() {
       return this.media.episodes || []
     },
-    sortedEpisodeIds() {
-      return this.$store.getters.getSortedEpisodeIds
-    },
     title() {
       return this.mediaMetadata.title || 'No Title'
     },
@@ -537,8 +534,8 @@ export default {
       let episodeId = null
       const queueItems = []
       if (this.isPodcast) {
-        // Sort the episodes based on the sorting and filtering from the episode table component
-        const episodesInListeningOrder = this.sortedEpisodeIds.map((id) => this.podcastEpisodes.find((ep) => ep.id === id))
+        // Uses the sorting and filtering from the episode table component
+        const episodesInListeningOrder = this.$refs.episodesTable?.episodesList || []
 
         // Find the first unplayed episode from the table
         let episodeIndex = episodesInListeningOrder.findIndex((ep) => {
diff --git a/client/store/index.js b/client/store/index.js
index accf931d..2f2201b6 100644
--- a/client/store/index.js
+++ b/client/store/index.js
@@ -25,7 +25,6 @@ export const state = () => ({
   previousPath: '/',
   bookshelfBookIds: [],
   episodeTableEpisodeIds: [],
-  sortedEpisodeIds: [],
   openModal: null,
   innerModalOpen: false,
   lastBookshelfScrollData: {},
@@ -62,9 +61,6 @@ export const getters = {
   getHomeBookshelfView: (state) => {
     if (!state.serverSettings || isNaN(state.serverSettings.homeBookshelfView)) return Constants.BookshelfView.STANDARD
     return state.serverSettings.homeBookshelfView
-  },
-  getSortedEpisodeIds: (state) => {
-    return state.sortedEpisodeIds || []
   }
 }
 
@@ -150,9 +146,6 @@ export const mutations = {
   setEpisodeTableEpisodeIds(state, val) {
     state.episodeTableEpisodeIds = val || []
   },
-  setSortedEpisodeIds(state, episodeIds) {
-    state.sortedEpisodeIds = episodeIds || []
-  },
   setPreviousPath(state, val) {
     state.previousPath = val
   },