import { useEffect, type ReactNode } from 'react';
import { Navigate, Route, Routes, useLocation } from 'react-router-dom';
import { useAuth } from '@/stores/auth';
import { useChat } from '@/stores/chat';
import { AppShell } from '@/components/layout/app-shell';
import { ChatView } from '@/components/chat/chat-view';
import { LoginPage } from '@/features/auth/login-page';
import { PrivacyPage } from '@/features/auth/privacy-page';
import { SetPasswordPage } from '@/features/auth/set-password-page';
import { ProfessorPage } from '@/features/professor/professor-page';
import { AdminCostsPage } from '@/features/professor/admin-costs-page';
import { Spinner } from '@/components/ui/spinner';

function Guard({ children, role }: { children: ReactNode; role?: 'professor' | 'admin' }) {
  const { user, loading } = useAuth();
  const loc = useLocation();
  if (loading) return <div className="h-[100dvh] flex items-center justify-center"><Spinner size={28} /></div>;
  if (!user) return <Navigate to="/connexion" replace state={{ from: loc }} />;
  if (role === 'professor' && !(user.role === 'professor' || user.role === 'admin')) return <Navigate to="/" replace />;
  if (role === 'admin' && user.role !== 'admin') return <Navigate to="/" replace />;
  return <>{children}</>;
}

export function AppRouter() {
  const { user, load } = useAuth();
  const loadConversations = useChat((s) => s.loadConversations);
  useEffect(() => {
    load();
  }, [load]);
  useEffect(() => {
    if (user) loadConversations().catch(() => undefined);
  }, [user, loadConversations]);
  return (
    <Routes>
      <Route path="/connexion" element={<LoginPage />} />
      <Route path="/mot-de-passe" element={<SetPasswordPage />} />
      <Route path="/confidentialite" element={<PrivacyPage />} />
      <Route path="/professeur" element={<Guard role="professor"><ProfessorPage /></Guard>} />
      <Route path="/admin" element={<Guard role="admin"><AdminCostsPage /></Guard>} />
      <Route element={<Guard><AppShell /></Guard>}>
        <Route path="/" element={<ChatView />} />
        <Route path="/c/:id" element={<ChatView />} />
      </Route>
      <Route path="*" element={<Navigate to="/" replace />} />
    </Routes>
  );
}