From 86773ebcf611e7f271a2c5d47833a05118a61c68 Mon Sep 17 00:00:00 2001
From: Bnyro <bnyro@tutanota.com>
Date: Sat, 14 Oct 2023 13:48:23 +0200
Subject: [PATCH] feat: support for 'watch_videos' endpoint

---
 src/components/CommentItem.vue |  2 +-
 src/components/WatchVideo.vue  | 19 +++++++++++++++++--
 src/router/router.js           |  5 +++++
 3 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/src/components/CommentItem.vue b/src/components/CommentItem.vue
index ff06ac6b..56519794 100644
--- a/src/components/CommentItem.vue
+++ b/src/components/CommentItem.vue
@@ -34,7 +34,7 @@
                 <div class="i-fa6-solid:thumbs-up" />
                 <span v-text="numberFormat(comment.likeCount)" />
                 <font-awesome-icon v-if="comment.hearted" icon="heart" />
-                <img v-if="comment.creatorReplied" :src="uploaderAvatarUrl" class="w-5 h-5 rounded-full" />
+                <img v-if="comment.creatorReplied" :src="uploaderAvatarUrl" class="h-5 w-5 rounded-full" />
             </div>
             <template v-if="comment.repliesPage && (!loadingReplies || !showingReplies)">
                 <div class="cursor-pointer" @click="loadReplies">
diff --git a/src/components/WatchVideo.vue b/src/components/WatchVideo.vue
index f80ba97c..eaa8e226 100644
--- a/src/components/WatchVideo.vue
+++ b/src/components/WatchVideo.vue
@@ -648,6 +648,12 @@ export default {
             }
         },
         getVideoId() {
+            if (this.$route.query.video_ids) {
+                const videos_list = this.$route.query.video_ids.split(",");
+                this.index = Number(this.$route.query.index ?? 0);
+                return videos_list[this.index];
+            }
+
             return this.$route.query.v || this.$route.params.v;
         },
         navigate(time) {
@@ -687,7 +693,15 @@ export default {
         },
         navigateNext() {
             const params = this.$route.query;
-            let url = this.playlist?.relatedStreams?.[this.index]?.url ?? this.video.relatedStreams[0].url;
+            const video_ids = this.$route.query.video_ids?.split(",") ?? [];
+            let url;
+            if (this.playlist) {
+                url = this.playlist?.relatedStreams?.[this.index]?.url ?? this.video.relatedStreams[0].url;
+            } else if (video_ids.length > this.index + 1) {
+                url = `${this.$route.path}?index=${this.index + 1}`;
+            } else {
+                url = this.video.relatedStreams[0].url;
+            }
             const searchParams = new URLSearchParams();
             for (var param in params)
                 switch (param) {
@@ -695,7 +709,8 @@ export default {
                     case "t":
                         break;
                     case "index":
-                        if (this.index < this.playlist.relatedStreams.length) searchParams.set("index", this.index + 1);
+                        if (this.playlist && this.index < this.playlist.relatedStreams.length)
+                            searchParams.set("index", this.index + 1);
                         break;
                     case "list":
                         if (this.index < this.playlist.relatedStreams.length) searchParams.set("list", params.list);
diff --git a/src/router/router.js b/src/router/router.js
index 26cfa9f0..3d0be255 100644
--- a/src/router/router.js
+++ b/src/router/router.js
@@ -31,6 +31,11 @@ const routes = [
         name: "WatchVideo",
         component: () => import("../components/WatchVideo.vue"),
     },
+    {
+        path: "/watch_videos",
+        name: "WatchVideos",
+        component: () => import("../components/WatchVideo.vue"),
+    },
     {
         path: "/clip/:clipId",
         name: "Clips",