feat: Add Layout with AppBar and Drawer

packages/web/src/components/Layout/index.tsx

@@ -0,0 +1,30 @@
+import { useState, useCallback } from 'react';
+import Box from '@mui/material/Box';
+import AppBar from 'components/AppBar';
+import Drawer from 'components/Drawer';
+import Toolbar from '@mui/material/Toolbar';
+
+type LayoutProps = {
+  children: React.ReactNode;
+}
+
+export default function Layout({ children }: LayoutProps) {
+  const [isDrawerOpen, setDrawerOpen] = useState(false);
+  const onMenuClick = useCallback(() => { setDrawerOpen(value => !value) }, []);
+
+  return (
+    <>
+      <AppBar onMenuClick={onMenuClick} />
+
+      <Box sx={{ display: 'flex', }}>
+        <Drawer open={isDrawerOpen} />
+
+        <Box sx={{ display: 'flex', flexDirection: 'column' }}>
+          <Toolbar />
+
+          {children}
+        </Box>
+      </Box>
+    </>
+  );
+}