diff --git a/web-src/src/components/ListAlbums.vue b/web-src/src/components/ListAlbums.vue
index 229e3aba..1bb1365b 100644
--- a/web-src/src/components/ListAlbums.vue
+++ b/web-src/src/components/ListAlbums.vue
@@ -2,7 +2,7 @@
   <template v-for="item in items" :key="item.itemId">
     <div v-if="!item.isItem" class="mt-6 mb-5 py-2">
       <span
-        :id="'index_' + item.index"
+        :id="`index_${item.index}`"
         class="tag is-info is-light is-small has-text-weight-bold"
         v-text="item.index"
       />
@@ -40,16 +40,16 @@
   <teleport to="#app">
     <modal-dialog-album
       :item="selected_item"
-      :show="show_details_modal"
       :media_kind="media_kind"
+      :show="show_details_modal"
+      @close="show_details_modal = false"
       @remove-podcast="open_remove_podcast_dialog()"
       @play-count-changed="play_count_changed()"
-      @close="show_details_modal = false"
     />
     <modal-dialog
+      :delete_action="$t('page.podcast.remove')"
       :show="show_remove_podcast_modal"
       :title="$t('page.podcast.remove-podcast')"
-      :delete_action="$t('page.podcast.remove')"
       @close="show_remove_podcast_modal = false"
       @delete="remove_podcast"
     >
diff --git a/web-src/src/components/ListArtists.vue b/web-src/src/components/ListArtists.vue
index 2a8ab154..c289316b 100644
--- a/web-src/src/components/ListArtists.vue
+++ b/web-src/src/components/ListArtists.vue
@@ -3,7 +3,7 @@
     <div v-if="!item.isItem" class="mt-6 mb-5 py-2">
       <div class="media-content is-clipped">
         <span
-          :id="'index_' + item.index"
+          :id="`index_${item.index}`"
           class="tag is-info is-light is-small has-text-weight-bold"
           v-text="item.index"
         />
diff --git a/web-src/src/components/ListComposers.vue b/web-src/src/components/ListComposers.vue
index f6d5cc5d..981e9bfd 100644
--- a/web-src/src/components/ListComposers.vue
+++ b/web-src/src/components/ListComposers.vue
@@ -3,7 +3,7 @@
     <div v-if="!item.isItem" class="mt-6 mb-5 py-2">
       <div class="media-content is-clipped">
         <span
-          :id="'index_' + item.index"
+          :id="`index_${item.index}`"
           class="tag is-info is-light is-small has-text-weight-bold"
           v-text="item.index"
         />
diff --git a/web-src/src/components/ListGenres.vue b/web-src/src/components/ListGenres.vue
index 1d575c96..c2234104 100644
--- a/web-src/src/components/ListGenres.vue
+++ b/web-src/src/components/ListGenres.vue
@@ -3,7 +3,7 @@
     <div v-if="!item.isItem" class="mt-6 mb-5 py-2">
       <div class="media-content is-clipped">
         <span
-          :id="'index_' + item.index"
+          :id="`index_${item.index}`"
           class="tag is-info is-light is-small has-text-weight-bold"
           v-text="item.index"
         />
diff --git a/web-src/src/components/ListTracks.vue b/web-src/src/components/ListTracks.vue
index 7350fe42..e21ee3df 100644
--- a/web-src/src/components/ListTracks.vue
+++ b/web-src/src/components/ListTracks.vue
@@ -2,7 +2,7 @@
   <template v-for="item in items" :key="item.itemId">
     <div v-if="!item.isItem" class="mt-6 mb-5 py-2">
       <span
-        :id="'index_' + item.index"
+        :id="`index_${item.index}`"
         class="tag is-info is-light is-small has-text-weight-bold"
         v-text="item.index"
       />
diff --git a/web-src/src/components/ModalDialogAlbum.vue b/web-src/src/components/ModalDialogAlbum.vue
index 02a40618..6c33d34b 100644
--- a/web-src/src/components/ModalDialogAlbum.vue
+++ b/web-src/src/components/ModalDialogAlbum.vue
@@ -66,10 +66,7 @@
                 <span
                   class="title is-6"
                   v-text="
-                    [
-                      $t('media.kind.' + item.media_kind),
-                      $t('data.kind.' + item.data_kind)
-                    ].join(' - ')
+                    `${$t(`media.kind.${item.media_kind}`)} - ${$t(`data.kind.${item.data_kind}`)}`
                   "
                 />
               </p>
