diff --git a/src/library/album/AlbumDetails.vue b/src/library/album/AlbumDetails.vue
index 67d3257..3a68739 100644
--- a/src/library/album/AlbumDetails.vue
+++ b/src/library/album/AlbumDetails.vue
@@ -13,7 +13,11 @@
             {{ album.artist }}
           </router-link>
           <span v-if="album.year"> • {{ album.year }}</span>
-          <span v-if="album.genre"> • {{ album.genre }}</span>
+          <span v-if="album.genreId"> •
+            <router-link :to="{name: 'genre', params: { id: album.genreId }}">
+              {{ album.genreId }}
+            </router-link>
+          </span>
         </p>
         <div class="text-nowrap">
           <b-button variant="secondary" class="mr-2" @click="play">
diff --git a/src/shared/api.ts b/src/shared/api.ts
index 5c308cd..9269e1c 100644
--- a/src/shared/api.ts
+++ b/src/shared/api.ts
@@ -29,7 +29,7 @@ export interface Album {
   artistId: string
   year: number
   starred: boolean
-  genre?: string
+  genreId?: string
   image?: string
   tracks?: Track[]
 }
@@ -376,7 +376,7 @@ export class API {
       image: this.getCoverArtUrl(item),
       year: item.year || 0,
       starred: !!item.starred,
-      genre: item.genre,
+      genreId: item.genre,
       tracks: (item.song || []).map(this.normalizeTrack, this)
     }
   }