Don't wait on server for subscription count

2 files changed, 5 insertions, 11 deletions

diff --git a/src/invidious.cr b/src/invidious.cr
index dd134a72..74ae35db 100644
--- a/src/invidious.cr
+++ b/src/invidious.cr
@@ -1444,8 +1444,6 @@ get "/subscription_ajax" do |env|
   redirect ||= "false"
   redirect = redirect == "true"
 
-  count_text = ""
-
   if user
     user = user.as(User)
 
@@ -1508,17 +1506,13 @@ get "/subscription_ajax" do |env|
         PG_DB.exec("UPDATE users SET subscriptions = array_remove(subscriptions,$1) WHERE email = $2", channel_id, email)
       end
     end
-
-    count_text = PG_DB.query_one?("SELECT cardinality(subscriptions) FROM users WHERE email = $1", email, as: Int32)
-    count_text ||= 0
-    count_text = "#{number_with_separator(count_text)} subscriptions"
   end
 
   if redirect
     env.redirect referer
   else
     env.response.content_type = "application/json"
-    {"countText" => count_text}.to_json
+    "{}"
   end
 end
 
diff --git a/src/invidious/views/subscription_manager.ecr b/src/invidious/views/subscription_manager.ecr
index d420fbf8..ac1c0cdd 100644
--- a/src/invidious/views/subscription_manager.ecr
+++ b/src/invidious/views/subscription_manager.ecr
@@ -4,7 +4,7 @@
 
 <div class="pure-g h-box">
     <div class="pure-u-2-3">
-        <h3 id="count"><%= subscriptions.size %> subscriptions</h3>
+        <h3><span id="count"><%= subscriptions.size %></span> subscriptions</h3>
     </div>
     <div class="pure-u-1-3" style="text-align:right;">
         <h3>
@@ -44,6 +44,8 @@
 function remove_subscription(target) {
     var row = target.parentNode.parentNode.parentNode.parentNode;
     row.style.display = "none";
+    var count = document.getElementById("count")
+    count.innerText = count.innerText - 1;
 
     var url = "/subscription_ajax?action_remove_subscriptions=1&redirect=false&c=" + target.getAttribute("data-id");
     var xhr = new XMLHttpRequest();
@@ -54,9 +56,7 @@ function remove_subscription(target) {
 
     xhr.onreadystatechange = function() {
         if (xhr.readyState == 4) {
-            if (xhr.status == 200) {
-                document.getElementById("count").innerHTML = xhr.response.countText;
-            } else {
+            if (xhr.status != 200) {
                 row.style.display = "";
             }
         }