From dfbad49dd5ce4d1f1ec4096e8e646a8eea3d89d1 Mon Sep 17 00:00:00 2001
From: root <root@git.maharshi.ninja>
Date: Tue, 19 Apr 2022 10:57:43 +0530
Subject: [PATCH] Enable delete video from playlist

---
 src/routes/PlaylistPage.vue | 27 +++++++++++++++++++++------
 1 file changed, 21 insertions(+), 6 deletions(-)

diff --git a/src/routes/PlaylistPage.vue b/src/routes/PlaylistPage.vue
index 2ab93f0..bb9524f 100644
--- a/src/routes/PlaylistPage.vue
+++ b/src/routes/PlaylistPage.vue
@@ -36,7 +36,7 @@
                         <VideoItem :video="video" max-height>
                             <template v-slot:bottom>
                                 <v-card-actions v-if="isAdmin">
-                                    <v-btn outlined>
+                                    <v-btn outlined color="error" @click.prevent="removeVideo(video)">
                                         Delete this video
                                     </v-btn>
                                 </v-card-actions>
@@ -72,13 +72,13 @@ export default {
 
 	async mounted () {
 		await this.getPlaylistData()
-		if (this.$store.getters['auth/isCurrentlyAuthenticated'] && this.$route.query.list?.length === 36) {
+		if (this.$store.getters['auth/isCurrentlyAuthenticated'] && this.playlistID?.length === 36) {
 			const playlists = await this.$store.dispatch('auth/makeRequest', {
 				method: 'GET',
 				path: '/user/playlists'
 			})
 			for (const playlist of playlists) {
-				if (playlist.id === this.$route.query.list) {
+				if (playlist.id === this.playlistID) {
 					this.isAdmin = true
 					break
 				}
@@ -87,11 +87,14 @@ export default {
 	},
 	computed: {
 		getRssUrl () {
-			return this.$store.getters['prefs/apiUrl'] + '/rss/playlists/' + this.$route.query.list
+			return this.$store.getters['prefs/apiUrl'] + '/rss/playlists/' + this.playlistID
+		},
+		playlistID () {
+			return this.$route.query.list
 		},
 		youtubeURL () {
 			const url = new URL('https://youtube.com/playlist')
-			url.searchParams.set('list', this.$route.query.list)
+			url.searchParams.set('list', this.playlistID)
 			return url.href
 		},
 		chunkedByFour () {
@@ -101,12 +104,24 @@ export default {
 	methods: {
 		async fetchPlaylist () {
 			return this.$store.dispatch('auth/makeRequest', {
-				path: '/playlists/' + this.$route.query.list
+				path: '/playlists/' + this.playlistID
 			})
 		},
 		async getPlaylistData () {
 			this.fetchPlaylist()
 				.then(data => (this.playlist = data))
+		},
+
+		async removeVideo (video) {
+			await this.$store.dispatch('auth/makeRequest', {
+				method: 'POST',
+				path: '/user/playlists/remove',
+				data: {
+					playlistId: this.playlistID,
+					index: this.playlist.relatedStreams.indexOf(video)
+				}
+			})
+			await this.getPlaylistData()
 		}
 	},
 	components: {