From 637f648fc7924756868e452f547b23a43db8bd9d Mon Sep 17 00:00:00 2001
From: Cadence Ember <cadence@disroot.org>
Date: Tue, 29 Dec 2020 23:07:23 +1300
Subject: [PATCH] Show watched state on channel videos

---
 api/channels.js                       |  7 +++++++
 sass/includes/subscriptions-page.sass |  7 -------
 sass/includes/video-list-item.sass    | 11 +++++++++++
 3 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/api/channels.js b/api/channels.js
index a520b21..444076f 100644
--- a/api/channels.js
+++ b/api/channels.js
@@ -12,6 +12,13 @@ module.exports = [
 			const data = await fetchChannel(id, settings.instance)
 			const subscribed = user.isSubscribed(id)
 			const instanceOrigin = settings.instance
+			// apply watched status
+			const watchedVideos = user.getWatchedVideos()
+			if (data.latestVideos) {
+				data.latestVideos.forEach(video => {
+					video.watched = watchedVideos.includes(video.videoId)
+				})
+			}
 			return render(200, "pug/channel.pug", {data, subscribed, instanceOrigin})
 		}
 	}
diff --git a/sass/includes/subscriptions-page.sass b/sass/includes/subscriptions-page.sass
index 616acdb..e10489d 100644
--- a/sass/includes/subscriptions-page.sass
+++ b/sass/includes/subscriptions-page.sass
@@ -39,10 +39,3 @@
 
 #watched-videos-display:checked ~ .video-list-item--watched
   display: none
-
-.video-list-item--watched
-  background: c.$bg-darker
-  padding: 8px 8px 0px
-
-  .thumbnail .image
-    opacity: 0.4
diff --git a/sass/includes/video-list-item.sass b/sass/includes/video-list-item.sass
index cc77666..7df66b7 100644
--- a/sass/includes/video-list-item.sass
+++ b/sass/includes/video-list-item.sass
@@ -16,6 +16,17 @@
   align-content: start
   margin-bottom: 12px
 
+  @at-root .video-list-item--watched#{&}
+    background: c.$bg-darker
+    padding: 8px 8px 0px
+    margin: -8px -8px 12px
+
+    .thumbnail
+      margin-bottom: 8px
+
+    .image
+      opacity: 0.4
+
   .thumbnail
     position: relative
     display: flex