gitscope
https://dev.kronoz.win/r/marzneshin.git
app/dashboard/src/layouts/console-layout.tsx · v0.1.0
Source
1 bedeeff Mardin 2y ago import { Box } from '@chakra-ui/react';
2 bedeeff Mardin 2y ago import { PanelGroup, Panel, PanelResizeHandle, ImperativePanelHandle } from 'react-resizable-panels';
3 5825ea4 Mardin 2y ago import { Footer } from 'components/footer';
4 bedeeff Mardin 2y ago import { Header } from 'components/header';
5 bedeeff Mardin 2y ago import { Sidebar } from 'components/sidebar';
6 bedeeff Mardin 2y ago import { Suspense, useRef } from 'react';
7 bedeeff Mardin 2y ago import { Outlet } from 'react-router-dom';
8 89f8f93 Mardin 2y ago import { useDashboard } from 'stores';
9 bedeeff Mardin 2y ago
10 bedeeff Mardin 2y ago export const ConsoleLayout = () => {
11 bedeeff Mardin 2y ago const ref = useRef<ImperativePanelHandle>(null);
12 bedeeff Mardin 2y ago const { collapseSidebar, expandSidebar } = useDashboard();
13 bedeeff Mardin 2y ago
14 bedeeff Mardin 2y ago return (
15 bedeeff Mardin 2y ago <PanelGroup autoSaveId="sidebar-ratio" direction="horizontal">
16 bedeeff Mardin 2y ago <Panel collapsible onExpand={expandSidebar} onCollapse={collapseSidebar} collapsedSize={5} defaultSize={20} maxSize={20} minSize={10} ref={ref}>
17 bedeeff Mardin 2y ago <Sidebar />
18 bedeeff Mardin 2y ago </Panel>
19 bedeeff Mardin 2y ago <PanelResizeHandle />
20 bedeeff Mardin 2y ago <Panel minSize={30} >
21 5825ea4 Mardin 2y ago <Box overflowY="auto" h="100vh" >
22 bedeeff Mardin 2y ago <Header />
23 5825ea4 Mardin 2y ago <Box p="6">
24 bedeeff Mardin 2y ago <Suspense>
25 bedeeff Mardin 2y ago <Outlet />
26 bedeeff Mardin 2y ago </Suspense>
27 bedeeff Mardin 2y ago </Box>
28 bedeeff Mardin 2y ago </Box>
29 bedeeff Mardin 2y ago </Panel>
30 6aab6f0 Mrdn 2y ago <Footer bottom={3} />
31 bedeeff Mardin 2y ago </PanelGroup>
32 bedeeff Mardin 2y ago );
33 bedeeff Mardin 2y ago };
34 bedeeff Mardin 2y ago
35 bedeeff Mardin 2y ago export default ConsoleLayout;