Add:Remove from playlist option in more menu for items on playlist page #987

components/modals/ItemMoreMenuModal.vue

@@ -26,6 +26,10 @@ export default {
       type: Object,
       default: () => null
     },
+    playlist: {
+      type: Object,
+      default: () => null
+    },
     hideRssFeedOption: Boolean
   },
   data() {
@@ -92,6 +96,15 @@ export default {
         }
       }
 
+      // If on playlist page show remove from playlist option
+      if (this.playlist) {
+        items.push({
+          text: this.$strings.LabelRemoveFromPlaylist,
+          value: 'removeFromPlaylist',
+          icon: 'playlist_remove'
+        })
+      }
+
       if (this.showRSSFeedOption) {
         items.push({
           text: this.rssFeed ? this.$strings.HeaderRSSFeed : this.$strings.HeaderOpenRSSFeed,
@@ -255,6 +268,8 @@ export default {
       } else if (action === 'playlist') {
         this.$store.commit('globals/setSelectedPlaylistItems', [{ libraryItem: this.libraryItem, episode: this.episode }])
         this.$store.commit('globals/setShowPlaylistsAddCreateModal', true)
+      } else if (action === 'removeFromPlaylist') {
+        this.removeFromPlaylistClick()
       } else if (action === 'markFinished') {
         if (this.episode) this.toggleEpisodeFinished()
         else this.toggleFinished()
@@ -456,6 +471,29 @@ export default {
         .finally(() => {
           this.$emit('update:processing', false)
         })
+    },
+    removeFromPlaylistClick() {
+      if (!this.playlist) {
+        this.$toast.error('Invalid: No Playlist')
+        return
+      }
+
+      this.$emit('update:processing', true)
+      let url = `/api/playlists/${this.playlist.id}/item/${this.serverLibraryItemId}`
+      if (this.serverEpisodeId) url += `/${this.serverEpisodeId}`
+      this.$axios
+        .$delete(url)
+        .then(() => {
+          this.$toast.success('Item removed from playlist')
+        })
+        .catch((error) => {
+          const errorMsg = error.response?.data || 'Unknown error'
+          console.error('Failed to remove item from playlist', error)
+          this.$toast.error('Failed to remove from playlist: ' + errorMsg)
+        })
+        .finally(() => {
+          this.$emit('update:processing', false)
+        })
     }
   },
   mounted() {}

pages/playlist/_id.vue

@@ -24,7 +24,7 @@
       </div>
     </div>
 
-    <modals-item-more-menu-modal v-model="showMoreMenu" :library-item="selectedLibraryItem" :episode="selectedEpisode" hide-rss-feed-option :processing.sync="processing" />
+    <modals-item-more-menu-modal v-model="showMoreMenu" :library-item="selectedLibraryItem" :episode="selectedEpisode" :playlist="playlist" hide-rss-feed-option :processing.sync="processing" />
     <div v-show="processing" class="fixed top-0 left-0 w-screen h-screen flex items-center justify-center bg-black/50 z-50">
       <ui-loading-indicator />
     </div>
@@ -140,8 +140,24 @@ export default {
           this.$eventBus.$emit('play-item', { libraryItemId: nextItem.libraryItemId, episodeId: nextItem.episodeId })
         }
       }
+    },
+    playlistUpdated(playlist) {
+      if (this.playlist.id !== playlist.id) return
+      this.playlist = playlist
+    },
+    playlistRemoved(playlist) {
+      if (this.playlist.id === playlist.id) {
+        this.$router.replace('/bookshelf/playlists')
+      }
     }
   },
-  mounted() {}
+  mounted() {
+    this.$socket.$on('playlist_updated', this.playlistUpdated)
+    this.$socket.$on('playlist_removed', this.playlistRemoved)
+  },
+  beforeDestroy() {
+    this.$socket.$off('playlist_updated', this.playlistUpdated)
+    this.$socket.$off('playlist_removed', this.playlistRemoved)
+  }
 }
 </script>

