opendash
Version:
open.DASH data visualization framework
29 lines • 2.27 kB
JavaScript
import * as React from "react";
import { Icon as LegacyIcon } from "@ant-design/compatible";
import { Layout, Menu } from "antd";
import { AppPortal, Hamburger, DashboardManagement, useTranslation, useNavigation, Boundary, } from "..";
import { useNavigate } from "react-router-dom";
export var DashboardLayout = React.memo(function DashboardLayoutComponent(_a) {
var children = _a.children;
var t = useTranslation(["openware", "opendash"])[0];
var navigate = useNavigate();
var _b = React.useState(false), open = _b[0], setOpen = _b[1];
var _c = useNavigation("sidebar"), groups = _c[0], activeItems = _c[2];
return (React.createElement(React.Fragment, null,
React.createElement(AppPortal, { place: "headerBeforeMenuLeft" },
React.createElement("div", { style: { paddingTop: 6, paddingRight: 10 } },
React.createElement(Hamburger, { open: open, setOpen: setOpen }))),
React.createElement(Layout, { style: { minHeight: "calc(100vh - 96px)", padding: 0 } },
React.createElement(Layout.Sider, { collapsible: true, collapsed: !open, collapsedWidth: 0, zeroWidthTriggerStyle: { display: "none" }, width: Math.min(400, window.innerWidth), style: { background: "#fff" } },
React.createElement(DashboardManagement, null),
React.createElement(Menu, { mode: "inline", selectedKeys: activeItems, defaultOpenKeys: groups.map(function (group) { return group.id; }) }, groups.map(function (group) { return (React.createElement(Menu.SubMenu, { key: group.id, title: React.createElement("span", null,
group.icon && React.createElement(LegacyIcon, { type: group.icon }),
" ",
group.label) }, group.children.map(function (route) { return (React.createElement(Menu.Item, { key: route.id, onClick: function (e) { return navigate(route.link); } },
route.icon && React.createElement(LegacyIcon, { type: route.icon }),
" ",
route.label)); }))); }))),
React.createElement(Layout.Content, null,
React.createElement(Boundary, null, children)))));
});
//# sourceMappingURL=DashboardLayout.js.map