Add about tab to channels

locales/en-US.json

@@ -384,6 +384,7 @@
     "Download": "Download",
     "Download as: ": "Download as: ",
     "%A %B %-d, %Y": "%A %B %-d, %Y",
+    "%B %-d, %Y": "%B %-d, %Y",
     "(edited)": "(edited)",
     "YouTube comment permalink": "YouTube comment permalink",
     "permalink": "permalink",
@@ -423,5 +424,9 @@
     "Current version: ": "Current version: ",
     "next_steps_error_message": "After which you should try to: ",
     "next_steps_error_message_refresh": "Refresh",
-    "next_steps_error_message_go_to_youtube": "Go to Youtube"
+    "next_steps_error_message_go_to_youtube": "Go to Youtube",
+    "Details": "Details",
+    "Stats": "Stats",
+    "Joined": "Joined",
+    "Links": "Links",
 }

src/invidious.cr

@@ -1674,11 +1674,6 @@ get "/user/:user/about" do |env|
   env.redirect "/channel/#{user}"
 end
 
-get "/channel/:ucid/about" do |env|
-  ucid = env.params.url["ucid"]
-  env.redirect "/channel/#{ucid}"
-end
-
 get "/channel/:ucid" do |env|
   locale = LOCALES[env.get("preferences").as(Preferences).locale]?
 
@@ -1825,6 +1820,31 @@ get "/channel/:ucid/community" do |env|
   templated "community"
 end
 
+get "/channel/:ucid/about" do |env|
+  locale = LOCALES[env.get("preferences").as(Preferences).locale]?
+
+  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"]?
+
+  begin
+    channel = get_about_info(ucid, locale)
+  rescue ex : ChannelRedirect
+    next env.redirect env.request.resource.gsub(ucid, ex.channel_id)
+  rescue ex
+    next error_template(500, ex)
+  end
+
+  templated "channel_about"
+end
+
 # API Endpoints
 
 get "/api/v1/stats" do |env|

src/invidious/views/channel_about.ecr

@@ -0,0 +1,35 @@
+<% content_type =  4 %>
+<% sort_options = Tuple.new %>
+<%= rendered "components/channel-information" %>
+
+<div class="pure-g">
+    <div class="pure-u-3-4">
+        <div class="h-box">
+            <h3> <%= translate(locale, "Details") %> </h3>
+            <p>Country: <%=channel.country%></p> <!-- Translate Country Names -->
+        </div>
+    </div>
+
+    <div class="pure-u-1-4">
+        <div class="h-box">
+            <h3> <%= translate(locale, "Stats") %> </h3>
+            <p> <%= translate(locale, "Joined") %>
+                <time datetime="<%=channel.joined.to_s("%Y-%m-%d")%>">
+                    <%= channel.joined.to_s(translate(locale, "%B %-d, %Y")) %>
+                </time>
+            </p>
+            <p><%= channel.total_views ? translate(locale, "`x` views", number_with_separator(channel.total_views || 0)) : "" %></p>
+        </div>
+    </div>
+
+    <div class="pure-u-2-3" id="external-links">
+        <div class="h-box">
+            <h3> <%= translate(locale, "Links") %> </h3>
+            <% channel.links.each do |link_tuple| %>
+                <p class="pure-u-11-24">
+                    <a href="<%=link_tuple[1]%>"><%=link_tuple[0]%></a>
+                </p>
+            <% end %>
+        </div>
+    </div>
+</div>

src/invidious/views/community.ecr

@@ -1,7 +1,4 @@
 <% content_type =  2 %>
-<%
-# Make compiler happy
-%>
 <% sort_options = Tuple.new %>
 <%= rendered "components/channel-information" %>
 

src/invidious/views/components/channel-information.ecr

@@ -92,6 +92,20 @@
                   <% end %>
               <% end %>
 
+              <% if content_type == 4 %>
+                  <li class="pure-menu-item pure-menu-selected">
+                      <a class="pure-menu-link" href="/channel/<%= channel.ucid %>/about">
+                        <b> <%= translate(locale, "About") %> </b>
+                      </a>
+                  </li>
+              <% else %>
+                  <li class="pure-menu-item">
+                      <a class="pure-menu-link" href="/channel/<%= channel.ucid %>/about">
+                        <%= translate(locale, "About") %>
+                      </a>
+                  </li>
+              <% end %>
+
               <% if !channel.auto_generated %>
                   <li class="pure-menu-item navbar" style="margin: 0 0 0 0.5em">
                       <div class="searchbar">