bootstrap-based-components
Version:
A Bootstrap based package with React components
38 lines (37 loc) • 2.06 kB
JavaScript
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import React from 'react';
import { Nav } from 'react-bootstrap';
import { Link, useLocation } from 'react-router-dom';
import './style.scss';
var Item = Nav.Item;
function SideMenu(_a) {
var routeConfig = _a.routeConfig, className = _a.className, children = _a.children;
var pathname = useLocation().pathname;
var configs = Object.entries(routeConfig);
var showMenu = configs
.filter(function (_a) {
var _ = _a[0], hideSideMenu = _a[1].hideSideMenu;
return hideSideMenu;
})
.find(function (_a) {
var _ = _a[0], path = _a[1].path;
return pathname.match(path.startsWith('/') ? path : "/" + path);
});
return (!showMenu
? (React.createElement(Nav, { className: "flex-column side-menu " + (className !== null && className !== void 0 ? className : '') },
React.createElement(Item, { className: "side-menu-item logo" },
React.createElement(Link, { to: "/" }, children)),
configs
.filter(function (config) { return !config[1].hideOnSideMenu; })
.map(function (config) {
var _a = config[1], path = _a.path, name = _a.name, icon = _a.icon;
var isSelected = pathname.includes(path);
var routePath = path.startsWith('/') ? path : "/" + path;
return (React.createElement(Item, { key: config[0], className: "side-menu-item " + config[0] + " " + (isSelected ? 'selected' : '') },
React.createElement(Link, { className: "side-menu-link", to: routePath },
icon && React.createElement(FontAwesomeIcon, { className: "side-menu-icon", icon: icon, size: "lg" }),
React.createElement("span", { className: "side-menu-name" }, name)),
isSelected && React.createElement("span", { className: "side-menu-selectedbar" })));
}))) : null);
}
export default SideMenu;