Playlist: create navigation to the respective channel (#1347)

src/renderer/components/playlist-info/playlist-info.css

@@ -8,12 +8,14 @@
 
 .playlistChannel {
   height: 70px;
+
+  /* Indicates the box can be clicked to navigate */
+  cursor: pointer;
 }
 
 .playlistChannel img {
   width: 70px;
   float: left;
-  cursor: pointer;
   border-radius: 200px 200px 200px 200px;
   -webkit-border-radius: 200px 200px 200px 200px;
 }
@@ -21,7 +23,6 @@
 .playlistChannel h3 {
   float: left;
   position: relative;
-  cursor: pointer;
   width: 200px;
   margin-left: 10px;
   top: 5px;

src/renderer/components/playlist-info/playlist-info.js

@@ -76,6 +76,7 @@ export default Vue.extend({
     this.title = this.data.title
     this.channelName = this.data.channelName
     this.channelThumbnail = this.data.channelThumbnail
+    this.channelId = this.data.channelId
     this.uploadedTime = this.data.uploaded_at
     this.description = this.data.description
     this.infoSource = this.data.infoSource
@@ -112,6 +113,10 @@ export default Vue.extend({
       }
     },
 
+    goToChannel: function () {
+      this.$router.push({ path: `/channel/${this.channelId}` })
+    },
+
     ...mapActions([
       'openExternalLink'
     ])

src/renderer/components/playlist-info/playlist-info.vue

@@ -23,6 +23,7 @@
     <hr>
     <div
       class="playlistChannel"
+      @click="goToChannel"
     >
       <img :src="channelThumbnail">
       <h3>