From 78b6adeb5e83883b43d5a49dc7688bba354c72db Mon Sep 17 00:00:00 2001
From: PikachuEXE <pikachuexe@gmail.com>
Date: Tue, 15 Jun 2021 22:18:08 +0800
Subject: [PATCH] Playlist: create navigation to the respective channel (#1347)

---
 src/renderer/components/playlist-info/playlist-info.css | 5 +++--
 src/renderer/components/playlist-info/playlist-info.js  | 5 +++++
 src/renderer/components/playlist-info/playlist-info.vue | 1 +
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/renderer/components/playlist-info/playlist-info.css b/src/renderer/components/playlist-info/playlist-info.css
index 03de7d86..a848c049 100644
--- a/src/renderer/components/playlist-info/playlist-info.css
+++ b/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;
diff --git a/src/renderer/components/playlist-info/playlist-info.js b/src/renderer/components/playlist-info/playlist-info.js
index 7df785e4..ec916a89 100644
--- a/src/renderer/components/playlist-info/playlist-info.js
+++ b/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'
     ])
diff --git a/src/renderer/components/playlist-info/playlist-info.vue b/src/renderer/components/playlist-info/playlist-info.vue
index 2bfa4577..889dfefa 100644
--- a/src/renderer/components/playlist-info/playlist-info.vue
+++ b/src/renderer/components/playlist-info/playlist-info.vue
@@ -23,6 +23,7 @@
     <hr>
     <div
       class="playlistChannel"
+      @click="goToChannel"
     >
       <img :src="channelThumbnail">
       <h3>