import { FC } from 'react';
import { Sidebar } from '../sidebar/Sidebar';
import { Box, Toolbar } from '@mui/material';

interface LayoutProps {
  children: React.ReactNode;
}

const drawerWidth = 240;

export const Layout: FC<LayoutProps> = ({ children }) => {
  return (
    <Box sx={{ display: 'flex' }}>
      <Sidebar drawerWidth={drawerWidth} />

      <Box component='main' sx={{ flexGrow: 1, px: 3, py: 2 }}>
        <Toolbar />
        {children}
      </Box>
    </Box>
  );
};
