"use client";
import { useEffect, useState } from 'react';
import { useRouter } from 'next/navigation';
import { useLLMPreferences } from '@/hooks/use-llm-configs';
import { Loader2 } from 'lucide-react';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
interface DashboardLayoutProps {
children: React.ReactNode;
}
export default function DashboardLayout({ children }: DashboardLayoutProps) {
const router = useRouter();
const { loading, error, isOnboardingComplete } = useLLMPreferences();
const [isCheckingAuth, setIsCheckingAuth] = useState(true);
useEffect(() => {
// Check if user is authenticated
const token = localStorage.getItem('surfsense_bearer_token');
if (!token) {
router.push('/login');
return;
}
setIsCheckingAuth(false);
}, [router]);
useEffect(() => {
// Wait for preferences to load, then check if onboarding is complete
if (!loading && !error && !isCheckingAuth) {
if (!isOnboardingComplete()) {
router.push('/onboard');
}
}
}, [loading, error, isCheckingAuth, isOnboardingComplete, router]);
// Show loading screen while checking authentication or loading preferences
if (isCheckingAuth || loading) {
return (
Loading Dashboard
Checking your configuration...
);
}
// Show error screen if there's an error loading preferences
if (error) {
return (
Configuration Error
Failed to load your LLM configuration
{error}
);
}
// Only render children if onboarding is complete
if (isOnboardingComplete()) {
return <>{children};
}
// This should not be reached due to redirect, but just in case
return (
Redirecting...
Taking you to complete your setup
);
}