@agilemotion/oui-react-js 1.3.9 → 1.4.0

package/dist/components/HtmlPanel.js

@@ -13,7 +13,7 @@ var _reactHtmlRenderer = _interopRequireDefault(require("react-html-renderer"));
 
 var _Observable = _interopRequireDefault(require("../event/Observable"));
 
-var _ApplicationContext = _interopRequireDefault(require("../ApplicationContext"));
+var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
 
 var _reactPromiseTracker = require("react-promise-tracker");
 
@@ -65,7 +65,7 @@ const HtmlPanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.
 
     _Observable.default.addSubscriptions(parsedConfig.eventHandlingConfig, props.handle, props.viewId);
 
-    _Observable.default.addSystemSubscriptions(parsedConfig);
+    _Observable.default.addSystemSubscriptions(props.viewId, parsedConfig);
 
     let configTemplate = props.config.template;
 
@@ -102,6 +102,9 @@ const HtmlPanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.
 
     });
     props.handle.api.refresh();
+    return () => {
+      _Observable.default.clearComponentEventListeners(props.handle);
+    };
   }, []);
 
   const api = () => {
@@ -112,7 +115,7 @@ const HtmlPanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.
 
       loadData: actionConfig => {
         if (actionConfig && actionConfig.value) {
-          let data = _ApplicationContext.default.resolveExpressionValue(actionConfig.value);
+          let data = _ApplicationManager.default.resolveExpressionValue(actionConfig.value);
 
           let templateScript = Handlebars.compile(template);
           setContent(templateScript(data));
@@ -120,8 +123,10 @@ const HtmlPanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.
       },
 
       refresh() {
-        if (!_Utils.default.isNull(props.config) && !_Utils.default.isNull(props.config.visible)) {
-          setVisible(_Utils.default.evaluateBooleanExpression(props.config.visible, props.config.id));
+        let parsedConfig = _Utils.default.parseConfig(props.config, props.viewId);
+
+        if (!_Utils.default.isNull(props.config) && !_Utils.default.isNull(parsedConfig.visible)) {
+          setVisible(_Utils.default.evaluateBooleanExpression(parsedConfig.visible, parsedConfig.id));
         } else {
           setVisible(true);
         }

package/dist/components/Icon.js

@@ -215,6 +215,14 @@ class Icon extends _react.Component {
       });
     } else if (this.props.id === 'RECORD') {
       return /*#__PURE__*/_react.default.createElement(_icons.FiberManualRecord, null);
+    } else if (this.props.id === 'PLAY') {
+      return /*#__PURE__*/_react.default.createElement(_icons.PlayArrow, null);
+    } else if (this.props.id === 'STOP') {
+      return /*#__PURE__*/_react.default.createElement(_icons.Stop, {
+        style: {
+          color: this.props.color
+        }
+      });
     }
 
     return null;

package/dist/components/PopupView.js

@@ -84,7 +84,7 @@ function PopupView(props) {
     props.controller.close = () => {
       setView(null);
     };
-  });
+  }, []);
 
   return view !== null ? /*#__PURE__*/_react.default.createElement(PopupViewDialog, {
     view: view

package/dist/components/Portlet.js

@@ -0,0 +1,100 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Utils = _interopRequireDefault(require("../Utils"));
+
+var _reactHtmlRenderer = _interopRequireDefault(require("react-html-renderer"));
+
+var _Observable = _interopRequireDefault(require("../event/Observable"));
+
+var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
+
+var _reactPromiseTracker = require("react-promise-tracker");
+
+var _Event = _interopRequireDefault(require("../event/Event"));
+
+var _EventType = _interopRequireDefault(require("../event/EventType"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const Portlet = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const [url, setUrl] = _react.default.useState(null);
+
+  const [visible, setVisible] = _react.default.useState(true);
+
+  _react.default.useEffect(() => {
+    props.handle.api = api();
+  });
+
+  _react.default.useEffect(() => {
+    props.handle.api = api();
+
+    let parsedConfig = _Utils.default.parseConfig(props.config, props.viewId);
+
+    _Observable.default.addSubscriptions(parsedConfig.eventHandlingConfig, props.handle, props.viewId);
+
+    _Observable.default.addSystemSubscriptions(props.viewId, parsedConfig);
+
+    return () => {
+      _Observable.default.clearComponentEventListeners(props.handle);
+    };
+  }, []);
+
+  const api = () => {
+    return {
+      get id() {
+        return props.config.id;
+      },
+
+      loadData: actionConfig => {
+        if (actionConfig && actionConfig.value) {
+          setUrl(actionConfig.value);
+        } else {
+          setUrl(props.config.url);
+        }
+      },
+
+      refresh() {},
+
+      getChildren: () => {
+        return [];
+      },
+
+      set visible(visible) {
+        setVisible(visible);
+      }
+
+    };
+  };
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    ref: ref,
+    style: {
+      display: visible ? 'block' : 'none',
+      width: '100%',
+      height: '100%'
+    }
+  }, !url && /*#__PURE__*/_react.default.createElement("div", {
+    className: "centered-flex-box w-100 h-100",
+    style: {
+      fontSize: '20px'
+    }
+  }, "Loading..."), url && /*#__PURE__*/_react.default.createElement("iframe", {
+    src: url,
+    title: "eProcurement",
+    style: {
+      width: '100%',
+      height: '99%',
+      borderWidth: '0'
+    }
+  }));
+}));
+
+var _default = Portlet;
+exports.default = _default;

