asab_webui_shell 26.2.1 → 26.3.2

package/dist/config/ConfigService.js

@@ -5,12 +5,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _asab_webui_components = require("asab_webui_components");
 var _ConfigReducer = _interopRequireDefault(require("./ConfigReducer"));
 var _actions = require("../actions");
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class ConfigService extends _asab_webui_components.Service {
   constructor(app) {
     var serviceName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "ConfigService";
@@ -19,53 +16,25 @@ class ConfigService extends _asab_webui_components.Service {
     this.Config = new Config();
   }
   initialize() {
-    var _document$getElements, _document$getElements2, _document$getElements3, _document$getElements4, _document$getElements5, _document$getElements6;
-    // Initialization of dynamic configuration
-    var headerLogoFull = (_document$getElements = document.getElementsByName('header-logo-full')[0]) === null || _document$getElements === void 0 ? void 0 : _document$getElements.content;
-    var headerLogoMini = (_document$getElements2 = document.getElementsByName('header-logo-minimized')[0]) === null || _document$getElements2 === void 0 ? void 0 : _document$getElements2.content;
-    var headerLogoFullDark = (_document$getElements3 = document.getElementsByName('header-logo-full-dark')[0]) === null || _document$getElements3 === void 0 ? void 0 : _document$getElements3.content;
-    var headerLogoMiniDark = (_document$getElements4 = document.getElementsByName('header-logo-minimized-dark')[0]) === null || _document$getElements4 === void 0 ? void 0 : _document$getElements4.content;
-    var title = (_document$getElements5 = document.getElementsByName('title')[0]) === null || _document$getElements5 === void 0 ? void 0 : _document$getElements5.content;
-    var customCSS = (_document$getElements6 = document.getElementsByName('custom-css-file')[0]) === null || _document$getElements6 === void 0 ? void 0 : _document$getElements6.content;
+    var _document$getElements, _document$getElements2;
+    /*
+    	Initialization of dynamic configuration
+    		Dynamic branding of the header logo can be done via nginx location configuration.
+    	The support of meta tags for configuration of the header logo brand image has been striped of in 09/2025
+    	from ASAB WebUI Shell version 26.3.1
+    		Example of setting up the nginx location for full logo. Same way it can be done for minimized variation.
+    		...
+    		location /<app path>/media/logo/header-logo-full-dark.svg {
+    		alias /<path to logo>/<logo name for dark theme>.svg;
+    	}
+    		location /<app path>/media/logo/header-logo-full.svg {
+    		alias /<path to logo>/<logo name for light theme>.svg;
+    	}
+    		...
+    	*/
+    var title = (_document$getElements = document.getElementsByName('title')[0]) === null || _document$getElements === void 0 ? void 0 : _document$getElements.content;
+    var customCSS = (_document$getElements2 = document.getElementsByName('custom-css-file')[0]) === null || _document$getElements2 === void 0 ? void 0 : _document$getElements2.content;
     var dynamicConfig = {};
-    // determine if any logos have been dynamically configured and assign brandImage property as an empty object
-    if (headerLogoFull != undefined && headerLogoFull != "" || headerLogoFullDark != undefined && headerLogoFullDark != "" || headerLogoMini != undefined && headerLogoMini != "" || headerLogoMiniDark != undefined && headerLogoMiniDark != "") {
-      dynamicConfig.brandImage = {};
-    }
-    // If header's full light logo has been configured, add it to dynamic config object
-    if (headerLogoFull != undefined && headerLogoFull != "") {
-      Object.assign(dynamicConfig.brandImage, {
-        "light": {
-          "full": headerLogoFull
-        }
-      });
-    }
-    // If header's full dark logo has been configured, extend/add it to dynamic config's brandImage property
-    if (headerLogoFullDark != undefined && headerLogoFullDark != "") {
-      Object.assign(dynamicConfig.brandImage, {
-        "dark": {
-          "full": headerLogoFullDark
-        }
-      });
-    }
-    // If header's minimized light logo has been configured, extend/add it to dynamic config brandImage property
-    if (headerLogoMini != undefined && headerLogoMini != "") {
-      var _dynamicConfig$brandI;
-      Object.assign(dynamicConfig.brandImage, _objectSpread(_objectSpread({}, dynamicConfig.brandImage), {}, {
-        "light": _objectSpread(_objectSpread({}, (_dynamicConfig$brandI = dynamicConfig.brandImage) === null || _dynamicConfig$brandI === void 0 ? void 0 : _dynamicConfig$brandI.light), {}, {
-          "minimized": headerLogoMini
-        })
-      }));
-    }
-    // If header's minimized dark logo has been configured, extend/add it to dynamic config brandImage property
-    if (headerLogoMiniDark != undefined && headerLogoMiniDark != "") {
-      var _dynamicConfig$brandI2;
-      Object.assign(dynamicConfig.brandImage, _objectSpread(_objectSpread({}, dynamicConfig.brandImage), {}, {
-        "dark": _objectSpread(_objectSpread({}, (_dynamicConfig$brandI2 = dynamicConfig.brandImage) === null || _dynamicConfig$brandI2 === void 0 ? void 0 : _dynamicConfig$brandI2.dark), {}, {
-          "minimized": headerLogoMiniDark
-        })
-      }));
-    }
 
     // Add custom title
     if (title != undefined && title != "") {

package/dist/containers/Application.js

@@ -41,42 +41,6 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 class Application extends _react.Component {
-  /*
-  Example of use hasSidebar.
-  It must be set in Application.
-  If not set, it is considered as true.
-  
-  ...
-  
-  const config = {
-  	hasSidebar: false,
-  }
-  
-  
-  ReactDOM.render((
-  	<BrowserRouter>
-  		<Application modules={modules} {...config}/>
-  	</BrowserRouter>
-  ), document.getElementById('app'));
-  
-  ...
-  
-  Example of settings in Module of the Application
-  Following above settings, this will show the item in
-  the header and when the screen is diminished (e.g. screening
-  using the mobile phone), the item is moved to the sidebar and
-  it is accessible by the sidebar toggler button.
-  
-  ...
-  
-  	app.Navigation.addItem({
-  		name: 'Item 1',
-  		url: '',
-  	});
-  
-  ...
-  	*/
-
   constructor(props) {
     super(props);
 

package/dist/containers/Application.scss

@@ -45,6 +45,16 @@
 			opacity: 0%;
 		}
 	}
+
+	&.sidebar-hidden {
+		> #app-sidebar {
+			display: none;
+		}
+
+		> #app-main {
+			grid-area: 2 / 1 / 4 / 3;
+		}
+	}
 }
 
 body {

package/dist/containers/Header/ApplicationScreenTitle/ApplicationScreenTitle.js

@@ -9,6 +9,28 @@ var _reactI18next = require("react-i18next");
 var _asab_webui_components = require("asab_webui_components");
 require("./ApplicationScreenTitle.scss");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+/*
+	Example of use hasHeaderTitle.
+	It must be set in App configuration.
+	If not set to `false` or at all, it is considered as true.
+
+	...
+
+	const ConfigDefaults = {
+		...
+		hasHeaderTitle: false,
+	}
+
+	root.render(
+		<HashRouter>
+			<Application
+				configdefaults={ConfigDefaults} 
+				modules={modules}
+			/>
+		</HashRouter>
+	);
+*/
+
 var ApplicationScreenTitle = props => {
   var _props$routes;
   var subtitle = (0, _asab_webui_components.useAppSelector)(state => {
@@ -19,6 +41,10 @@ var ApplicationScreenTitle = props => {
     var _state$config;
     return (_state$config = state.config) === null || _state$config === void 0 ? void 0 : _state$config.title;
   });
+  var hasHeaderTitle = (0, _asab_webui_components.useAppSelector)(state => {
+    var _state$config2;
+    return state === null || state === void 0 || (_state$config2 = state.config) === null || _state$config2 === void 0 ? void 0 : _state$config2.hasHeaderTitle;
+  });
   var {
     t
   } = (0, _reactI18next.useTranslation)();
@@ -33,6 +59,11 @@ var ApplicationScreenTitle = props => {
   (0, _react.useEffect)(() => {
     document.title = title && routeName ? "".concat(title, " | ").concat(routeName) : title;
   }, [routeName, t]);
+
+  // If specifically declared in the configuration, that header title should not be available, dont display header title
+  if (hasHeaderTitle === false) {
+    return null;
+  }
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "application-screen-title text-primary"
   }, /*#__PURE__*/_react.default.createElement("h4", {

package/dist/containers/Sidebar/index.js

@@ -14,6 +14,28 @@ var _BrandImage = require("../../components/branding/BrandImage");
 require("./sidebar.scss");
 var _SidebarItemRenderer = require("./SidebarItemRenderer");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+/*
+	Example of use hasSidebar.
+	It must be set in App configuration.
+	If not set to `false` or at all, it is considered as true.
+
+	...
+
+	const ConfigDefaults = {
+		...
+		hasSidebar: false,
+	}
+
+	root.render(
+		<HashRouter>
+			<Application
+				configdefaults={ConfigDefaults} 
+				modules={modules}
+			/>
+		</HashRouter>
+	);
+*/
+
 function Sidebar(props) {
   var [isSmallResolution, setIsSmallResolution] = (0, _react.useState)(false);
   var [sidebarBottomBranding, setSidebarBottomBranding] = (0, _react.useState)({});
@@ -22,6 +44,10 @@ function Sidebar(props) {
     var _state$navigation;
     return (_state$navigation = state.navigation) === null || _state$navigation === void 0 ? void 0 : _state$navigation.navItems;
   });
+  var hasSidebar = (0, _asab_webui_components.useAppSelector)(state => {
+    var _state$config;
+    return state === null || state === void 0 || (_state$config = state.config) === null || _state$config === void 0 ? void 0 : _state$config.hasSidebar;
+  });
   var sessionExpired = (0, _asab_webui_components.useAppSelector)(state => {
     var _state$auth;
     return (_state$auth = state.auth) === null || _state$auth === void 0 ? void 0 : _state$auth.sessionExpired;
@@ -30,6 +56,22 @@ function Sidebar(props) {
   var {
     dispatch
   } = (0, _asab_webui_components.useAppStore)();
+
+  // Handling sidebar-hidden app class
+  (0, _react.useEffect)(() => {
+    var appElement = document.getElementById("app");
+    if (!appElement) return;
+    if (hasSidebar === false) {
+      appElement.classList.add("sidebar-hidden");
+    } else {
+      appElement.classList.remove("sidebar-hidden");
+    }
+  }, [hasSidebar]);
+
+  // If specifically declared in the configuration, that sidebar should not be available, dont display sidebar at all
+  if (hasSidebar === false) {
+    return null;
+  }
   (0, _react.useEffect)(() => {
     // Collapse sidebar if innerWidth is smaller or equal to 944px on page initialization
     if (window.innerWidth <= 944) {

package/dist/screens/InvalidRouteScreen.js

@@ -15,8 +15,7 @@ function InvalidRouteScreen(props) {
     t
   } = (0, _reactI18next.useTranslation)();
   return /*#__PURE__*/_react.default.createElement(_reactstrap.Container, {
-    className: "invalid-route-container h-100",
-    fluid: true
+    className: "invalid-route-container h-100"
   }, /*#__PURE__*/_react.default.createElement(_reactstrap.Card, {
     className: "invalid-route-card"
   }, /*#__PURE__*/_react.default.createElement(_reactstrap.CardBody, {
@@ -24,7 +23,7 @@ function InvalidRouteScreen(props) {
   }, /*#__PURE__*/_react.default.createElement(_reactstrap.Row, {
     className: "justify-content-center"
   }, /*#__PURE__*/_react.default.createElement(_reactstrap.Col, null, /*#__PURE__*/_react.default.createElement("div", {
-    className: "h-75"
+    className: "invalid-route-img-container"
   }, /*#__PURE__*/_react.default.createElement(_asab_webui_components.FlowbiteIllustration, {
     name: "error",
     className: "pb-4",

package/dist/screens/InvalidRouteScreen.scss

@@ -16,4 +16,11 @@
 	display: flex;
 	align-items: center; /* Vertically center */
 	justify-content: center; /* Horizontally center */
+	overflow: hidden;
+	margin: 1rem;
+}
+
+.invalid-route-img-container{
+	height: 75%;
+	max-height: 60vh;
 }

package/dist/screens/UnauthorizedAccessScreen.js

@@ -55,8 +55,7 @@ function UnauthorizedAccessScreen(props) {
 
   // Else return the Not authorized screen
   return /*#__PURE__*/_react.default.createElement(_reactstrap.Container, {
-    className: "unauthorized-container h-100",
-    fluid: true
+    className: "unauthorized-container h-100"
   }, /*#__PURE__*/_react.default.createElement(_reactstrap.Card, {
     className: "unauthorized-card"
   }, /*#__PURE__*/_react.default.createElement(_reactstrap.CardBody, {
@@ -64,7 +63,7 @@ function UnauthorizedAccessScreen(props) {
   }, /*#__PURE__*/_react.default.createElement(_reactstrap.Row, {
     className: "justify-content-center"
   }, /*#__PURE__*/_react.default.createElement(_reactstrap.Col, null, /*#__PURE__*/_react.default.createElement("div", {
-    className: "w-50 mx-auto"
+    className: "unauthorized-img-container"
   }, /*#__PURE__*/_react.default.createElement(_asab_webui_components.FlowbiteIllustration, {
     name: "unauthorized",
     className: "pb-4",

package/dist/screens/UnauthorizedAccessScreen.scss

@@ -16,4 +16,11 @@
 	display: flex;
 	align-items: center; /* Vertically center */
 	justify-content: center; /* Horizontally center */
+	overflow: hidden;
+	margin: 1rem;
+}
+
+.unauthorized-img-container{
+	height: 75%;
+	max-height: 50vh;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "asab_webui_shell",
-  "version": "26.2.1",
+  "version": "26.3.2",
   "license": "BSD-3-Clause",
   "description": "TeskaLabs ASAB WebUI Shell Application",
   "contributors": [