| "use client"; | |
| import { Logo } from './logo'; | |
| export const LoadingScreen = () => { | |
| // We might not have settings here, so we provide a default t function. | |
| // This avoids a circular dependency where AuthProvider -> LoadingScreen -> useSettings, | |
| // but SettingsProvider needs AuthProvider. | |
| const t = (key: string, options?: any) => options?.defaultValue || key; | |
| return ( | |
| <div className="h-screen w-screen flex items-center justify-center bg-background text-foreground"> | |
| <div className="flex flex-col items-center gap-4"> | |
| <div className="animate-pulse"> | |
| <Logo /> | |
| </div> | |
| <p className="text-muted-foreground"> | |
| {t('loadingSecureSession', { defaultValue: 'Loading Secure Session...' })} | |
| </p> | |
| </div> | |
| </div> | |
| ); | |
| }; | |