package/dist/components/SignaturePanel.js

@@ -39,7 +39,7 @@ const SignaturePanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.def
 
     _Observable.default.addSubscriptions(parsedConfig.eventHandlingConfig, props.handle, props.viewId);
 
-    _Observable.default.addSystemSubscriptions(parsedConfig);
+    _Observable.default.addSystemSubscriptions(props.viewId, parsedConfig);
   });
 
   _react.default.useEffect(() => {

package/dist/components/SocketManager.js

@@ -11,7 +11,7 @@ var _SocketRequest = _interopRequireDefault(require("./media/SocketRequest"));
 
 var _RestUtils = require("../RestUtils");
 
-var _ApplicationContext = _interopRequireDefault(require("../ApplicationContext"));
+var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
 
 var _EventType = _interopRequireDefault(require("../event/EventType"));
 
@@ -126,7 +126,7 @@ class SocketManager {
   }
 
   registerOnline() {
-    (0, _RestUtils.sendRequest)(_RestUtils.location + _ApplicationContext.default.getContextRoot() + '/auth/api/v1/user/admin/find', response => {
+    (0, _RestUtils.sendRequest)(_RestUtils.location + _ApplicationManager.default.getContextRoot() + '/auth/api/v1/user/admin/find', response => {
       this.profile = response.profile;
       this.emitEvent(_SocketRequest.default.REGISTER_ONLINE, {
         user: {

package/dist/components/StepperTitleBar.js

@@ -9,7 +9,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _Utils = _interopRequireDefault(require("../Utils"));
 
-var _ApplicationContext = _interopRequireDefault(require("../ApplicationContext"));
+var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
 
 var _Observable = _interopRequireDefault(require("../event/Observable"));
 
@@ -54,7 +54,7 @@ const StepperTitleBar = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.de
     let eventHandlingConfig = _Utils.default.isNull(parsedConfig.eventHandlingConfig) ? {} : parsedConfig.eventHandlingConfig;
     eventHandlingConfig.subscriptions = _Utils.default.isNull(eventHandlingConfig.subscriptions) ? [] : eventHandlingConfig.subscriptions;
     let subscription = {
-      publisher: "applicationContext",
+      publisher: "applicationManager",
       eventType: _EventType.default.APPLICATION_CONTEXT_CHANGE,
       actions: [{
         actionType: "script",
@@ -103,10 +103,10 @@ const StepperTitleBar = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.de
       },
 
       show() {
-        let steps = _ApplicationContext.default.graphs[0].getTitleStack();
+        let steps = _ApplicationManager.default.graphs[0].getTitleStack();
 
         setSteps(steps);
-        currentIndex.current = _ApplicationContext.default.graphs[0].getCurrentNodeIndex();
+        currentIndex.current = _ApplicationManager.default.graphs[0].getCurrentNodeIndex();
         setActiveSegmentPercentage(100 - 10 * (steps.length - 1));
       }
 

package/dist/components/TabPanel.js

@@ -21,7 +21,9 @@ var _Section = _interopRequireDefault(require("./form/Section"));
 
 var _Toolbar = _interopRequireDefault(require("./Toolbar"));
 
-var _ApplicationContext = _interopRequireDefault(require("../ApplicationContext"));
+var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
+
+var _Layout = require("./layout/Layout");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -72,7 +74,7 @@ const TabPanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
           }
         }
 
-        if (_ApplicationContext.default.isFormMarkersEnabled() && shouldRefresh) {
+        if (_ApplicationManager.default.isFormMarkersEnabled() && shouldRefresh) {
           setErrors(JSON.parse(JSON.stringify(containerErrors)));
         }
       });
@@ -100,6 +102,12 @@ const TabPanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
       key: index,
       ref: /*#__PURE__*/_react.default.createRef(),
       viewId: props.viewId
+    }) : component.type === 'layout' ? /*#__PURE__*/_react.default.createElement(_Layout.Layout, {
+      config: component,
+      handle: createComponentHandle(component),
+      key: index,
+      ref: /*#__PURE__*/_react.default.createRef(),
+      viewId: props.viewId
     }) : /*#__PURE__*/_react.default.createElement("div", null, 'Unsupported component type ' + component.type);
   }
 
@@ -163,7 +171,7 @@ const TabPanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
     }, a11yProps(index), {
       key: index,
       style: {
-        color: _ApplicationContext.default.isFormMarkersEnabled() && !_Utils.default.isNull(props.form) && errors !== null && errors[page.id] === true ? '#ed5249' : null
+        color: _ApplicationManager.default.isFormMarkersEnabled() && !_Utils.default.isNull(props.form) && errors !== null && errors[page.id] === true ? '#ed5249' : null
       }
     }));
   }) : null)), !_Utils.default.isNull(props.config) && !_Utils.default.isNull(props.config.tabPages) && props.config.tabPages.length > 0 ? props.config.tabPages.map((page, index) => {

package/dist/components/TableCellContent.js

@@ -21,7 +21,7 @@ var _Error = _interopRequireDefault(require("@material-ui/icons/Error"));
 
 var _Tooltip = _interopRequireDefault(require("./Tooltip"));
 
-var _ApplicationContext = _interopRequireDefault(require("../ApplicationContext"));
+var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 

package/dist/components/TemplateDesigner.js

@@ -29,7 +29,7 @@ var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
 
 var _reactPromiseTracker = require("react-promise-tracker");
 
-var _ApplicationContext = _interopRequireDefault(require("../ApplicationContext"));
+var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
 
 var _reactHtmlRenderer = _interopRequireDefault(require("react-html-renderer"));
 
@@ -168,7 +168,7 @@ const TemplateDesigner = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.d
 
     _Observable.default.addSubscriptions(parsedConfig.eventHandlingConfig, props.handle, props.viewId);
 
-    _Observable.default.addSystemSubscriptions(parsedConfig);
+    _Observable.default.addSystemSubscriptions(props.viewId, parsedConfig);
 
     setLoading(false);
   }, []);
