59 lines
1.4 KiB
JavaScript
59 lines
1.4 KiB
JavaScript
// Sidebar.js
|
|
import React from "react";
|
|
import { Link } from "react-router-dom";
|
|
import { Layout, Menu } from "antd";
|
|
import {
|
|
DashboardOutlined,
|
|
PrinterOutlined,
|
|
PlayCircleOutlined,
|
|
FileOutlined,
|
|
} from "@ant-design/icons";
|
|
|
|
import FillamentIcon from "../../Icons/FillamentIcon"
|
|
import GCodeFileIcon from "../../Icons/GCodeFileIcon";
|
|
|
|
const { Sider } = Layout;
|
|
|
|
const Sidebar = () => {
|
|
const items = [
|
|
{
|
|
key: "overview",
|
|
label: <Link to="/dashboard/overview">Overview</Link>,
|
|
icon: <DashboardOutlined />,
|
|
},
|
|
{
|
|
key: "printers",
|
|
label: <Link to="/dashboard/printers">Printers</Link>,
|
|
icon: <PrinterOutlined />,
|
|
},
|
|
{
|
|
key: "jobs",
|
|
label: <Link to="/dashboard/printjobs">Print Jobs</Link>,
|
|
icon: <PlayCircleOutlined />,
|
|
},
|
|
{
|
|
key: "fillaments",
|
|
label: <Link to="/dashboard/fillaments">Fillaments</Link>,
|
|
icon: <FillamentIcon />,
|
|
},
|
|
{
|
|
key: "gcodefiles",
|
|
label: <Link to="/dashboard/gcodefiles">G Code Files</Link>,
|
|
icon: <GCodeFileIcon />,
|
|
},
|
|
];
|
|
return (
|
|
<Sider width={250} className="site-layout-background" collapsible>
|
|
<Menu
|
|
mode="inline"
|
|
defaultSelectedKeys={["1"]}
|
|
defaultOpenKeys={["sub1"]}
|
|
style={{ height: "100%", borderRight: 0 }}
|
|
items={items}
|
|
/>
|
|
</Sider>
|
|
);
|
|
};
|
|
|
|
export default Sidebar;
|