54 lines
1.6 KiB
TypeScript
54 lines
1.6 KiB
TypeScript
import { useEffect } from 'react';
|
|
import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
|
|
import { useAuthStore } from './store/authStore';
|
|
import { ProtectedRoute } from './components/ProtectedRoute';
|
|
|
|
// Pages
|
|
import Editor from './pages/Editor';
|
|
import Home from './pages/Home';
|
|
import Dashboard from './pages/Dashboard';
|
|
import Admin from './pages/Admin';
|
|
import SparkPlug from './pages/SparkPlug';
|
|
import { AuthModal } from './components/AuthModal';
|
|
|
|
export default function App() {
|
|
const { initialize, isLoading } = useAuthStore();
|
|
|
|
useEffect(() => {
|
|
initialize();
|
|
}, [initialize]);
|
|
|
|
if (isLoading) {
|
|
return (
|
|
<div className="flex h-screen w-screen items-center justify-center bg-zinc-950 text-white">
|
|
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-primary"></div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<BrowserRouter>
|
|
<AuthModal />
|
|
<Routes>
|
|
{/* Public Routes */}
|
|
<Route path="/" element={<Home />} />
|
|
|
|
{/* Protected Routes (User) */}
|
|
<Route element={<ProtectedRoute allowedRoles={['user', 'admin']} />}>
|
|
<Route path="/dashboard" element={<Dashboard />} />
|
|
<Route path="/spark-plug" element={<SparkPlug />} />
|
|
<Route path="/editor/:projectId?" element={<Editor />} />
|
|
</Route>
|
|
|
|
{/* Protected Routes (Admin) */}
|
|
<Route element={<ProtectedRoute allowedRoles={['admin']} />}>
|
|
<Route path="/admin" element={<Admin />} />
|
|
</Route>
|
|
|
|
{/* Fallback */}
|
|
<Route path="*" element={<Navigate to="/" replace />} />
|
|
</Routes>
|
|
</BrowserRouter>
|
|
);
|
|
}
|