54 lines
1.1 KiB
TypeScript
54 lines
1.1 KiB
TypeScript
import styled from "@emotion/styled";
|
|
import { Drawer } from "@mui/material";
|
|
import DrawerContent from "./DrawerContent";
|
|
import DrawerFooter from "./DrawerFooter";
|
|
import DrawerHeader from "./DrawerHeader";
|
|
|
|
interface LeftDrawerProps {
|
|
open: boolean;
|
|
onClose: () => void;
|
|
newModel: () => void;
|
|
setModel: (key: string) => void;
|
|
onDelete: (uuid: string) => void;
|
|
localStorageId: number;
|
|
}
|
|
|
|
function LeftDrawer({
|
|
open,
|
|
onClose,
|
|
newModel,
|
|
setModel,
|
|
onDelete,
|
|
}: LeftDrawerProps) {
|
|
return (
|
|
<DrawerWrapper
|
|
variant="persistent"
|
|
anchor="left"
|
|
open={open}
|
|
onClose={onClose}
|
|
transitionDuration={0}
|
|
>
|
|
<DrawerHeader onNewModel={newModel} />
|
|
<DrawerContent setModel={setModel} onDelete={onDelete} />
|
|
|
|
<DrawerFooter />
|
|
</DrawerWrapper>
|
|
);
|
|
}
|
|
|
|
const DrawerWrapper = styled(Drawer)`
|
|
width: 264px;
|
|
height: 100%;
|
|
flex-shrink: 0;
|
|
font-family: "Inter", sans-serif;
|
|
|
|
.MuiDrawer-paper {
|
|
width: 264px;
|
|
background-color: #f5f5f5;
|
|
overflow: hidden;
|
|
border-right: 1px solid #e0e0e0;
|
|
}
|
|
`;
|
|
|
|
export default LeftDrawer;
|