brf/client/admin/components/app.tsx
2025-12-18 07:31:37 +01:00

56 lines
1.7 KiB
TypeScript

import { h, type FunctionComponent } from 'preact'
import { useState } from 'preact/hooks'
import { Router } from 'preact-router'
import CurrentUserContext from '../contexts/current_user.ts'
import { NotificationsProvider } from '../contexts/notifications.tsx'
import routes from '../routes.ts'
import Route from './route.tsx'
import CurrentUser from './current_user.tsx'
import Navigation from './navigation.tsx'
import Notifications from './notifications.tsx'
import NotFoundPage from './not_found_page.tsx'
import s from './app.module.scss'
const App: FunctionComponent<{ state: ANY }> = ({ state }) => {
const [user, setUser] = useState(state.user)
return (
<NotificationsProvider defaultTimeout={15e3}>
<CurrentUserContext.Provider value={{ user, setUser }}>
<div className={s.base}>
<a href='/admin' className={s.logo}>
Carson Admin
</a>
<header className={s.header}>
<CurrentUser className={s.currentUser} />
</header>
{user && (
<aside className={s.aside}>
<Navigation base='/admin' routes={routes} />
</aside>
)}
<main className={s.main}>
<Router>
{routes
?.flatMap((route) => route.routes || route)
.map(({ auth, component, path }) => (
<Route key={path} path={'/admin' + path} component={component} auth={auth} />
))}
<NotFoundPage default />
</Router>
</main>
<Notifications />
</div>
</CurrentUserContext.Provider>
</NotificationsProvider>
)
}
export default App