[web] Fix playlist save not working

web-src/src/components/ListTracks.vue

@@ -13,7 +13,11 @@
       :class="{ 'with-progress': show_progress }"
       @click="play(item.item)"
     >
-      <mdicon v-if="show_icon" class="media-left icon" name="file-outline" />
+      <mdicon
+        v-if="show_icon"
+        class="media-left icon"
+        name="file-music-outline"
+      />
       <div class="media-content">
         <div
           class="is-size-6 has-text-weight-bold"

web-src/src/components/ModalDialogPlaylistSave.vue

@@ -20,7 +20,7 @@
               :disabled="loading"
               @input="check_name"
             />
-            <mdicon class="icon is-left" name="file-music" size="16" />
+            <mdicon class="icon is-left" name="playlist-music" size="16" />
           </p>
         </div>
       </form>
@@ -44,22 +44,24 @@ export default {
       playlist_name: ''
     }
   },
-  actions() {
-    if (loading) {
-      return [{ label: this.$t('dialog.playlist.save.saving'), icon: 'web' }]
-    }
-    return [
-      {
-        label: this.$t('dialog.playlist.save.cancel'),
-        handler: this.cancel,
-        icon: 'cancel'
-      },
-      {
-        label: this.$t('dialog.playlist.save.save'),
-        handler: this.save,
-        icon: 'save'
+  computed: {
+    actions() {
+      if (this.loading) {
+        return [{ label: this.$t('dialog.playlist.save.saving'), icon: 'web' }]
       }
-    ]
+      return [
+        {
+          label: this.$t('dialog.playlist.save.cancel'),
+          handler: this.cancel,
+          icon: 'cancel'
+        },
+        {
+          label: this.$t('dialog.playlist.save.save'),
+          handler: this.save,
+          icon: 'download'
+        }
+      ]
+    }
   },
   watch: {
     show() {

web-src/src/icons.js

@@ -15,15 +15,14 @@ import {
   mdiChevronLeft,
   mdiChevronUp,
   mdiClose,
-  mdiContentSave,
   mdiDelete,
   mdiDeleteEmpty,
   mdiDotsHorizontal,
   mdiDotsVertical,
+  mdiDownload,
   mdiDragHorizontal,
   mdiFastForward30,
-  mdiFileMusic,
-  mdiFileOutline,
+  mdiFileMusicOutline,
   mdiFire,
   mdiFolder,
   mdiFolderOpen,
@@ -39,6 +38,7 @@ import {
   mdiPencil,
   mdiPipe,
   mdiPlay,
+  mdiPlaylistMusic,
   mdiPlaylistPlay,
   mdiPlaylistPlus,
   mdiRadio,
@@ -81,15 +81,14 @@ export const icons = {
   mdiChevronLeft,
   mdiChevronUp,
   mdiClose,
-  mdiContentSave,
   mdiDelete,
   mdiDeleteEmpty,
   mdiDotsHorizontal,
   mdiDotsVertical,
+  mdiDownload,
   mdiDragHorizontal,
   mdiFastForward30,
-  mdiFileMusic,
-  mdiFileOutline,
+  mdiFileMusicOutline,
   mdiFire,
   mdiFolder,
   mdiFolderOpen,
@@ -105,6 +104,7 @@ export const icons = {
   mdiPencil,
   mdiPipe,
   mdiPlay,
+  mdiPlaylistMusic,
   mdiPlaylistPlay,
   mdiPlaylistPlus,
   mdiRadio,

web-src/src/pages/PageQueue.vue

@@ -48,7 +48,7 @@
             :disabled="queue_items.length === 0"
             @click="save_dialog"
           >
-            <mdicon class="icon" name="content-save" size="16" />
+            <mdicon class="icon" name="download" size="16" />
             <span v-text="$t('page.queue.save')" />
           </button>
         </div>

web-src/src/stores/configuration.js

@@ -4,6 +4,8 @@ export const useConfigurationStore = defineStore('ConfigurationStore', {
   state: () => ({
     buildoptions: [],
     version: '',
-    websocket_port: 0
+    websocket_port: 0,
+    allow_modifying_stored_playlists: false,
+    default_playlist_directory: ''
   })
 })