Add more menu on playlist item row to show library item more menu #914

pages/playlist/_id.vue

@@ -20,9 +20,14 @@
           <p class="text-base text-gray-100">{{ description }}</p>
         </div>
 
-        <tables-playlist-items-table :items="playlistItems" :playlist-id="playlist.id" />
+        <tables-playlist-items-table :items="playlistItems" :playlist-id="playlist.id" @showMore="showMore" />
       </div>
     </div>
+
+    <modals-item-more-menu-modal v-model="showMoreMenu" :library-item="selectedLibraryItem" :episode="selectedEpisode" 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>
   </div>
 </template>
 
@@ -67,7 +72,12 @@ export default {
     }
   },
   data() {
-    return {}
+    return {
+      showMoreMenu: false,
+      processing: false,
+      selectedLibraryItem: null,
+      selectedEpisode: null
+    }
   },
   computed: {
     bookCoverAspectRatio() {
@@ -101,6 +111,11 @@ export default {
     }
   },
   methods: {
+    showMore(playlistItem) {
+      this.selectedLibraryItem = playlistItem.libraryItem
+      this.selectedEpisode = playlistItem.episode
+      this.showMoreMenu = true
+    },
     clickPlay() {
       const nextItem = this.playableItems.find((i) => {
         const prog = this.$store.getters['user/getUserMediaProgress'](i.libraryItemId, i.episodeId)