strings/cs.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Číst znovu",
   "LabelRecentlyAdded": "Nedávno přidáno",
   "LabelRecentSeries": "Nedávné série",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Vlastní e-mail vlastníka",
   "LabelRSSFeedCustomOwnerName": "Vlastní jméno vlastníka",
   "LabelRSSFeedPreventIndexing": "Zabránit indexování",

strings/da.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Recently Added",
   "LabelRecentSeries": "Recent Series",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Brugerdefineret ejerens e-mail",
   "LabelRSSFeedCustomOwnerName": "Brugerdefineret ejerens navn",
   "LabelRSSFeedPreventIndexing": "Forhindrer indeksering",

strings/de.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Erneut lesen",
   "LabelRecentlyAdded": "Kürzlich hinzugefügt",
   "LabelRecentSeries": "Aktuelle Serien",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Benutzerdefinierte Eigentümer-E-Mail",
   "LabelRSSFeedCustomOwnerName": "Benutzerdefinierter Name des Eigentümers",
   "LabelRSSFeedPreventIndexing": "Indizierung verhindern",

strings/en-us.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Recently Added",
   "LabelRecentSeries": "Recent Series",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Custom owner Email",
   "LabelRSSFeedCustomOwnerName": "Custom owner Name",
   "LabelRSSFeedPreventIndexing": "Prevent Indexing",

strings/es.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Recently Added",
   "LabelRecentSeries": "Recent Series",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Email de dueño personalizado",
   "LabelRSSFeedCustomOwnerName": "Nombre de dueño personalizado",
   "LabelRSSFeedPreventIndexing": "Prevenir Indexado",

strings/fr.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Recently Added",
   "LabelRecentSeries": "Recent Series",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Courriel du propriétaire personnalisé",
   "LabelRSSFeedCustomOwnerName": "Nom propriétaire personnalisé",
   "LabelRSSFeedPreventIndexing": "Empêcher l’indexation",

strings/gu.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Recently Added",
   "LabelRecentSeries": "Recent Series",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Custom owner Email",
   "LabelRSSFeedCustomOwnerName": "Custom owner Name",
   "LabelRSSFeedPreventIndexing": "Prevent Indexing",

strings/hi.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Recently Added",
   "LabelRecentSeries": "Recent Series",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Custom owner Email",
   "LabelRSSFeedCustomOwnerName": "Custom owner Name",
   "LabelRSSFeedPreventIndexing": "Prevent Indexing",

strings/hr.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Recently Added",
   "LabelRecentSeries": "Recent Series",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Custom owner Email",
   "LabelRSSFeedCustomOwnerName": "Custom owner Name",
   "LabelRSSFeedPreventIndexing": "Prevent Indexing",

strings/hu.json

@@ -191,9 +191,7 @@
   "LabelReadAgain": "Újraolvasás",
   "LabelRecentlyAdded": "Legutóbb hozzáadva",
   "LabelRecentSeries": "Legutóbbi sorozatok",
-  "MessageConfirmMarkAsFinished": "Biztosan befejezettnek jelöli ezt az elemet?",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
-  "MessageConfirmRemoveBookmark": "Biztosan eltávolítja a könyvjelzőt?",
-  "MessageDiscardProgress": "Haladás elvetése",
   "LabelRSSFeedCustomOwnerEmail": "Egyéni tulajdonos e-mail",
   "LabelRSSFeedCustomOwnerName": "Egyéni tulajdonos neve",
   "LabelRSSFeedPreventIndexing": "Indexelés megakadályozása",
@@ -246,6 +244,9 @@
   "MessageConfirmDeleteLocalEpisode": "\"{0}\" helyi epizód eltávolítása az eszközről? A szerveren lévő fájl nem érintett.",
   "MessageConfirmDeleteLocalFiles": "Ezen elem helyi fájljainak eltávolítása az eszközről? A szerveren lévő fájlok és a haladás nem érintettek.",
   "MessageConfirmDiscardProgress": "Biztosan alaphelyzetbe akarja állítani a haladást?",
