apunkt/SurfSense
1
0
Fork 0
mirror of https://github.com/MODSetter/SurfSense.git synced 2026-05-02 04:12:47 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

feat: replace unified loading approach with global loading provider and refactor loading handling across components

Browse source 
- Introduced GlobalLoadingProvider to manage a consistent loading overlay across the application.
- Replaced existing loading implementations with useGlobalLoadingEffect hook for better control and to prevent animation resets.
- Updated components such as LoginPage, AuthCallbackPage, and DashboardLayout to utilize the new global loading mechanism.
- Removed UnifiedLoadingScreen component to streamline loading management and enhance user experience.
This commit is contained in:
Anish Sarkar 2026-01-25 16:15:25 +05:30
parent 2d17d1a1b6
commit 66a3c877ef
15 changed files with 294 additions and 140 deletions
Download patch file Download diff file Expand all files Collapse all files

72
surfsense_web/components/ui/unified-loading-screen.tsx
View file

@ -1,72 +0,0 @@
"use client";
import { useEffect, useState } from "react";
import { createPortal } from "react-dom";
import { Logo } from "@/components/Logo";
import { Spinner } from "@/components/ui/spinner";
import { AmbientBackground } from "@/app/(home)/login/AmbientBackground";
interface UnifiedLoadingScreenProps {
/** Optional message to display below the spinner */
message?: string;
/** Visual style variant */
variant?: "login" | "default";
}
export function UnifiedLoadingScreen({
message,
variant = "default",
}: UnifiedLoadingScreenProps) {
const [mounted, setMounted] = useState(false);
useEffect(() => {
setMounted(true);
}, []);
// Fixed-size container to prevent layout shifts
const spinnerContainer = (
<div className="h-12 w-12 flex items-center justify-center">
<Spinner
size={variant === "login" ? "lg" : "xl"}
className={variant === "login" ? "text-muted-foreground" : "text-primary"}
/>
</div>
);
const content = variant === "login" ? (
<div className="fixed inset-0 z-[9999] relative w-full overflow-hidden bg-background">
<AmbientBackground />
<div className="mx-auto flex h-screen max-w-lg flex-col items-center justify-center">
<Logo className="rounded-md" />
<div className="mt-8 flex flex-col items-center space-y-4">
{spinnerContainer}
{message && (
<span className="text-muted-foreground text-sm min-h-[1.25rem] text-center max-w-xs">
{message}
</span>
)}
</div>
</div>
</div>
) : (
<div className="fixed inset-0 z-[9999] flex min-h-screen flex-col items-center justify-center bg-background">
<div className="flex flex-col items-center space-y-4">
{spinnerContainer}
{message && (
<span className="text-muted-foreground text-sm min-h-[1.25rem] text-center max-w-md px-4">
{message}
</span>
)}
</div>
</div>
);
// Render inline during SSR, use portal after mounting
// This prevents the black flash during initial render
if (!mounted) {
return content;
}
return createPortal(content, document.body);
}