From fbe9a0c0f228cb07da9a2ee502d59cbe7fdeb3a3 Mon Sep 17 00:00:00 2001
From: syeopite <syeopite@syeopite.dev>
Date: Sat, 8 May 2021 06:07:30 -0700
Subject: [PATCH] Add content sections to trending feed

---
 assets/css/default.css           | 17 ++++++++++++++++
 src/invidious/channels.cr        |  2 +-
 src/invidious/trending.cr        |  2 +-
 src/invidious/views/trending.ecr | 33 +++++++++++++++++++++++++++++---
 4 files changed, 49 insertions(+), 5 deletions(-)

diff --git a/assets/css/default.css b/assets/css/default.css
index 444905c55..3434404e7 100644
--- a/assets/css/default.css
+++ b/assets/css/default.css
@@ -600,3 +600,20 @@ hr {
     display: none;
   }
 }
+
+.category {
+  margin: 3em 0px 4em 0px;
+}
+
+.category .heading > p {
+  display: inline-block;
+}
+
+.category .badge.featured {
+  background: #005aa7;
+  color: white;
+  padding: 3px 4px 1px 4px;
+  border-radius: 5px;
+  font-size: 14px;
+  margin-left: 10px;
+}
\ No newline at end of file
diff --git a/src/invidious/channels.cr b/src/invidious/channels.cr
index 768e81984..082fc5874 100644
--- a/src/invidious/channels.cr
+++ b/src/invidious/channels.cr
@@ -380,7 +380,7 @@ def fetch_channel_playlists(ucid, author, continuation, sort_by)
   return items, continuation
 end
 
-def fetch_channel_featured_channels(ucid, tab_data, view = nil, shelf_id = nil, continuation = nil, query_title = nil) : {Array(Category), (String|Nil)}
+def fetch_channel_featured_channels(ucid, tab_data, view = nil, shelf_id = nil, continuation = nil, query_title = nil) : {Array(Category), (String | Nil)}
   auxiliary_data = {} of String => String
 
   if continuation.is_a?(String)
diff --git a/src/invidious/trending.cr b/src/invidious/trending.cr
index 910a99d85..f4eb673e6 100644
--- a/src/invidious/trending.cr
+++ b/src/invidious/trending.cr
@@ -27,7 +27,7 @@ def fetch_trending(trending_type, region, locale)
   end
 
   initial_data = extract_initial_data(trending)
-  trending = extract_videos(initial_data)
+  trending = extract_items(initial_data)
 
   return {trending, plid}
 end
diff --git a/src/invidious/views/trending.ecr b/src/invidious/views/trending.ecr
index 51ea0df59..c75c992ff 100644
--- a/src/invidious/views/trending.ecr
+++ b/src/invidious/views/trending.ecr
@@ -37,9 +37,36 @@
 </div>
 
 <div class="pure-g">
-    <% trending.each_slice(4) do |slice| %>
-            <% slice.each do |item| %>
-                <%= rendered "components/item" %>
+    <% trending.each do |category| %>
+        <% if category.is_a? Category %>
+            <%# We don't need to differinate between a category that only
+            # contains videos and no metadata %>
+            <% if category.title.empty? %>
+                <% category.contents.each do |item| %>
+                    <%= rendered "components/item" %>
+                <% end %>
+            <% else %>
+                <div class="category pure-u-1">
+                    <div class="category-heading h-box">
+                        <p> <%= category.title %> </p>
+                        <% if (badges = category.badges).is_a? Array %>
+                            <% badges.each do | badge |%>
+                                <% if badge[0] == "BADGE_STYLE_TYPE_FEATURED" %>
+                                    <div class="badge featured">
+                                        <span> <%=badge[1] %><span>
+                                    </div>
+                                <% end %>
+                            <% end %>
+                        <% end %>
+                    </div>
+
+                    <div class="pure-g">
+                        <% category.contents.each do |item| %>
+                            <%= rendered "components/item" %>
+                        <% end %>
+                    </div> 
+                </div>
             <% end %>
+        <% end %>
     <% end %>
 </div>