From 8afe354e742f738ffb38fa98736403d2b8b31e01 Mon Sep 17 00:00:00 2001
From: Andrei Kurilov <18027129+akurilov@users.noreply.github.com>
Date: Mon, 4 Dec 2023 22:55:51 +0200
Subject: [PATCH] test

---
 web/sub.html |  6 ++---
 web/sub.js   | 65 ++++++++++++++++++++++++++++++++++++++++++----------
 2 files changed, 56 insertions(+), 15 deletions(-)

diff --git a/web/sub.html b/web/sub.html
index d0092fd..26bbfc4 100644
--- a/web/sub.html
+++ b/web/sub.html
@@ -38,7 +38,7 @@
         <button class="text-gray-600 py-1 px-1 block hover:text-indigo-500 focus:outline-none flex text-lg"
                 onclick="window.location.assign('pub.html')">
             <svg class="mr-1" width="24px" height="24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M18 17a1 1 0 1 1 2 0v1.077c0 .76-.082 1.185-.319 1.627a2.363 2.363 0 0 1-.977.977c-.442.237-.867.319-1.627.319H5.923c-.76 0-1.185-.082-1.627-.319a2.363 2.363 0 0 1-.978-.977C3.082 19.262 3 18.838 3 18.077L2.999 6.5A2.5 2.5 0 0 1 5.502 4l1.5.005a1 1 0 1 1-.005 2L5.499 6a.5.5 0 0 0-.5.5v11.577c0 .459.023.57.083.684.038.07.087.12.157.157.113.06.225.082.684.082h11.154c.459 0 .57-.022.684-.082a.363.363 0 0 0 .157-.157c.06-.113.082-.225.082-.684V17zm4-4a1 1 0 1 1-2 0 9 9 0 0 0-9-9 1 1 0 1 1 0-2c6.075 0 11 4.925 11 11zm-4 0a1 1 0 1 1-2 0 5 5 0 0 0-5-5 1 1 0 1 1 0-2 7 7 0 0 1 7 7zm-4 0a1 1 0 1 1-2 0 1 1 0 0 0-1-1 1 1 0 1 1 0-2 3 3 0 0 1 3 3z" fill="currentColor"/></svg>
-            <span style="margin-top: -0.125rem">Pub<span>
+            <span style="margin-top: -0.125rem">Pub</span>
         </button>
         <button class="text-gray-600 py-1 px-1 block hover:text-sky-500 focus:outline-none text-sky-500 border-b-2 font-medium border-sky-500 flex text-lg">
             <svg width="24px" height="24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -59,7 +59,7 @@
         <div class="flex flex-col space-y-2 text-slate-700">
             <div class="flex">
                 <div class="pt-1 col-span-2 w-24">Subscriptions</div>
-                <div class="pt-1 ml-2 w-10">13</div>
+                <div class="pt-1 ml-2 w-10" id="count"></div>
                 <div class="ml-1">
                     <button class="text-blue-500 border border-blue-500 rounded-md w-6 h-6 hover:bg-blue-200 static">
                         <span class="absolute -mt-4 -ml-2 text-2xl pl-[1px]">+</span>
@@ -68,7 +68,7 @@
             </div>
             <div class="flex">
                 <div class="pt-1 col-span-2 w-24">Limit</div>
-                <div class="pt-1 ml-2 w-10">100</div>
+                <div class="pt-1 ml-2 w-10" id="limit"></div>
                 <div class="ml-1">
                     <button class="text-blue-500 border border-blue-500 rounded-md w-6 h-6 hover:bg-blue-200 static">
                         <span class="absolute -mt-4 -ml-2 text-2xl pl-[1px]">+</span>
diff --git a/web/sub.js b/web/sub.js
index 2169f8d..bf5b42b 100644
--- a/web/sub.js
+++ b/web/sub.js
@@ -1,7 +1,7 @@
 const templateSub = (sub) => `
                 <div class="hover:text-blue-500 hover:bg-gray-100 flex"
                      onclick="window.location.assign('sub-details.html?id=${sub.id}')">
-                    <span class="truncate w-[240px] sm:w-[600px] p-1">
+                    <span class="truncate w-[240px] sm:w-[600px] py-2">
                         ${sub.description}
                     </span>
                     <div class="grow max-"></div>
@@ -14,21 +14,62 @@ const templateSub = (sub) => `
 `
 
 function loadSubscriptions() {
-    let authToken = sessionStorage.getItem("authToken");
-    let userId = sessionStorage.getItem("userId");
-    let optsReq = {
+    const authToken = sessionStorage.getItem("authToken");
+    const userId = sessionStorage.getItem("userId");
+    const headers = {
+        "Authorization": `Bearer ${authToken}`,
+        "X-Awakari-Group-Id": defaultGroupId,
+        "X-Awakari-User-Id": userId,
+    }
+
+    fetch("/v1/usage/1", {
         method: "GET",
-        headers: {
-            "Authorization": `Bearer ${authToken}`,
-            "X-Awakari-Group-Id": defaultGroupId,
-            "X-Awakari-User-Id": userId,
-        },
+        headers: headers,
         cache: "default",
-    }
-    fetch("/v1/sub?limit=100", optsReq)
+    })
+        .then(resp => {
+            if (!resp.ok) {
+                throw new Error(`Subscriptions usage request failed with status: ${resp.status}`);
+            }
+            return resp.json();
+        })
+        .then(data => {
+            if (data != null && data.hasOwnProperty("count")) {
+                document.getElementById("count").innerText = data.count;
+            }
+        })
+        .catch(err => {
+            alert(err);
+        })
+
+    fetch("/v1/usage/1", {
+        method: "GET",
+        headers: headers,
+        cache: "default",
+    })
+        .then(resp => {
+            if (!resp.ok) {
+                throw new Error(`Subscriptions limit request failed with status: ${resp.status}`);
+            }
+            return resp.json();
+        })
+        .then(data => {
+            if (data != null && data.hasOwnProperty("count")) {
+                document.getElementById("limit").innerText = data.count;
+            }
+        })
+        .catch(err => {
+            alert(err);
+        })
+
+    fetch("/v1/sub?limit=100", {
+        method: "GET",
+        headers: headers,
+        cache: "default",
+    })
         .then(resp => {
             if (!resp.ok) {
-                throw new Error(`Request failed with status: ${resp.status}`);
+                throw new Error(`Subscriptions list request failed with status: ${resp.status}`);
             }
             return resp.json();
         })