From f503466a24755a890722b03a9b5b51173de5d2d7 Mon Sep 17 00:00:00 2001
From: Eliot Berriot <contact@eliotberriot.com>
Date: Tue, 20 Mar 2018 23:41:31 +0100
Subject: [PATCH] UI Polishing

---
 front/src/components/Sidebar.vue       | 6 ++++++
 front/src/components/library/Track.vue | 7 +++++++
 front/src/router/index.js              | 9 ++++++++-
 3 files changed, 21 insertions(+), 1 deletion(-)

diff --git a/front/src/components/Sidebar.vue b/front/src/components/Sidebar.vue
index 179ffedd73..f225313b6b 100644
--- a/front/src/components/Sidebar.vue
+++ b/front/src/components/Sidebar.vue
@@ -36,6 +36,12 @@
         <router-link class="item" v-else :to="{name: 'login'}"><i class="sign in icon"></i> Login</router-link>
         <router-link class="item" :to="{path: '/library'}"><i class="sound icon"> </i>Browse library</router-link>
         <router-link class="item" :to="{path: '/favorites'}"><i class="heart icon"></i> Favorites</router-link>
+        <a
+          @click="$store.commit('playlists/chooseTrack', null)"
+          v-if="$store.state.auth.authenticated"
+          class="item">
+          <i class="list icon"></i> Playlists
+        </a>
         <router-link
           v-if="$store.state.auth.authenticated"
           class="item" :to="{path: '/activity'}"><i class="bell icon"></i> Activity</router-link>
diff --git a/front/src/components/library/Track.vue b/front/src/components/library/Track.vue
index a40409615d..0437ac8815 100644
--- a/front/src/components/library/Track.vue
+++ b/front/src/components/library/Track.vue
@@ -24,6 +24,11 @@
 
           <play-button class="orange" :track="track">Play</play-button>
           <track-favorite-icon :track="track" :button="true"></track-favorite-icon>
+          <track-playlist-icon
+            :button="true"
+            v-if="$store.state.auth.authenticated"
+            :track="track"></track-playlist-icon>
+
           <a :href="wikipediaUrl" target="_blank" class="ui button">
             <i class="wikipedia icon"></i>
             Search on wikipedia
@@ -66,6 +71,7 @@ import logger from '@/logging'
 import backend from '@/audio/backend'
 import PlayButton from '@/components/audio/PlayButton'
 import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon'
+import TrackPlaylistIcon from '@/components/playlists/TrackPlaylistIcon'
 
 const FETCH_URL = 'tracks/'
 
@@ -73,6 +79,7 @@ export default {
   props: ['id'],
   components: {
     PlayButton,
+    TrackPlaylistIcon,
     TrackFavoriteIcon
   },
   data () {
diff --git a/front/src/router/index.js b/front/src/router/index.js
index 31bd0805cc..7cffb6f997 100644
--- a/front/src/router/index.js
+++ b/front/src/router/index.js
@@ -110,7 +110,14 @@ export default new Router({
         },
         { path: 'radios/build', name: 'library.radios.build', component: RadioBuilder, props: true },
         { path: 'radios/build/:id', name: 'library.radios.edit', component: RadioBuilder, props: true },
-        { path: 'playlists/:id', name: 'library.playlists.detail', component: PlaylistDetail, props: true },
+        {
+          path: 'playlists/:id',
+          name: 'library.playlists.detail',
+          component: PlaylistDetail,
+          props: (route) => ({
+            id: route.params.id,
+            defaultEdit: route.query.mode === 'edit' })
+        },
         { path: 'artists/:id', name: 'library.artists.detail', component: LibraryArtist, props: true },
         { path: 'albums/:id', name: 'library.albums.detail', component: LibraryAlbum, props: true },
         { path: 'tracks/:id', name: 'library.tracks.detail', component: LibraryTrack, props: true },
-- 
GitLab