diff --git a/front/src/components/audio/album/Card.vue b/front/src/components/audio/album/Card.vue
index db6e8de6bba8e8ece4f4d761ae1466e9be113435..1012cc578fefb876caa7cbf9049387f90d32e208 100644
--- a/front/src/components/audio/album/Card.vue
+++ b/front/src/components/audio/album/Card.vue
@@ -20,7 +20,7 @@
<tbody>
<tr v-for="track in tracks">
<td class="play-cell">
- <play-button :class="['basic', {orange: isPlaying && track.id === currentTrack.id}, 'icon']" :discrete="true" :track="track"></play-button>
+ <play-button :class="['basic', {orange: currentTrack && isPlaying && track.id === currentTrack.id}, 'icon']" :discrete="true" :track="track"></play-button>
</td>
<td class="content-cell" colspan="5">
<track-favorite-icon :track="track"></track-favorite-icon>
diff --git a/front/src/components/audio/track/Row.vue b/front/src/components/audio/track/Row.vue
index 90d0579603472b18f760c6902fa68309148f756c..624467f211855c73722f12eccf03cc8e4b684492 100644
--- a/front/src/components/audio/track/Row.vue
+++ b/front/src/components/audio/track/Row.vue
@@ -1,7 +1,7 @@
<template>
<tr>
<td>
- <play-button :class="['basic', {orange: isPlaying && track.id === currentTrack.id}, 'icon']" :discrete="true" :is-playable="playable" :track="track"></play-button>
+ <play-button :class="['basic', {orange: currentTrack && isPlaying && track.id === currentTrack.id}, 'icon']" :discrete="true" :is-playable="playable" :track="track"></play-button>
</td>
<td>
<img class="ui mini image" v-if="track.album.cover.original" v-lazy="$store.getters['instance/absoluteUrl'](track.album.cover.small_square_crop)">