diff --git a/packages/aesirx-cmp-admin/package.json b/packages/aesirx-cmp-admin/package.json index e2e61c7..f9deacd 100644 --- a/packages/aesirx-cmp-admin/package.json +++ b/packages/aesirx-cmp-admin/package.json @@ -1,6 +1,6 @@ { "name": "aesirx-cmp-admin", - "version": "1.0.1", + "version": "1.0.2", "license": "GPL-3.0-only", "author": "AesirX", "main": "dist/index.js", diff --git a/packages/aesirx-cmp-admin/src/integration/index.js b/packages/aesirx-cmp-admin/src/integration/index.js index e69de29..5471bde 100644 --- a/packages/aesirx-cmp-admin/src/integration/index.js +++ b/packages/aesirx-cmp-admin/src/integration/index.js @@ -0,0 +1,5 @@ +export { default as BiIntegration } from './lib/MainLayoutIntegration'; +export { appLanguages } from '../translations'; +export { BiStoreProvider } from '../store/BiStore/BiViewModelContextProvider'; +export { BiViewModel } from '../store/BiStore/BiViewModel'; +export { DataStream } from '../components/DataStream'; diff --git a/packages/aesirx-cmp-admin/src/integration/lib/MainLayoutIntegration.jsx b/packages/aesirx-cmp-admin/src/integration/lib/MainLayoutIntegration.jsx new file mode 100644 index 0000000..af89ee4 --- /dev/null +++ b/packages/aesirx-cmp-admin/src/integration/lib/MainLayoutIntegration.jsx @@ -0,0 +1,226 @@ +/* + * @copyright Copyright (C) 2022 AesirX. All rights reserved. + * @license GNU General Public License version 3, see LICENSE. + */ + +import React, { lazy, Suspense, useEffect, useState } from 'react'; + +import { BiStoreProvider, useBiViewModel } from '../../store/BiStore/BiViewModelContextProvider'; +import { BiViewModel } from '../../store/BiStore/BiViewModel'; +import 'scss/app.scss'; + +import { observer } from 'mobx-react'; +import { Spinner, LoginPage } from 'aesirx-uikit'; +import { AppProvider } from 'aesirx-uikit'; +import { authRoutes, mainRoutes } from '../../routes/routes'; +import { DataStream } from '../../components/DataStream'; +import { appLanguages } from '../../translations'; +import SbarLeftIntegration from './SbarLeftIntegration'; +import { env, Storage } from 'aesirx-lib'; +import { freemiumMainMenu, getMainMenu } from 'routes/menu'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { useTranslation } from 'react-i18next'; +import { Dropdown } from 'react-bootstrap'; +import { faChevronDown } from '@fortawesome/free-solid-svg-icons'; + +const ConsentsPage = lazy(() => import('../../containers/ConsentsPage')); +const ConsentsTemplatePage = lazy(() => import('../../containers/ConsentsTemplatePage')); +const ConsentsAdvancePage = lazy(() => import('../../containers/ConsentsAdvancePage')); + +const biViewModel = new BiViewModel(); + +const MainLayoutIntegration = (props) => { + const isAuthenticated = Storage.getItem('auth'); + const isFreemium = props?.isFreemium ?? true; + return ( + + true} + componentHeader={} + integration={true} + isFreemium={isFreemium} + leftMenu={} + rootId="#biapp" + noavatar={true} + isColorMode={false} + > +
+ {!isAuthenticated && window.env.STORAGE === 'external' ? ( + + ) : ( + + )} +
+ + + ); +}; + +String.prototype.startsWith = function (str) { + return this.indexOf(str) === 0; +}; + +const RenderComponent = ({ link, ...props }) => { + const isFreemium = props?.isFreemium ?? true; + + if (isFreemium && ['consents-advance'].includes(link)) { + return ; + } + + switch (link) { + case 'consents': + return ; + + case 'consents-template': + return ; + + case 'consents-advance': + return ; + + default: + return ; + } +}; +const App = observer((props) => { + const { + biListViewModel: { integrationLink, activeDomain, setIntegrationLink }, + } = useBiViewModel(); + const { t } = useTranslation(); + const [menuList, setMenuList] = useState(getMainMenu(false)); + + const handleChangeLink = (e, link) => { + e.preventDefault(); + if (link) { + setIntegrationLink(link); + } + }; + + useEffect(() => { + if (props?.isFreemium) { + setMenuList(freemiumMainMenu); + } + }, [props?.isFreemium]); + + return ( + }> + {menuList ? ( +
+ {menuList?.map((menuList, menuListKey) => { + return ( +
+ {menuList?.link && ( + <> + {menuList?.submenu ? ( + + + {menuList?.icons_fa ? ( + + + + ) : ( + + )} + {t(menuList?.text)} + + + + + + + {menuList?.submenu?.map((submenuList, submenuListKey) => { + return ( +
handleChangeLink(e, submenuList?.page)} + > +
+ {t(submenuList?.text)} +
+
+ ); + })} + + + ) : ( + { + if (menuList?.page !== 'cmp') { + handleChangeLink(e, menuList?.page); + } + }} + className={`d-flex align-items-center me-3 px-4 py-10 text-decoration-none fw-medium border rounded-pill ${ + integrationLink === menuList.page ? 'active' : '' + } ${menuList?.page === 'cmp' && !env.REACT_APP_CMP_LINK ? 'd-none' : ''}`} + > + {menuList?.icons_fa ? ( + + + + ) : ( + + )} + {t(menuList?.text)} + + )} + + )} +
+ ); + })} +
+ ) : ( + <> + )} + + + ); +}); + +const NavHoverDropDown = (props) => { + const [dropdownOpen, setDropdownOpen] = useState(false); + const handleMouseOver = () => { + setDropdownOpen(true); + }; + const handleMouseOut = () => { + setDropdownOpen(false); + }; + return ( + + {props.children} + + ); +}; + +export default MainLayoutIntegration; diff --git a/packages/aesirx-cmp-admin/src/integration/lib/SbarLeftIntegration.jsx b/packages/aesirx-cmp-admin/src/integration/lib/SbarLeftIntegration.jsx new file mode 100644 index 0000000..f61930c --- /dev/null +++ b/packages/aesirx-cmp-admin/src/integration/lib/SbarLeftIntegration.jsx @@ -0,0 +1,188 @@ +/* + * @copyright Copyright (C) 2022 AesirX. All rights reserved. + * @license GNU General Public License version 3, see LICENSE. + */ + +import React, { useEffect, useState } from 'react'; +import { useTranslation } from 'react-i18next'; + +import { observer } from 'mobx-react'; +import { env } from 'aesirx-lib'; + +import { Collapse } from 'react-bootstrap'; +import { useBiViewModel } from '../../store/BiStore/BiViewModelContextProvider'; +import { getMainMenu, freemiumMainMenu } from '../../routes/menu'; + +const SbarLeftIntegration = observer((props) => { + const [isOpenCollapse, setIsOpenCollapse] = useState('default'); + const [dataStreamActive, setDataStreamActive] = useState( + env.REACT_APP_DATA_STREAM && JSON.parse(env.REACT_APP_DATA_STREAM)[0].domain + ); + const biStore = useBiViewModel(); + const { t } = useTranslation(); + + const [menuList, setMenuList] = useState(getMainMenu(false)); + const handleOpen = (clickedIndex, parentIndex) => { + if (isOpenCollapse === clickedIndex.toString()) { + if (parentIndex) { + setIsOpenCollapse(parentIndex.toString()); + } else { + setIsOpenCollapse(null); + } + } else { + if (isOpenCollapse?.includes(clickedIndex.toString())) { + setIsOpenCollapse(null); + } else { + setIsOpenCollapse(clickedIndex.toString()); + } + } + }; + + const handleChangeLink = (e, link) => { + e.preventDefault(); + + if (link) { + biStore.biListViewModel.setIntegrationLink(link); + } + }; + + useEffect(() => { + let fetchData = async () => { + if (biStore.biListViewModel.activeDomain) { + biStore.biListViewModel.setActiveDomain(biStore.biListViewModel.activeDomain); + setDataStreamActive(`${biStore.biListViewModel.activeDomain}`); + } + }; + + fetchData(); + }, [biStore.biListViewModel.activeDomain, dataStreamActive]); + + useEffect(() => { + if (props?.isFreemium) { + setMenuList(freemiumMainMenu); + } + }, [props?.isFreemium]); + + return ( + + ); +}); + +export default SbarLeftIntegration; diff --git a/packages/aesirx-cmp-admin/src/routes/menu.js b/packages/aesirx-cmp-admin/src/routes/menu.js index 6a31c6b..1d4fede 100644 --- a/packages/aesirx-cmp-admin/src/routes/menu.js +++ b/packages/aesirx-cmp-admin/src/routes/menu.js @@ -1,3 +1,33 @@ +const freemiumMainMenu = [ + { + text: 'txt_ai_privacy_advisor', + mini_text: 'txt_ai_privacy_advisor', + link: `/ai-advisor`, + page: 'ai-advisor', + }, + { + text: 'txt_consent_modal', + mini_text: 'txt_consent_modal', + link: `/consent-template`, + page: 'consent-template', + }, + { + text: 'txt_consent_logic', + mini_text: 'txt_consent_logic', + link: `/consent-logic`, + }, + { + text: 'txt_consent_log', + mini_text: 'txt_consent_log', + link: `/consents`, + }, + { + text: 'txt_geo_handling', + mini_text: 'txt_geo_handling', + link: `/geo-handling`, + }, +]; + const getMainMenu = (isAdmin = false) => { const mainMenu = [ { @@ -75,4 +105,4 @@ const getMainMenu = (isAdmin = false) => { return mainMenu; }; -export { getMainMenu }; +export { freemiumMainMenu, getMainMenu };