fix go to channel or playlist

src/components/ChannelPage.vue

@@ -35,7 +35,7 @@
             <font-awesome-icon icon="rss" />
         </a>
 
-        <WatchOnYouTubeButton :link="`https://youtube.com/channel/${this.channel.id}`" />
+        <WatchOnYouTubeButton :id="`${this.channel.id}`" :type="'channel'" />
 
         <div class="flex mt-4 mb-2">
             <button

src/components/PlaylistPage.vue

@@ -23,7 +23,7 @@
                 <a class="btn mr-1" :href="getRssUrl">
                     <font-awesome-icon icon="rss" />
                 </a>
-                <WatchOnYouTubeButton :link="`https://www.youtube.com/playlist?list=${this.$route.query.list}`" />
+                <WatchOnYouTubeButton :id="`${this.$route.query.list}`" :type="'playlist'" />
             </div>
         </div>
 

src/components/WatchOnYouTubeButton.vue

@@ -1,21 +1,34 @@
 <script>
 export default {
     props: {
-        videoId: String,
+        id: String, // The id of the content.
-        currentTime: Number,
+        type: String, // The type of the content (video, channel, playlist).
-        playlistId: String,
+
-        playlistIndex: String,
+        // The below parameters are only evaluated if `type` is video.
+        videoTimestamp: Number,
+        videoPlaylistId: String,
+        videoPlaylistIndex: Number,
     },
 
     computed: {
         generatedLink() {
-            let url = `https://youtu.be/watch?v=${this.videoId}`;
+            switch (String(this.type)) {
-            if (this.playlistId != undefined) {
+                case "video": {
-                // If this.playlistId is defined then this.playlistIndex is too.
+                    let url = `https://youtu.be/watch?v=${this.id}`;
-                url += `&list=${this.playlistId}&index=${this.playlistIndex}`;
+                    if (this.videoPlaylistId != undefined) {
+                        // If the playlist id is defined then the playlist index is too.
+                        url += `&list=${this.videoPlaylistId}&index=${this.videoPlaylistIndex}`;
                     }
-            url += `&t=${parseInt(this.currentTime)}`;
+                    url += `&t=${parseInt(this.videoTimestamp)}`;
                     return url;
+                }
+                case "playlist":
+                    return `https://youtu.be/playlist?list=${this.id}`;
+                case "channel":
+                    return `https://youtu.be/channel/${this.id}`;
+                default:
+                    return `https://youtu.be/${this.id}`;
+            }
         },
     },
 };

src/components/WatchVideo.vue

@@ -109,10 +109,11 @@
                             <font-awesome-icon icon="rss" />
                         </a>
                         <WatchOnYouTubeButton
-                            :video-id="getVideoId()"
+                            :id="getVideoId()"
-                            :current-time="currentTime"
+                            :type="'video'"
-                            :playlist-id="playlistId"
+                            :videoTimestamp="currentTime"
-                            :playlist-index="index"
+                            :videoPlaylistId="playlistId"
+                            :videoPlaylistIndex="index"
                         />
                         <!-- Share Dialog -->
                         <button class="btn" @click="showShareModal = !showShareModal">