Merge branch 'main' into patch-accessibility-bgcolor

src/components/Search.vue

@@ -48,6 +48,13 @@ const shuffleAdd = () => {
 
     emit('play-urls', copy);
   },
+  removeSong = i => {
+    console.log(i);
+
+    try {
+      results.items.songs.items.splice(i, 1);
+    } catch {}
+  },
   saveAlbum = () => {
     const urls = results.items?.songs?.items?.map(item => ({
       url: item.url,
@@ -192,6 +199,7 @@ onUpdated(() => {
           :art="
             song.thumbnail || song.thumbnails[1]?.url || song.thumbnails[0]?.url
           "
+          @remove="removeSong"
           @open-song="
             $emit('play-urls', [
               {

src/components/SongItem.vue

@@ -48,20 +48,24 @@ const openSong = el => {
       emit('open-song', props.play);
   },
   Remove = () => {
-    // WIP
-
     const auth = useStore().getItem('auth');
 
-    if (auth) {
+    if (auth && confirm('Are you sure?')) {
       getJsonAuth('/user/playlists/remove', {
         method: 'POST',
         headers: {
           Authorization: auth,
         },
-        body: {
-          index,
+        body: JSON.stringify({
+          index: props.index,
           playlistId,
-        },
+        }),
+      }).then(json => {
+        console.log(json);
+
+        if (!json.error) {
+          if (json.message == 'ok') emit('remove', props.index);
+        } else alert(json.error);
       });
     }
   },

src/components/StatusBar.vue

@@ -47,7 +47,7 @@ function List() {
 function Save() {
   if (pl.value) {
     if (plRemote.value == true && store.auth) {
-      setAuthAddToPlaylist(data.state.url);
+      useAuthAddToPlaylist(pl.value, data.state.url);
     } else if (plRemote.value == false) {
       useUpdatePlaylist(
         pl.value,