@@ -255,13 +255,13 @@ const TemplateDesigner = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.d
     templateData.templateType = templateType;
     templateData.payloadBase64 = btoa(payload);
     let fetchConfig = getFetchConfig(JSON.stringify(templateData), 'POST', 'application/json');
-    let url = location + _ApplicationContext.default.getContextRoot() + props.config.templateStorageUrl;
+    let url = location + _ApplicationManager.default.getContextRoot() + props.config.templateStorageUrl;
     (0, _reactPromiseTracker.trackPromise)(fetch(encodeURI(url), fetchConfig).then(status).then(json).then(data => {//alert('SAVE RESULT : ' + JSON.stringify(data));
     }).catch(e => {
       if (e.code === 401) {
-        _ApplicationContext.default.clear();
+        _ApplicationManager.default.clear();
 
-        _ApplicationContext.default.getApplicationHistory().push('/login');
+        _ApplicationManager.default.getApplicationHistory().push('/login');
       }
     }));
   };
@@ -269,15 +269,15 @@ const TemplateDesigner = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.d
   const handleOk = () => {
     let fetchConfig = getFetchConfig(null, 'GET');
     setFileDialogOpen(false);
-    (0, _reactPromiseTracker.trackPromise)(fetch(encodeURI(location + _ApplicationContext.default.getContextRoot() + props.config.metaDataUrl + '/' + templateType.id), fetchConfig).then(status).then(json).then(data => {
+    (0, _reactPromiseTracker.trackPromise)(fetch(encodeURI(location + _ApplicationManager.default.getContextRoot() + props.config.metaDataUrl + '/' + templateType.id), fetchConfig).then(status).then(json).then(data => {
       let designData = JSON.parse(data);
       setDesignData(designData);
       setTemplateDoc(atob(designData.template.payloadBase64));
     }).catch(e => {
       if (e.code === 401) {
-        _ApplicationContext.default.clear();
+        _ApplicationManager.default.clear();
 
-        _ApplicationContext.default.getApplicationHistory().push('/login');
+        _ApplicationManager.default.getApplicationHistory().push('/login');
       }
     }));
   };
@@ -291,14 +291,14 @@ const TemplateDesigner = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.d
     let data = new FormData();
     data.append('file', file);
     let fetchConfig = getFetchConfig(data, 'POST');
-    let url = location + _ApplicationContext.default.getContextRoot() + props.config.documentConverterBaseUrl + "/PDF/HTML";
+    let url = location + _ApplicationManager.default.getContextRoot() + props.config.documentConverterBaseUrl + "/PDF/HTML";
     (0, _reactPromiseTracker.trackPromise)(fetch(encodeURI(url), fetchConfig).then(status).then(json).then(data => {
       setTemplateHtml(data);
     }).catch(e => {
       if (e.code === 401) {
-        _ApplicationContext.default.clear();
+        _ApplicationManager.default.clear();
 
-        _ApplicationContext.default.getApplicationHistory().push('/login');
+        _ApplicationManager.default.getApplicationHistory().push('/login');
       }
     }));
   };

package/dist/components/TitleBar.js

@@ -9,7 +9,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _Utils = _interopRequireDefault(require("../Utils"));
 
-var _ApplicationContext = _interopRequireDefault(require("../ApplicationContext"));
+var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
 
 var _Observable = _interopRequireDefault(require("../event/Observable"));
 
@@ -42,7 +42,7 @@ const TitleBar = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
 
     if (_Utils.default.isNull(titleValue)) {
       let subscription = {
-        publisher: 'applicationContext',
+        publisher: 'applicationManager',
         eventType: _EventType.default.APPLICATION_CONTEXT_CHANGE,
         actions: [{
           actionType: 'script',
@@ -77,7 +77,8 @@ const TitleBar = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
   };
 
   return /*#__PURE__*/_react.default.createElement("div", {
-    ref: ref
+    ref: ref,
+    className: 'title-bar'
   }, /*#__PURE__*/_react.default.createElement("div", {
     style: {
       padding: '32px 0 4px 0',

package/dist/components/Toolbar.js

@@ -52,16 +52,34 @@ const Toolbar = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
 
   const [alignment] = _react.default.useState(_Utils.default.getComponentAttribute(props.config, 'alignment', 'left'));
 
+  const [config, setConfig] = _react.default.useState(null);
+
   let itemKeyCounter = 0;
   let sectionKeyCounter = 0;
 
   _react.default.useEffect(() => {
     props.handle.api = api();
+  });
 
-    _Observable.default.addSubscriptions(props.config.eventHandlingConfig, props.handle, props.viewId);
+  _react.default.useEffect(() => {
+    if (config) {
+      props.handle.api = api();
 
-    _Observable.default.addSystemSubscriptions(props.config);
-  });
+      let parsedConfig = _Utils.default.parseConfig(config, props.viewId);
+
+      _Observable.default.addSubscriptions(parsedConfig.eventHandlingConfig, props.handle, props.viewId);
+
+      _Observable.default.addSystemSubscriptions(props.viewId, parsedConfig);
+    }
+  }, [config]);
+
+  _react.default.useEffect(() => {
+    var _props$tableRow$id;
+
+    setConfig(props.tableRow ? { ...props.config,
+      id: props.config.id + '_' + ((_props$tableRow$id = props.tableRow.id) === null || _props$tableRow$id === void 0 ? void 0 : _props$tableRow$id.replaceAll('-', ''))
+    } : props.config);
+  }, []);
 
   function createItemHandle() {
     let handle = {};
@@ -69,6 +87,19 @@ const Toolbar = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     return handle;
   }
 
+  function getDefaultStyle(item) {
+    var _item$attributes, _item$attributes$styl, _item$attributes2, _item$attributes2$sty, _item$attributes3, _item$attributes3$sty;
+
+    return {
+      height: item.type === 'toolbarSpacer' ? (_item$attributes = item.attributes) !== null && _item$attributes !== void 0 && (_item$attributes$styl = _item$attributes.style) !== null && _item$attributes$styl !== void 0 && _item$attributes$styl.height ? (_item$attributes2 = item.attributes) === null || _item$attributes2 === void 0 ? void 0 : (_item$attributes2$sty = _item$attributes2.style) === null || _item$attributes2$sty === void 0 ? void 0 : _item$attributes2$sty.height : '100%' : null,
+      width: item.type === 'toolbarSpacer' ? '2' ? (_item$attributes3 = item.attributes) === null || _item$attributes3 === void 0 ? void 0 : (_item$attributes3$sty = _item$attributes3.style) === null || _item$attributes3$sty === void 0 ? void 0 : _item$attributes3$sty.width : '100%' : null,
+      minWidth: item.type === 'toolbarSpacer' ? '2' : _Utils.default.isNull(item.attributes) || _Utils.default.isNull(item.attributes['label']) ? '60px' : null,
+      marginLeft: item.type === 'toolbarSpacer' ? '4px' : 0,
+      marginRight: 4,
+      marginTop: item.type === 'toolbarSpacer' ? '6px' : 0
+    };
+  }
+
   function renderItem(item, defaultId) {
     if (_Utils.default.isNull(item.id)) {
       item.id = defaultId;
@@ -78,11 +109,13 @@ const Toolbar = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
       config: item,
       handle: createItemHandle(),
       ref: /*#__PURE__*/_react.default.createRef(),
+      tableRow: props.tableRow,
       viewId: props.viewId
     }) : item.type === 'button' ? /*#__PURE__*/_react.default.createElement(_Button.default, {
       config: item,
       handle: createItemHandle(),
       ref: /*#__PURE__*/_react.default.createRef(),
+      tableRow: props.tableRow,
       viewId: props.viewId
     }) : item.type === 'toolbarSpacer' ? /*#__PURE__*/_react.default.createElement("div", {
       className: classes.spacer
@@ -110,13 +143,7 @@ const Toolbar = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
       return /*#__PURE__*/_react.default.createElement("div", {
         className: 'col-*-*',
         key: index,
-        style: _Utils.default.mergeStyles({
-          height: item.type === 'toolbarSpacer' ? '100%' : null,
-          minWidth: item.type === 'toolbarSpacer' ? '2' : _Utils.default.isNull(item.attributes) || _Utils.default.isNull(item.attributes['label']) ? '60px' : null,
-          marginLeft: item.type === 'toolbarSpacer' ? '4px' : 0,
-          marginRight: 0,
-          marginTop: item.type === 'toolbarSpacer' ? '6px' : 0
-        }, item)
+        style: getDefaultStyle(item)
       }, renderItem(item, 'toolbar_item_' + counter + '_' + itemCounter++));
     })));
   }
@@ -125,7 +152,11 @@ const Toolbar = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     return {
       get id() {
         // Toolbar
-        return props.config.id;
+        return config ? config.id : props.config.id;
+      },
+
+      get tableRow() {
+        return props.tableRow;
       },
 
       getChildren: () => {

package/dist/components/Tree.js

@@ -33,7 +33,7 @@ var _Observable = _interopRequireDefault(require("../event/Observable"));
 
 var _EventType = _interopRequireDefault(require("../event/EventType"));
 
-var _ApplicationContext = _interopRequireDefault(require("../ApplicationContext"));
+var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -145,7 +145,7 @@ const Tree = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
       return ref;
     }, props.viewId);
 
-    _Observable.default.addSystemSubscriptions(parsedConfig);
+    _Observable.default.addSystemSubscriptions(props.viewId, parsedConfig);
 
     setInitializing(false);
   }, []);
@@ -171,7 +171,7 @@ const Tree = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
         _Utils.default.publishSystemErrorMessage(props.viewId);
       }, parameter => {});
     } else if (!_Utils.default.isNull(componentConfig.value)) {
-      let value = _ApplicationContext.default.isExpression(componentConfig.value) ? _ApplicationContext.default.resolveExpressionValue(componentConfig.value) : componentConfig.value;
+      let value = _ApplicationManager.default.isExpression(componentConfig.value) ? _ApplicationManager.default.resolveExpressionValue(componentConfig.value) : componentConfig.value;
     }
   }
 

