From 99e0cfe6bbda7aa7491cac241c23a4b5d6ff79d2 Mon Sep 17 00:00:00 2001
From: chme <christian.meffert@googlemail.com>
Date: Sun, 17 Feb 2019 11:33:23 +0100
Subject: [PATCH] [web-src] Fix error following genre links (add missing url
 encoding of genre name in url)

---
 web-src/src/components/ModalDialogQueueItem.vue | 2 +-
 web-src/src/components/ModalDialogTrack.vue     | 8 ++++++--
 web-src/src/pages/PageGenre.vue                 | 2 +-
 web-src/src/pages/PageGenreTracks.vue           | 2 +-
 4 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/web-src/src/components/ModalDialogQueueItem.vue b/web-src/src/components/ModalDialogQueueItem.vue
index 7f708f5c..c960adeb 100644
--- a/web-src/src/components/ModalDialogQueueItem.vue
+++ b/web-src/src/components/ModalDialogQueueItem.vue
@@ -98,7 +98,7 @@ export default {
     },
 
     open_genre: function () {
-      this.$router.push({ path: '/music/genres/' + this.item.genre })
+      this.$router.push({ name: 'Genre', params: { genre: this.item.name } })
     }
   }
 }
diff --git a/web-src/src/components/ModalDialogTrack.vue b/web-src/src/components/ModalDialogTrack.vue
index 73db078d..ddfbee17 100644
--- a/web-src/src/components/ModalDialogTrack.vue
+++ b/web-src/src/components/ModalDialogTrack.vue
@@ -37,9 +37,9 @@
                   <span class="heading">Year</span>
                   <span class="title is-6">{{ track.year }}</span>
                 </p>
-                <p>
+                <p v-if="track.genre">
                   <span class="heading">Genre</span>
-                  <span class="title is-6">{{ track.genre }}</span>
+                  <a class="title is-6 has-text-link" @click="open_genre">{{ track.genre }}</a>
                 </p>
                 <p>
                   <span class="heading">Track / Disc</span>
@@ -131,6 +131,10 @@ export default {
       this.$router.push({ path: '/music/artists/' + this.track.album_artist_id })
     },
 
+    open_genre: function () {
+      this.$router.push({ name: 'Genre', params: { genre: this.track.genre } })
+    },
+
     mark_new: function () {
       webapi.library_track_update(this.track.id, { 'play_count': 'reset' }).then(() => {
         this.$emit('play_count_changed')
diff --git a/web-src/src/pages/PageGenre.vue b/web-src/src/pages/PageGenre.vue
index 6e055cf7..fb0a078d 100644
--- a/web-src/src/pages/PageGenre.vue
+++ b/web-src/src/pages/PageGenre.vue
@@ -72,7 +72,7 @@ export default {
   methods: {
     open_tracks: function () {
       this.show_details_modal = false
-      this.$router.push({ path: '/music/genres/' + this.name + '/tracks' })
+      this.$router.push({ name: 'GenreTracks', params: { genre: this.name } })
     },
 
     play: function () {
diff --git a/web-src/src/pages/PageGenreTracks.vue b/web-src/src/pages/PageGenreTracks.vue
index f5734f8e..9f2660ab 100644
--- a/web-src/src/pages/PageGenreTracks.vue
+++ b/web-src/src/pages/PageGenreTracks.vue
@@ -71,7 +71,7 @@ export default {
   methods: {
     open_genre: function () {
       this.show_details_modal = false
-      this.$router.push({ path: '/music/genres/' + this.genre })
+      this.$router.push({ name: 'Genre', params: { genre: this.genre } })
     },
 
     play: function () {