Add 'playlists' tab to channel page

src/invidious.cr

@@ -2374,7 +2374,6 @@ get "/channel/:ucid" do |env|
   continuation = env.params.query["continuation"]?
 
   sort_by = env.params.query["sort_by"]?.try &.downcase
-  sort_by ||= "newest"
 
   begin
     author, ucid, auto_generated, sub_count = get_about_info(ucid, locale)
@@ -2392,11 +2391,17 @@ get "/channel/:ucid" do |env|
   end
 
   if auto_generated
+    sort_options = {"last", "oldest", "newest"}
+    sort_by ||= "last"
+
     items, continuation = fetch_channel_playlists(ucid, author, auto_generated, continuation, sort_by)
     items.select! { |item| item.is_a?(SearchPlaylist) && !item.videos.empty? }
     items = items.map { |item| item.as(SearchPlaylist) }
     items.each { |item| item.author = "" }
   else
+    sort_options = {"newest", "oldest", "popular"}
+    sort_by ||= "newest"
+
     items, count = get_60_videos(ucid, page, auto_generated, sort_by)
     items.select! { |item| !item.paid }
   end
@@ -2419,6 +2424,42 @@ get "/channel/:ucid/videos" do |env|
   env.redirect "/channel/#{ucid}#{params}"
 end
 
+get "/channel/:ucid/playlists" do |env|
+  locale = LOCALES[env.get("locale").as(String)]?
+
+  user = env.get? "user"
+  if user
+    user = user.as(User)
+    subscriptions = user.subscriptions
+  end
+  subscriptions ||= [] of String
+
+  ucid = env.params.url["ucid"]
+
+  continuation = env.params.query["continuation"]?
+
+  sort_by = env.params.query["sort_by"]?.try &.downcase
+  sort_by ||= "last"
+
+  begin
+    author, ucid, auto_generated, sub_count = get_about_info(ucid, locale)
+  rescue ex
+    error_message = ex.message
+    next templated "error"
+  end
+
+  if auto_generated
+    next env.redirect "/channel/#{ucid}"
+  end
+
+  items, continuation = fetch_channel_playlists(ucid, author, auto_generated, continuation, sort_by)
+  items.select! { |item| item.is_a?(SearchPlaylist) && !item.videos.empty? }
+  items = items.map { |item| item.as(SearchPlaylist) }
+  items.each { |item| item.author = "" }
+
+  templated "playlists"
+end
+
 # API Endpoints
 
 get "/api/v1/stats" do |env|

src/invidious/views/channel.ecr

@@ -21,12 +21,20 @@
 <div class="pure-g h-box">
     <div class="pure-u-1-3">
         <a href="https://www.youtube.com/channel/<%= ucid %>"><%= translate(locale, "View channel on YouTube") %></a>
+        <div class="pure-u-1 pure-md-1-3">
+            <b><%= translate(locale, "Videos") %></b>
+        </div>
+        <div class="pure-u-1 pure-md-1-3">
+            <% if !auto_generated %>
+                <a href="/channel/<%= ucid %>/playlists"><%= translate(locale, "Playlists") %></a>
+            <% end %>
+        </div>
     </div>
     <div class="pure-u-1-3">
     </div>
     <div class="pure-u-1-3">
         <div class="pure-g" style="text-align:right;">
-        <% {"newest", "oldest", "popular"}.each do |sort| %>
+        <% sort_options.each do |sort| %>
             <div class="pure-u-1 pure-md-1-3">
                 <% if sort_by == sort %>
                 <b><%= translate(locale, sort) %></b>

src/invidious/views/playlists.ecr

@@ -0,0 +1,80 @@
+<% content_for "header" do %>
+<title><%= author %> - Invidious</title>
+<% end %>
+
+<div class="pure-g h-box">
+    <div class="pure-u-2-3">
+        <h3><%= author %></h3>
+    </div>
+    <div class="pure-u-1-3" style="text-align:right;">
+        <h3>
+            <a href="/feed/channel/<%= ucid %>"><i class="icon ion-logo-rss"></i></a>
+        </h3>
+    </div>
+</div>
+
+<div class="h-box">
+<% sub_count_text = number_to_short_text(sub_count) %>
+<%= rendered "components/subscribe_widget" %>
+</div>
+
+<div class="pure-g h-box">
+    <div class="pure-g pure-u-1-3">
+        <div class="pure-u-1 pure-md-1-3">
+            <a href="https://www.youtube.com/channel/<%= ucid %>"><%= translate(locale, "View channel on YouTube") %></a>
+        </div>
+        <div class="pure-u-1 pure-md-1-3">
+            <a href="/channel/<%= ucid %>"><%= translate(locale, "Videos") %></a>
+        </div>
+        <div class="pure-u-1 pure-md-1-3">
+            <% if !auto_generated %>
+            <b><%= translate(locale, "Playlists") %></b>
+            <% end %>
+        </div>
+    </div>
+    <div class="pure-u-1-3">
+    </div>
+    <div class="pure-u-1-3">
+        <div class="pure-g" style="text-align:right;">
+        <% {"last", "oldest", "newest"}.each do |sort| %>
+            <div class="pure-u-1 pure-md-1-3">
+                <% if sort_by == sort %>
+                <b><%= translate(locale, sort) %></b>
+                <% else %>
+                <a href="/channel/<%= ucid %>/playlists?sort_by=<%= sort %>">
+                <%= translate(locale, sort) %>
+                </a>
+                <% end %>
+            </div>
+        <% end %>
+        </div>
+    </div>
+</div>
+
+<div class="h-box">
+    <hr>
+</div>
+
+<div class="pure-g">
+<% items.each_slice(4) do |slice| %>
+    <% slice.each do |item| %>
+        <%= rendered "components/item" %>
+    <% end %>
+<% end %>
+</div>
+
+<div class="pure-g h-box">
+    <div class="pure-u-1 pure-u-md-4-5"></div>
+    <div style="text-align:right;" class="pure-u-1 pure-u-md-1-5">
+    <% if items.size >= 28 %>
+        <a href="/channel/<%= ucid %>/playlists?continuation=<%= continuation %><% if sort_by != "last" %>&sort_by=<%= sort_by %><% end %>">
+            <%= translate(locale, "Next page") %>
+        </a>
+    <% end %>
+    </div>
+</div>
+
+<script>
+<% sub_count_text = number_to_short_text(sub_count) %>
+<%= rendered "components/subscribe_widget_script" %>
+</script>