v0.36.0

src/admin/web/traffic-panel.js

@@ -1,6 +1,6 @@
 "use strict";
 (() => {
-    let loading = false, lastData = null, activeTab = "overview";
+    let loading = false, lastData = null, activeTab = "overview", staticData = null, staticRevision = null;
     const chartPalette = ["var(--chart-accent)", "var(--chart-secondary)", "var(--chart-tertiary)", "var(--chart-quaternary)", "var(--chart-quinary)", "var(--chart-senary)", "var(--chart-septenary)", "var(--chart-octonary)"];
     const scope = () => $("traffic-scope")?.value || "*";
     const number = value => fmt(Number(value) || 0);
@@ -116,7 +116,17 @@
         if (!authenticated || currentPanel !== "traffic" || loading) return;
         loading = true;
         try {
-            const data = await api(`/api/traffic?vhost=${encodeURIComponent(scope())}`, { signal });
+            const base = `/api/traffic?vhost=${encodeURIComponent(scope())}`;
+            let data = await api(staticData ? `${base}&view=live` : base, { signal });
+            if (staticData && data.revision !== staticRevision) {
+                data = await api(base, { signal });
+            }
+            if (Array.isArray(data.vhosts)) {
+                staticData = { vhosts: data.vhosts };
+                staticRevision = data.revision;
+            } else if (staticData) {
+                data = { ...staticData, ...data };
+            }
             if (isCurrent()) render(data);
         } catch (error) {
             if (error?.name !== "AbortError" && isCurrent()) $("traffic-panel-state").textContent = error.message;
@@ -125,7 +135,7 @@
     function refresh() { return rustProxyRefresh.manual("traffic"); }
 
     function reset() {
-        lastData = null; if ($("traffic-panel-state")) $("traffic-panel-state").textContent = "";
+        lastData = null; staticData = null; staticRevision = null; if ($("traffic-panel-state")) $("traffic-panel-state").textContent = "";
         document.querySelectorAll(".traffic-bar-chart").forEach(chart => chart.replaceChildren());
         for (const id of ["countries", "methods", "methods-detail", "statuses", "statuses-detail", "cache", "cache-detail"]) {
             const chart = $(`traffic-chart-${id}`), legend = $(`traffic-chart-${id}-legend`), total = $(`traffic-chart-${id}-total`);