Update spinner

This commit is contained in:
MacRimi
2026-02-16 12:11:37 +01:00
parent 92b0a1478a
commit dcbc52efc6
5 changed files with 33 additions and 15 deletions

View File

@@ -31,8 +31,6 @@ export default function Home() {
}) })
const data = await response.json() const data = await response.json()
console.log("[v0] Auth status:", data)
const authenticated = data.auth_enabled ? data.authenticated : true const authenticated = data.auth_enabled ? data.authenticated : true
setAuthStatus({ setAuthStatus({
@@ -63,9 +61,13 @@ export default function Home() {
if (authStatus.loading) { if (authStatus.loading) {
return ( return (
<div className="min-h-screen bg-background flex items-center justify-center"> <div className="min-h-screen bg-background flex items-center justify-center">
<div className="text-center space-y-4"> <div className="flex flex-col items-center gap-4">
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-primary mx-auto"></div> <div className="relative">
<p className="text-muted-foreground">Loading...</p> <div className="h-12 w-12 rounded-full border-2 border-muted"></div>
<div className="absolute inset-0 h-12 w-12 rounded-full border-2 border-transparent border-t-primary animate-spin"></div>
</div>
<div className="text-sm font-medium text-foreground">Loading...</div>
<p className="text-xs text-muted-foreground">Connecting to ProxMenux Monitor</p>
</div> </div>
</div> </div>
) )

View File

@@ -329,10 +329,13 @@ export default function Hardware() {
if (swrLoading) { if (swrLoading) {
return ( return (
<div className="space-y-6"> <div className="flex flex-col items-center justify-center min-h-[400px] gap-4">
<div className="text-center py-8"> <div className="relative">
<div className="text-lg font-medium text-foreground mb-2">Loading hardware data...</div> <div className="h-12 w-12 rounded-full border-2 border-muted"></div>
<div className="absolute inset-0 h-12 w-12 rounded-full border-2 border-transparent border-t-primary animate-spin"></div>
</div> </div>
<div className="text-sm font-medium text-foreground">Loading hardware data...</div>
<p className="text-xs text-muted-foreground">Detecting CPU, GPU, storage and PCI devices</p>
</div> </div>
) )
} }

View File

@@ -177,10 +177,13 @@ export function NetworkMetrics() {
if (isLoading) { if (isLoading) {
return ( return (
<div className="space-y-6"> <div className="flex flex-col items-center justify-center min-h-[400px] gap-4">
<div className="text-center py-8"> <div className="relative">
<div className="text-lg font-medium text-foreground mb-2">Loading network data...</div> <div className="h-12 w-12 rounded-full border-2 border-muted"></div>
<div className="absolute inset-0 h-12 w-12 rounded-full border-2 border-transparent border-t-primary animate-spin"></div>
</div> </div>
<div className="text-sm font-medium text-foreground">Loading network data...</div>
<p className="text-xs text-muted-foreground">Scanning interfaces, bridges and traffic</p>
</div> </div>
) )
} }

View File

@@ -476,8 +476,13 @@ export function StorageOverview() {
if (loading) { if (loading) {
return ( return (
<div className="flex items-center justify-center h-64"> <div className="flex flex-col items-center justify-center min-h-[400px] gap-4">
<div className="text-muted-foreground">Loading storage information...</div> <div className="relative">
<div className="h-12 w-12 rounded-full border-2 border-muted"></div>
<div className="absolute inset-0 h-12 w-12 rounded-full border-2 border-transparent border-t-primary animate-spin"></div>
</div>
<div className="text-sm font-medium text-foreground">Loading storage data...</div>
<p className="text-xs text-muted-foreground">Scanning disks, partitions and storage pools</p>
</div> </div>
) )
} }

View File

@@ -651,8 +651,13 @@ const handleDownloadLogs = async (vmid: number, vmName: string) => {
if (isLoading) { if (isLoading) {
return ( return (
<div className="space-y-6"> <div className="flex flex-col items-center justify-center min-h-[400px] gap-4">
<div className="text-center py-8 text-muted-foreground">Loading virtual machines...</div> <div className="relative">
<div className="h-12 w-12 rounded-full border-2 border-muted"></div>
<div className="absolute inset-0 h-12 w-12 rounded-full border-2 border-transparent border-t-primary animate-spin"></div>
</div>
<div className="text-sm font-medium text-foreground">Loading virtual machines...</div>
<p className="text-xs text-muted-foreground">Fetching VM and LXC container status</p>
</div> </div>
) )
} }