+  "MessageConfirmMarkAsFinished": "Biztosan befejezettnek jelöli ezt az elemet?",
+  "MessageConfirmRemoveBookmark": "Biztosan eltávolítja a könyvjelzőt?",
+  "MessageDiscardProgress": "Haladás elvetése",
   "MessageDownloadCompleteProcessing": "Letöltés kész. Feldolgozás...",
   "MessageDownloading": "Letöltés...",
   "MessageDownloadingEpisode": "Epizód letöltése",

strings/it.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Leggi Ancora",
   "LabelRecentlyAdded": "Aggiunti Recentemente",
   "LabelRecentSeries": "Serie Recenti",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Email del proprietario personalizzato",
   "LabelRSSFeedCustomOwnerName": "Nome del proprietario personalizzato",
   "LabelRSSFeedPreventIndexing": "Impedisci l'indicizzazione",

strings/lt.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Recently Added",
   "LabelRecentSeries": "Recent Series",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Pasirinktinis savininko el. paštas",
   "LabelRSSFeedCustomOwnerName": "Pasirinktinis savininko vardas",
   "LabelRSSFeedPreventIndexing": "Neleisti indeksuoti",

strings/nl.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Recently Added",
   "LabelRecentSeries": "Recent Series",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Aangepast e-mailadres eigenaar",
   "LabelRSSFeedCustomOwnerName": "Aangepaste naam eigenaar",
   "LabelRSSFeedPreventIndexing": "Voorkom indexering",

strings/no.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Recently Added",
   "LabelRecentSeries": "Recent Series",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Tilpasset eier Epost",
   "LabelRSSFeedCustomOwnerName": "Tilpasset eier Navn",
   "LabelRSSFeedPreventIndexing": "Forhindre indeksering",

strings/pl.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Czytaj ponownie",
   "LabelRecentlyAdded": "Ostatnio dodane",
   "LabelRecentSeries": "Najnowsze serie",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Custom owner Email",
   "LabelRSSFeedCustomOwnerName": "Custom owner Name",
   "LabelRSSFeedPreventIndexing": "Zapobiegaj indeksowaniu",

strings/pt-br.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Ler Novamente",
   "LabelRecentlyAdded": "Novidades",
   "LabelRecentSeries": "Séries Recentes",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Email do dono personalizado",
   "LabelRSSFeedCustomOwnerName": "Nome do dono personalizado",
   "LabelRSSFeedPreventIndexing": "Impedir Indexação",
@@ -290,4 +291,4 @@
   "ToastPodcastCreateSuccess": "Podcast criado",
   "ToastRSSFeedCloseFailed": "Falha ao fechar feed RSS",
   "ToastRSSFeedCloseSuccess": "Feed RSS fechado"
-}
+}

strings/ru.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Недавно добавленные",
   "LabelRecentSeries": "Недавние серии",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Пользовательский Email владельца",
   "LabelRSSFeedCustomOwnerName": "Пользовательское Имя владельца",
   "LabelRSSFeedPreventIndexing": "Запретить индексирование",

strings/sv.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "Read Again",
   "LabelRecentlyAdded": "Recently Added",
   "LabelRecentSeries": "Recent Series",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "Anpassad ägarens e-post",
   "LabelRSSFeedCustomOwnerName": "Anpassat ägarnamn",
   "LabelRSSFeedPreventIndexing": "Förhindra indexering",

strings/zh-cn.json

@@ -191,6 +191,7 @@
   "LabelReadAgain": "再次阅读",
   "LabelRecentlyAdded": "最近添加",
   "LabelRecentSeries": "最近添加系列",
+  "LabelRemoveFromPlaylist": "Remove from Playlist",
   "LabelRSSFeedCustomOwnerEmail": "自定义所有者电子邮件",
   "LabelRSSFeedCustomOwnerName": "自定义所有者名称",
   "LabelRSSFeedPreventIndexing": "防止索引",