Files
calypso/frontend/src/App.tsx
2025-12-24 19:53:45 +00:00

60 lines
1.5 KiB
TypeScript

import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import { Toaster } from '@/components/ui/toaster'
import { useAuthStore } from '@/store/auth'
import LoginPage from '@/pages/Login'
import Dashboard from '@/pages/Dashboard'
import StoragePage from '@/pages/Storage'
import AlertsPage from '@/pages/Alerts'
import Layout from '@/components/Layout'
// Create a client
const queryClient = new QueryClient({
defaultOptions: {
queries: {
refetchOnWindowFocus: false,
retry: 1,
staleTime: 5 * 60 * 1000, // 5 minutes
},
},
})
// Protected Route Component
function ProtectedRoute({ children }: { children: React.ReactNode }) {
const { isAuthenticated } = useAuthStore()
if (!isAuthenticated) {
return <Navigate to="/login" replace />
}
return <>{children}</>
}
function App() {
return (
<QueryClientProvider client={queryClient}>
<BrowserRouter>
<Routes>
<Route path="/login" element={<LoginPage />} />
<Route
path="/"
element={
<ProtectedRoute>
<Layout />
</ProtectedRoute>
}
>
<Route index element={<Dashboard />} />
<Route path="storage" element={<StoragePage />} />
<Route path="alerts" element={<AlertsPage />} />
</Route>
</Routes>
<Toaster />
</BrowserRouter>
</QueryClientProvider>
)
}
export default App