forked from 0xWheatyz/SPARC
a4aa968434
- Enable Tailwind "class" dark mode strategy - Use CSS custom properties for theme colors (bg, text, border) - Add ThemeProvider context with toggle and localStorage persistence - Add Sun/Moon toggle button in the header navigation - Inline script in index.html prevents FOUC on page load - All pages (Layout, Login, Register, ProtectedRoute) support both modes - Default theme follows system preference (prefers-color-scheme) Closes leeworks-agents/SPARC#33 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
31 lines
898 B
TypeScript
31 lines
898 B
TypeScript
import { Navigate, useLocation } from 'react-router-dom';
|
|
import { useAuth } from '../context/AuthContext';
|
|
|
|
interface ProtectedRouteProps {
|
|
children: React.ReactNode;
|
|
requireAdmin?: boolean;
|
|
}
|
|
|
|
export function ProtectedRoute({ children, requireAdmin = false }: ProtectedRouteProps) {
|
|
const { isAuthenticated, isAdmin, isLoading } = useAuth();
|
|
const location = useLocation();
|
|
|
|
if (isLoading) {
|
|
return (
|
|
<div className="min-h-screen bg-gradient-to-br from-bg-dark to-slate-100 dark:to-indigo-950 flex items-center justify-center">
|
|
<div className="animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-primary"></div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
if (!isAuthenticated) {
|
|
return <Navigate to="/login" state={{ from: location }} replace />;
|
|
}
|
|
|
|
if (requireAdmin && !isAdmin) {
|
|
return <Navigate to="/analysis" replace />;
|
|
}
|
|
|
|
return <>{children}</>;
|
|
}
|