package/dist/components/dashboard/BasicBusinessAppDashboard.js

@@ -15,6 +15,8 @@ var _Utils = _interopRequireDefault(require("../../Utils"));
 
 var _ViewPort = _interopRequireDefault(require("../layout/ViewPort"));
 
+var _Window = _interopRequireDefault(require("../layout/Window"));
+
 var _reactRouterDom = require("react-router-dom");
 
 var _perfectScrollbar = _interopRequireDefault(require("perfect-scrollbar"));
@@ -27,10 +29,12 @@ var _reactRedux = require("react-redux");
 
 var _DashboardStore = require("../../redux/store/DashboardStore");
 
-var _ApplicationContext = _interopRequireDefault(require("../../ApplicationContext"));
+var _ApplicationManager = _interopRequireDefault(require("../../ApplicationManager"));
 
 var _SocketManager = _interopRequireDefault(require("../SocketManager"));
 
+var _WindowViewPort = _interopRequireDefault(require("../layout/WindowViewPort"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -289,11 +293,11 @@ const BasicBusinessAppDashboard = props => {
   };
 
   function launchDashboard() {
-    _ApplicationContext.default.closeCurrentView(false);
+    _ApplicationManager.default.closeAllViews();
 
-    _ApplicationContext.default.getViewPortHistory().push('/switch');
+    _ApplicationManager.default.navigate('/switch');
 
-    _ApplicationContext.default.getViewPortHistory().push('/view/dashboard');
+    _ApplicationManager.default.navigate('/view/dashboard');
   }
 
   return loading ? /*#__PURE__*/_react.default.createElement("div", null, "Loading...") : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
@@ -348,9 +352,7 @@ const BasicBusinessAppDashboard = props => {
     logoutCallBack: props.logoutCallBack
   })), ' ', /*#__PURE__*/_react.default.createElement("div", {
     className: "content"
-  }, /*#__PURE__*/_react.default.createElement(_ViewPort.default, {
-    settings: props.settings
-  }))), ' '));
+  }, /*#__PURE__*/_react.default.createElement(_ViewPort.default, null), /*#__PURE__*/_react.default.createElement(_WindowViewPort.default, null))), ' '));
 };
 
 BasicBusinessAppDashboard.propTypes = {

package/dist/components/dashboard/components/Header.js

@@ -77,7 +77,7 @@ const Header = props => {
   };
 
   _react.default.useEffect(() => {
-    let listener = new _EventListener.default(null, "dashboard", "applicationContext", _EventType.default.APPLICATION_CONTEXT_CHANGE, null, e => {
+    let listener = new _EventListener.default(null, "dashboard", "applicationManager", _EventType.default.APPLICATION_CONTEXT_CHANGE, null, e => {
       if (e.data.property.name === 'title') {
         setTitle(e.data.property.value);
       }

package/dist/components/dashboard/components/blackDashboard/sidebar/Sidebar.css

@@ -0,0 +1,7 @@
+.sidebar .nav, .off-canvas-sidebar .nav {
+    list-style-type: none !important;
+}
+
+.sidebar .nav a:before {
+    content: none !important;
+}