45 lines
1.0 KiB
TypeScript
45 lines
1.0 KiB
TypeScript
import { useEffect } from 'react';
|
|
import { useRouter } from 'next/router';
|
|
|
|
import Titlebar from '@/components/Titlebar';
|
|
import Sidebar from '@/components/Sidebar';
|
|
import Explorer from '@/components/Explorer';
|
|
import Bottombar from '@/components/Bottombar';
|
|
import Tabsbar from '@/components/Tabsbar';
|
|
|
|
import styles from '@/styles/Layout.module.css';
|
|
|
|
interface LayoutProps {
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
const Layout = ({ children }: LayoutProps) => {
|
|
// set scroll to top of main content on url pathname change
|
|
const router = useRouter();
|
|
useEffect(() => {
|
|
const main = document.getElementById('main-editor');
|
|
if (main) {
|
|
main.scrollTop = 0;
|
|
}
|
|
}, [router.pathname]);
|
|
|
|
return (
|
|
<>
|
|
<Titlebar />
|
|
<div className={styles.main}>
|
|
<Sidebar />
|
|
<Explorer />
|
|
<div style={{ width: '100%' }}>
|
|
<Tabsbar />
|
|
<main id="main-editor" className={styles.content}>
|
|
{children}
|
|
</main>
|
|
</div>
|
|
</div>
|
|
<Bottombar />
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default Layout;
|