42 lines
1.1 KiB
JavaScript
42 lines
1.1 KiB
JavaScript
import Header from '@components/Header'
|
|
import Navbar from '@components/Navbar'
|
|
import { useAuth } from '@hooks/useAuth'
|
|
import { AppShell, ScrollArea } from '@mantine/core'
|
|
import { useDisclosure } from '@mantine/hooks'
|
|
import { PathConstants } from '@routes/routes'
|
|
import { useEffect } from 'react'
|
|
import { Outlet, useNavigate } from 'react-router-dom'
|
|
|
|
export default function Layout() {
|
|
const [opened, { toggle }] = useDisclosure()
|
|
const { auth } = useAuth()
|
|
const navigate = useNavigate()
|
|
|
|
useEffect(() => {
|
|
if (!auth.isLogged) {
|
|
navigate(PathConstants.LOGIN)
|
|
}
|
|
}, [])
|
|
|
|
return (
|
|
<AppShell
|
|
header={{ height: 60 }}
|
|
navbar={{ width: 300, breakpoint: 'md', collapsed: { mobile: !opened } }}
|
|
padding="md"
|
|
bg="#f2fcff"
|
|
>
|
|
<AppShell.Header>
|
|
<Header opened={opened} onClick={toggle} />
|
|
</AppShell.Header>
|
|
<AppShell.Navbar>
|
|
<AppShell.Section component={ScrollArea}>
|
|
<Navbar />
|
|
</AppShell.Section>
|
|
</AppShell.Navbar>
|
|
<AppShell.Main>
|
|
<Outlet />
|
|
</AppShell.Main>
|
|
</AppShell>
|
|
)
|
|
}
|