refactor(vue3-router): remove deprecated tag prop

frontend/src/components/Layout/Artist/ArtistTab.vue

@@ -13,10 +13,14 @@
                   {{ release.ProductionYear }}
                 </div>
                 <router-link
-                  class="link font-weight-bold text-h6 text-md-h4"
-                  tag="h2"
-                  :to="getItemDetailsLink(release)">
-                  {{ release.Name }}
+                  v-slot="{ navigate }"
+                  :to="getItemDetailsLink(release)"
+                  custom>
+                  <h2
+                    class="link font-weight-bold text-h6 text-md-h4"
+                    @click="navigate">
+                    {{ release.Name }}
+                  </h2>
                 </router-link>
               </v-col>
             </v-row>

frontend/src/components/Layout/AudioControls.vue

@@ -28,10 +28,14 @@
             <v-col class="d-flex flex-column justify-center ml-4">
               <v-row class="align-end">
                 <router-link
-                  tag="span"
-                  class="text-truncate link height-fit-content"
-                  :to="getItemDetailsLink(playbackManager.currentItem)">
-                  {{ playbackManager.currentItem.Name }}
+                  v-slot="{ navigate }"
+                  :to="getItemDetailsLink(playbackManager.currentItem)"
+                  custom>
+                  <span
+                    class="text-truncate link height-fit-content"
+                    @click="navigate">
+                    {{ playbackManager.currentItem.Name }}
+                  </span>
                 </router-link>
               </v-row>
               <v-row
@@ -39,14 +43,17 @@
                 class="align-start">
                 <span
                   v-for="artist in playbackManager.currentItem.ArtistItems"
-                  :key="`artist-${artist.Id}`"
-                  :to="getItemDetailsLink(artist, 'MusicArtist')">
+                  :key="`artist-${artist.Id}`">
                   <p class="mb-0 mr-2">
                     <router-link
-                      tag="span"
-                      class="text--secondary text-caption text-truncate link"
-                      :to="getItemDetailsLink(artist, 'MusicArtist')">
-                      {{ artist.Name }}
+                      v-slot="{ navigate }"
+                      :to="getItemDetailsLink(artist, 'MusicArtist')"
+                      custom>
+                      <span
+                        class="text--secondary text-caption text-truncate link"
+                        @click="navigate">
+                        {{ artist.Name }}
+                      </span>
                     </router-link>
                   </p>
                 </span>

frontend/src/components/Playback/TrackList.vue

@@ -55,14 +55,18 @@
                       !track.Artists.includes(track.AlbumArtist)
                     "
                     class="ml-3">
-                    <router-link
+                    <template
                       v-for="artist of track.ArtistItems"
-                      :key="artist.Id"
-                      tag="span"
-                      class="link text--secondary"
-                      :to="getItemDetailsLink(artist, 'MusicArtist')">
-                      {{ artist.Name }}
-                    </router-link>
+                      :key="artist.Id">
+                      <router-link
+                        v-slot="{ navigate }"
+                        :to="getItemDetailsLink(artist, 'MusicArtist')"
+                        custom>
+                        <span class="link text--secondary" @click="navigate">
+                          {{ artist.Name }}
+                        </span>
+                      </router-link>
+                    </template>
                   </div>
                   <v-spacer />
                   <item-menu v-show="hover" :item="item" />