diff --git a/web/src/components/navbar/NavbarTopDropDownMenus.js b/web/src/components/navbar/NavbarTopDropDownMenus.js index 08c7246e..2aed4631 100644 --- a/web/src/components/navbar/NavbarTopDropDownMenus.js +++ b/web/src/components/navbar/NavbarTopDropDownMenus.js @@ -1,42 +1,52 @@ -import React, { useContext } from 'react'; +import React, {useContext, useEffect, useState} from 'react'; import PropTypes from 'prop-types'; import NavbarDropdown from './NavbarDropdown'; import NavbarDropdownComponents from './NavbarDropdownComponents'; -import { - // authenticationRoutes, - // chatRoutes, - // componentRoutes, - // ECommerceRoutes, - // emailRoutes, - // homeRoutes, - // pageRoutes, - // pluginRoutes, - // utilityRoutes, - // widgetsRoutes, - // kanbanRoutes, - dashboardRoutes, - spaceRoutes, - equipmentRoutes, - meterRoutes, - tenantRoutes, - storeRoutes, - shopfloorRoutes, - combinedEquipmentRoutes, - auxiliarySystemRoutes, - fddRoutes, - monitoringRoutes, - advancedReportingRoutes, - knowledgeBaseRoutes -} from '../../routes'; +// import { +// // authenticationRoutes, +// // chatRoutes, +// // componentRoutes, +// // ECommerceRoutes, +// // emailRoutes, +// // homeRoutes, +// // pageRoutes, +// // pluginRoutes, +// // utilityRoutes, +// // widgetsRoutes, +// // kanbanRoutes, +// } from '../../routes'; +import routes from '../../routes'; import { NavItem } from 'reactstrap'; import { NavLink } from 'react-router-dom'; -import { breakpoints, getPageName } from '../../helpers/utils'; -import { navbarBreakPoint, topNavbarBreakpoint } from '../../config'; +import {breakpoints, createCookie, getCookieValue, getPageName} from '../../helpers/utils'; +import {APIBaseURL, navbarBreakPoint, topNavbarBreakpoint} from '../../config'; import AppContext from '../../context/Context'; import { withTranslation } from 'react-i18next'; +import withRedirect from "../../hoc/withRedirect"; +import {toast} from "react-toastify"; -const NavbarTopDropDownMenus = ({ setNavbarCollapsed, setShowBurgerMenu, t }) => { +const NavbarTopDropDownMenus = ({ setRedirectUrl, setRedirect, setNavbarCollapsed, setShowBurgerMenu, t }) => { + + useEffect(() => { + let is_logged_in = getCookieValue('is_logged_in'); + let user_name = getCookieValue('user_name'); + let user_display_name = getCookieValue('user_display_name'); + let user_uuid = getCookieValue('user_uuid'); + let token = getCookieValue('token'); + if (is_logged_in === null || !is_logged_in) { + setRedirectUrl(`/authentication/basic/login`); + setRedirect(true); + } else { + //update expires time of cookies + createCookie('is_logged_in', true, 1000 * 60 * 60 * 8); + createCookie('user_name', user_name, 1000 * 60 * 60 * 8); + createCookie('user_display_name', user_display_name, 1000 * 60 * 60 * 8); + createCookie('user_uuid', user_uuid, 1000 * 60 * 60 * 8); + createCookie('token', token, 1000 * 60 * 60 * 8); + } + }); + const { isCombo, isTopNav } = useContext(AppContext); // const components = [componentRoutes, pluginRoutes, utilityRoutes]; // const pages = [pageRoutes, kanbanRoutes, widgetsRoutes, chatRoutes, emailRoutes, ECommerceRoutes]; @@ -46,8 +56,79 @@ const NavbarTopDropDownMenus = ({ setNavbarCollapsed, setShowBurgerMenu, t }) => isCombo && windowWidth < breakpoints[navbarBreakPoint] && setShowBurgerMenu(false); }; const isLanding = getPageName('landing'); + const [ showRoutes, setShowRoutes] = useState([routes[0]]); + + useEffect(() => { + let isResponseOK = false; + fetch(APIBaseURL + '/menus/web', { + method: 'GET', + headers: { + "Content-type": "application/json", + "User-UUID": getCookieValue('user_uuid'), + "Token": getCookieValue('token') + }, + body: null, + + }).then(response => { + //console.log(response); + if (response.ok) { + isResponseOK = true; + } + return response.json(); + }).then(json => { + //console.log(json); + if (isResponseOK) { + let showRoutes = [routes[0]]; + for (let i = 0; i < routes.length; i++) { + let route = routes[i]; + if(route.to in json && 'children' in route) { + let showChildren = []; + for (let j = 0; j < route.children.length; j++) { + const child = route.children[j]; + if(json[route.to].indexOf(child.to) !== -1) { + showChildren.push(child); + } + } + route.children = showChildren; + + showRoutes.push(route) + }else if(route.to in json) { + showRoutes.push(route) + } + } + setShowRoutes(showRoutes); + } else { + toast.error(json.description); + } + }).catch(err => { + console.log(err); + }); + }, []); + return ( <> + {showRoutes.map(route => + { + if ('children' in route) { + return( + + ) + } else { + return ( + + + {t(route.name)} + + + ) + } + } + )} {/* Documentation */} - - - {t(dashboardRoutes.name)} - - - - - - - - - - - - - - - {t(advancedReportingRoutes.name)} - - - - - {t(knowledgeBaseRoutes.name)} - - ); }; NavbarTopDropDownMenus.propTypes = { setNavbarCollapsed: PropTypes.func.isRequired }; -export default withTranslation()(NavbarTopDropDownMenus); +export default withTranslation()(withRedirect(NavbarTopDropDownMenus)); diff --git a/web/src/components/navbar/NavbarVertical.js b/web/src/components/navbar/NavbarVertical.js index 9375c196..9a8c8093 100644 --- a/web/src/components/navbar/NavbarVertical.js +++ b/web/src/components/navbar/NavbarVertical.js @@ -1,10 +1,10 @@ import classNames from 'classnames'; import is from 'is_js'; import PropTypes from 'prop-types'; -import React, { useContext, useEffect, useRef } from 'react'; -import { Button, Collapse, Nav, Navbar } from 'reactstrap'; +import React, {useContext, useEffect, useRef, useState} from 'react'; +import {Button, Collapse, Nav, Navbar, NavItem} from 'reactstrap'; import bgNavbarImg from '../../assets/img/generic/bg-navbar.png'; -import { navbarBreakPoint, topNavbarBreakpoint } from '../../config'; +import {APIBaseURL, navbarBreakPoint, topNavbarBreakpoint} from '../../config'; import AppContext from '../../context/Context'; import routes from '../../routes'; import Flex from '../common/Flex'; @@ -13,8 +13,31 @@ import NavbarTopDropDownMenus from './NavbarTopDropDownMenus'; import NavbarVerticalMenu from './NavbarVerticalMenu'; import ToggleButton from './ToggleButton'; import { withTranslation } from 'react-i18next'; +import {createCookie, getCookieValue} from "../../helpers/utils"; +import {toast} from "react-toastify"; +import withRedirect from "../../hoc/withRedirect"; + +const NavbarVertical = ({ setRedirectUrl, setRedirect, navbarStyle, t }) => { + + useEffect(() => { + let is_logged_in = getCookieValue('is_logged_in'); + let user_name = getCookieValue('user_name'); + let user_display_name = getCookieValue('user_display_name'); + let user_uuid = getCookieValue('user_uuid'); + let token = getCookieValue('token'); + if (is_logged_in === null || !is_logged_in) { + setRedirectUrl(`/authentication/basic/login`); + setRedirect(true); + } else { + //update expires time of cookies + createCookie('is_logged_in', true, 1000 * 60 * 60 * 8); + createCookie('user_name', user_name, 1000 * 60 * 60 * 8); + createCookie('user_display_name', user_display_name, 1000 * 60 * 60 * 8); + createCookie('user_uuid', user_uuid, 1000 * 60 * 60 * 8); + createCookie('token', token, 1000 * 60 * 60 * 8); + } + }); -const NavbarVertical = ({ navbarStyle, t }) => { const navBarRef = useRef(null); const { @@ -32,6 +55,8 @@ const NavbarVertical = ({ navbarStyle, t }) => { HTMLClassList.add('navbar-vertical-collapsed'); } + const [ showRoutes, setShowRoutes] = useState([routes[0]]); + useEffect(() => { if (is.windows()) { HTMLClassList.add('windows'); @@ -56,6 +81,56 @@ const NavbarVertical = ({ navbarStyle, t }) => { }, 100); } }; + + useEffect(() => { + let isResponseOK = false; + fetch(APIBaseURL + '/menus/web', { + method: 'GET', + headers: { + "Content-type": "application/json", + "User-UUID": getCookieValue('user_uuid'), + "Token": getCookieValue('token') + }, + body: null, + + }).then(response => { + //console.log(response); + if (response.ok) { + isResponseOK = true; + } + return response.json(); + }).then(json => { + //console.log(json); + if (isResponseOK) { + let showRoutes = [routes[0]]; + for (let i = 0; i < routes.length; i++) { + let route = routes[i]; + if(route.to in json && 'children' in route) { + let showChildren = []; + for (let j = 0; j < route.children.length; j++) { + const child = route.children[j]; + if(json[route.to].indexOf(child.to) !== -1) { + showChildren.push(child); + } + } + route.children = showChildren; + + showRoutes.push(route) + + }else if(route.to in json) { + showRoutes.push(route) + } + } + + setShowRoutes(showRoutes); + } else { + toast.error(json.description); + } + }).catch(err => { + console.log(err); + }); + }, [ ]); + return ( { } >
{isCombo && ( @@ -130,4 +205,4 @@ NavbarVertical.defaultProps = { navbarStyle: 'transparent' }; -export default withTranslation()(NavbarVertical); +export default withTranslation()(withRedirect(NavbarVertical));