diff --git a/web-src/src/components/ModalDialogPlaylist.vue b/web-src/src/components/ModalDialogPlaylist.vue
index 8791b554..58fd6f9a 100644
--- a/web-src/src/components/ModalDialogPlaylist.vue
+++ b/web-src/src/components/ModalDialogPlaylist.vue
@@ -17,7 +17,7 @@
                 <span class="heading" v-text="$t('dialog.playlist.type')" />
                 <span
                   class="title is-6"
-                  v-text="$t('playlist.type.' + item.type)"
+                  v-text="$t(`playlist.type.${item.type}`)"
                 />
               </p>
               <p v-if="!item.folder">
diff --git a/web-src/src/components/ModalDialogQueueItem.vue b/web-src/src/components/ModalDialogQueueItem.vue
index 923a013e..469cce10 100644
--- a/web-src/src/components/ModalDialogQueueItem.vue
+++ b/web-src/src/components/ModalDialogQueueItem.vue
@@ -75,10 +75,7 @@
                 <span class="title is-6">
                   <span
                     v-text="
-                      [
-                        $t('media.kind.' + item.media_kind),
-                        $t('data.kind.' + item.data_kind)
-                      ].join(' - ')
+                      `${$t(`media.kind.${item.media_kind}`)} - ${$t(`data.kind.${item.data_kind}`)}`
                     "
                   />
                 </span>
@@ -192,7 +189,6 @@ export default {
         })
       }
     },
-
     open_album_artist() {
       if (this.item.data_kind === 'spotify') {
         this.$router.push({
@@ -214,7 +210,6 @@ export default {
         })
       }
     },
-
     open_genre() {
       this.$router.push({
         name: 'genre-albums',
@@ -222,12 +217,10 @@ export default {
         query: { media_kind: this.item.media_kind }
       })
     },
-
     play() {
       this.$emit('close')
       webapi.player_play({ item_id: this.item.id })
     },
-
     remove() {
       this.$emit('close')
       webapi.queue_remove(this.item.id)
diff --git a/web-src/src/components/ModalDialogTrack.vue b/web-src/src/components/ModalDialogTrack.vue
index 31448c45..116ad8d8 100644
--- a/web-src/src/components/ModalDialogTrack.vue
+++ b/web-src/src/components/ModalDialogTrack.vue
@@ -90,10 +90,7 @@
                 <span class="title is-6">
                   <span
                     v-text="
-                      [
-                        $t('media.kind.' + item.media_kind),
-                        $t('data.kind.' + item.data_kind)
-                      ].join(' - ')
+                      `${$t(`media.kind.${item.media_kind}`)} - ${$t(`data.kind.${item.data_kind}`)}`
                     "
                   />
                 </span>
diff --git a/web-src/src/components/PlayerButtonPlayPause.vue b/web-src/src/components/PlayerButtonPlayPause.vue
index 88df9b36..201d3469 100644
--- a/web-src/src/components/PlayerButtonPlayPause.vue
+++ b/web-src/src/components/PlayerButtonPlayPause.vue
@@ -3,7 +3,7 @@
     <mdicon
       :name="icon_name"
       :size="icon_size"
-      :title="$t('player.button.' + icon_name)"
+      :title="$t(`player.button.${icon_name}`)"
     />
   </a>
 </template>
diff --git a/web-src/src/components/PlayerButtonRepeat.vue b/web-src/src/components/PlayerButtonRepeat.vue
index 04b32fab..271be0e5 100644
--- a/web-src/src/components/PlayerButtonRepeat.vue
+++ b/web-src/src/components/PlayerButtonRepeat.vue
@@ -4,7 +4,7 @@
       class="icon"
       :name="icon_name"
       :size="icon_size"
-      :title="$t('player.button.' + icon_name)"
+      :title="$t(`player.button.${icon_name}`)"
     />
   </a>
 </template>
diff --git a/web-src/src/components/PlayerButtonShuffle.vue b/web-src/src/components/PlayerButtonShuffle.vue
index b30d5902..09621f4c 100644
--- a/web-src/src/components/PlayerButtonShuffle.vue
+++ b/web-src/src/components/PlayerButtonShuffle.vue
@@ -4,7 +4,7 @@
       class="icon"
       :name="icon_name"
       :size="icon_size"
-      :title="$t('player.button.' + icon_name)"
+      :title="$t(`player.button.${icon_name}`)"
     />
   </a>
 </template>