From db93de4b14ab78e618971effc9e3f67646dfe80a Mon Sep 17 00:00:00 2001
From: "Joseph.Rawlings" <root0091@gmail.com>
Date: Mon, 1 Dec 2025 08:13:50 -0500
Subject: [PATCH] feat: improve loading logic for telemetry and network
 analysis sections by utilizing session storage to prevent unnecessary loading
 delays

---
 .../Proxmox/views/statistics.blade.php        | 50 ++++++++++++++++---
 1 file changed, 42 insertions(+), 8 deletions(-)

diff --git a/extensions/Servers/Proxmox/views/statistics.blade.php b/extensions/Servers/Proxmox/views/statistics.blade.php
index 37cc99e9e..60109c90a 100644
--- a/extensions/Servers/Proxmox/views/statistics.blade.php
+++ b/extensions/Servers/Proxmox/views/statistics.blade.php
@@ -101,7 +101,24 @@
         <section
             wire:poll.120s="stats"
             x-data="{ loading: true }"
-            x-init="setTimeout(() => loading = false, 4000)"
+            x-init="
+                (function () {
+                    var serverId = {{ $server->id ?? 0 }};
+                    var key = 'statsTelemetryLoaded_' + serverId;
+                    if (window.sessionStorage && sessionStorage.getItem(key) === 'true') {
+                        loading = false;
+                        return;
+                    }
+                    setTimeout(function () {
+                        loading = false;
+                        try {
+                            if (window.sessionStorage) {
+                                sessionStorage.setItem(key, 'true');
+                            }
+                        } catch (e) {}
+                    }, 4000);
+                })()
+            "
             class="relative bg-background-secondary border border-neutral rounded-2xl p-6 space-y-6 shadow-sm"
         >
             <!-- Blur overlay while telemetry data is loading -->
@@ -111,15 +128,15 @@
                 class="absolute inset-0 z-30 flex items-center justify-center bg-background/80 backdrop-blur-sm"
             >
                 <div class="flex flex-col items-center gap-3 text-base/70">
-                    <svg fill="none" viewBox="0 0 24 24" class="size-8 animate-spin text-primary">
+                    <svg class="animate-spin h-8 w-8 text-primary" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
                         <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
-                        <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"></path>
+                        <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
                     </svg>
                     <p class="text-sm font-semibold">Loading telemetry data…</p>
                 </div>
             </div>
 
-            <div :class="loading ? 'blur-sm pointer-events-none select-none' : ''">
+            <div :class="loading ? 'blur-sm pointer-events-none select-none overflow-hidden' : ''">
                 <div class="flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between">
                     <div>
                         <h2 class="text-lg font-semibold flex items-center gap-2">
@@ -1934,7 +1951,24 @@
         style="width: 100%;"
         wire:init="loadNetworkAnalysis"
         x-data="{ loading: true }"
-        x-init="setTimeout(() => loading = false, 4000)"
+        x-init="
+            (function () {
+                var serverId = {{ $server->id ?? 0 }};
+                var key = 'networkAnalysisLoaded_' + serverId;
+                if (window.sessionStorage && sessionStorage.getItem(key) === 'true') {
+                    loading = false;
+                    return;
+                }
+                setTimeout(function () {
+                    loading = false;
+                    try {
+                        if (window.sessionStorage) {
+                            sessionStorage.setItem(key, 'true');
+                        }
+                    } catch (e) {}
+                }, 4000);
+            })()
+        "
     >
         <!-- Blur overlay while Network Analysis is loading -->
         <div
@@ -1943,15 +1977,15 @@
             class="absolute inset-0 z-30 flex items-center justify-center bg-background/80 backdrop-blur-sm"
         >
             <div class="flex flex-col items-center gap-3 text-base/70">
-                <svg fill="none" viewBox="0 0 24 24" class="size-8 animate-spin text-primary">
+                <svg class="animate-spin h-8 w-8 text-primary" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
                     <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
-                    <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"></path>
+                    <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
                 </svg>
                 <p class="text-sm font-semibold">Loading network analysis…</p>
             </div>
         </div>
 
-        <div :class="loading ? 'blur-sm pointer-events-none select-none' : ''">
+        <div :class="loading ? 'blur-sm pointer-events-none select-none overflow-hidden' : ''">
         <div class="p-6 border-b border-neutral flex items-center justify-between gap-3 flex-wrap">
             <div class="flex items-center gap-2">
                 <x-ri-router-line class="size-5" />