91 lines
2.4 KiB
TypeScript
91 lines
2.4 KiB
TypeScript
import { Route, Router } from '@solidjs/router'
|
||
import { lazy, onMount, Suspense } from 'solid-js'
|
||
import { AuthProvider, useAuth } from './context/auth'
|
||
|
||
// Ленивая загрузка компонентов
|
||
const AdminPage = lazy(() => {
|
||
console.log('[App] Loading AdminPage component...')
|
||
return import('./admin')
|
||
})
|
||
const LoginPage = lazy(() => {
|
||
console.log('[App] Loading LoginPage component...')
|
||
return import('./routes/login')
|
||
})
|
||
|
||
/**
|
||
* Компонент защищенного маршрута
|
||
*/
|
||
const ProtectedRoute = () => {
|
||
console.log('[ProtectedRoute] Checking authentication...')
|
||
const auth = useAuth()
|
||
const authenticated = auth.isAuthenticated()
|
||
console.log(
|
||
`[ProtectedRoute] Authentication state: ${authenticated ? 'authenticated' : 'not authenticated'}`
|
||
)
|
||
|
||
if (!authenticated) {
|
||
console.log('[ProtectedRoute] Not authenticated, redirecting to login...')
|
||
// Используем window.location.href для редиректа
|
||
window.location.href = '/login'
|
||
return (
|
||
<div class="loading-screen">
|
||
<div class="loading-spinner" />
|
||
<div>Проверка авторизации...</div>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
return (
|
||
<Suspense
|
||
fallback={
|
||
<div class="loading-screen">
|
||
<div class="loading-spinner" />
|
||
<div>Загрузка админ-панели...</div>
|
||
</div>
|
||
}
|
||
>
|
||
<AdminPage apiUrl={`${location.origin}/graphql`} />
|
||
</Suspense>
|
||
)
|
||
}
|
||
|
||
/**
|
||
* Корневой компонент приложения
|
||
*/
|
||
const App = () => {
|
||
console.log('[App] Initializing root component...')
|
||
|
||
onMount(() => {
|
||
console.log('[App] Root component mounted')
|
||
})
|
||
|
||
return (
|
||
<AuthProvider>
|
||
<div class="app-container">
|
||
<Router>
|
||
<Route
|
||
path="/login"
|
||
component={() => (
|
||
<Suspense
|
||
fallback={
|
||
<div class="loading-screen">
|
||
<div class="loading-spinner" />
|
||
<div>Загрузка страницы входа...</div>
|
||
</div>
|
||
}
|
||
>
|
||
<LoginPage />
|
||
</Suspense>
|
||
)}
|
||
/>
|
||
<Route path="/" component={ProtectedRoute} />
|
||
<Route path="/admin" component={ProtectedRoute} />
|
||
<Route path="/admin/:tab" component={ProtectedRoute} />
|
||
</Router>
|
||
</div>
|
||
</AuthProvider>
|
||
)
|
||
}
|
||
|
||
export default App
|