changed logic to work with Custom as well.

FreeTubeApp · Dec 9, 2024 · 88c383f · 88c383f
1 parent 615c931
commit 88c383f
Show file tree

Hide file tree

Showing 5 changed files with 49 additions and 16 deletions.
diff --git a/src/renderer/components/FtElementList/FtElementList.vue b/src/renderer/components/FtElementList/FtElementList.vue
@@ -24,7 +24,7 @@
       :playlist-item-id="result.playlistItemId"
       @move-video-up="moveVideoUp(result.videoId, result.playlistItemId)"
       @move-video-down="moveVideoDown(result.videoId, result.playlistItemId)"
-      @remove-from-playlist="removeFromPlaylist(result.videoId, result.playlistItemId)"
+      @remove-from-playlist="removeFromPlaylist(result.videoId)"
     />
   </FtAutoGrid>
 </template>
@@ -132,10 +132,9 @@ function moveVideoDown(videoId, playlistItemId) {
 
 /**
  * @param {string} videoId
- * @param {string} playlistItemId
  */
-function removeFromPlaylist(videoId, playlistItemId) {
-  emit('remove-from-playlist', videoId, playlistItemId)
+function removeFromPlaylist(videoId) {
+  emit('remove-from-playlist', videoId)
 }
 </script>
 

diff --git a/src/renderer/store/modules/playlists.js b/src/renderer/store/modules/playlists.js
@@ -484,10 +484,10 @@ const mutations = {
     }
   },
 
-  removeVideos(state, { _id, videoId }) {
+  removeVideos(state, { _id, videoIds }) {
     const playlist = state.playlists.find(playlist => playlist._id === _id)
     if (playlist) {
-      playlist.videos = playlist.videos.filter(video => videoId.indexOf(video) === -1)
+      playlist.videos = playlist.videos.filter(video => !videoIds.includes(video.videoId))
     }
   },
 

diff --git a/src/renderer/views/Playlist/Playlist.js b/src/renderer/views/Playlist/Playlist.js
@@ -583,16 +583,49 @@ export default defineComponent({
       }
     },
 
-    removeVideoFromPlaylist: function (videoId, playlistItemId) {
+    removeVideoFromPlaylist: function (videoId) {
       try {
-        this.removeVideo({
-          _id: this.playlistId,
-          videoId: videoId,
-          playlistItemId: playlistItemId,
+        // Initialize deletedVideoIds array if not already
+        if (!this.deletedVideoIds) {
+          this.deletedVideoIds = []
+        }
+        const playlistItems = [].concat(this.playlistItems)
+        const tempPlaylistItems = [].concat(this.playlistItems)
+        let isUndoClicked = false
+
+        const videoIndex = this.playlistItems.findIndex((video) => {
+          return video.videoId === videoId
         })
-        // Update playlist's `lastUpdatedAt`
-        this.updatePlaylist({ _id: this.playlistId })
-        showToast(this.$t('User Playlists.SinglePlaylistView.Toast.Video has been removed'))
+
+        if (videoIndex !== -1) {
+          // Add the video to the deletedVideoIds list
+          this.deletedVideoIds.push(this.playlistItems[videoIndex].videoId)
+          playlistItems.splice(videoIndex, 1)
+          this.playlistItems = playlistItems
+
+          if (!this.lastToastTime || Date.now() - this.lastToastTime > 5000) {
+            this.lastToastTime = Date.now()
+            showToast(
+              this.$t('User Playlists.SinglePlaylistView.Toast["Video has been removed. Click here to undo."]'),
+              5000,
+              () => {
+                this.playlistItems = tempPlaylistItems
+                isUndoClicked = true
+                this.deletedVideoIds = []
+                this.lastToastTime = null
+              }
+            )
+            setTimeout(() => {
+              if (!isUndoClicked) {
+                this.removeVideos({
+                  _id: this.playlistId,
+                  videoIds: this.deletedVideoIds,
+                })
+                this.deletedVideoIds = []
+              }
+            }, 5000)
+          }
+        }
       } catch (e) {
         showToast(this.$t('User Playlists.SinglePlaylistView.Toast.There was a problem with removing this video'))
         console.error(e)
@@ -647,7 +680,7 @@ export default defineComponent({
       'updateSubscriptionDetails',
       'updatePlaylist',
       'updateUserPlaylistSortOrder',
-      'removeVideo',
+      'removeVideos',
       'setAppTitle'
     ]),
 

diff --git a/src/renderer/views/Playlist/Playlist.vue b/src/renderer/views/Playlist/Playlist.vue
@@ -107,7 +107,7 @@
               :initial-visible-state="index < 10"
               @move-video-up="moveVideoUp(item.videoId, item.playlistItemId)"
               @move-video-down="moveVideoDown(item.videoId, item.playlistItemId)"
-              @remove-from-playlist="removeVideoFromPlaylist(item.videoId, item.playlistItemId)"
+              @remove-from-playlist="removeVideoFromPlaylist(item.videoId)"
             />
           </transition-group>
           <ft-auto-load-next-page-wrapper

diff --git a/static/locales/en-US.yaml b/static/locales/en-US.yaml
@@ -219,6 +219,7 @@ User Playlists:
       This video cannot be moved up.: This video cannot be moved up.
       This video cannot be moved down.: This video cannot be moved down.
       Video has been removed: Video has been removed
+      Video has been removed. Click here to undo.: Video has been removed. Click here to undo.
       There was a problem with removing this video: There was a problem with removing this video
 
       This playlist is already being used for quick bookmark.: This playlist is already being used for quick bookmark.