asab_webui_shell 25.1.12 → 25.1.13

package/dist/containers/Application.js

@@ -1,19 +1,12 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactRedux = require("react-redux");
 var _redux = require("redux");
@@ -49,16 +42,10 @@ var _ApplicationRouter = _interopRequireDefault(require("./Router/ApplicationRou
 var _SuspenseScreen = _interopRequireDefault(require("../screens/SuspenseScreen"));
 require("./Application.scss");
 var _actions = require("../actions");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
-function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+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); }
 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; }
-function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
-var Application = /*#__PURE__*/function (_Component) {
+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.
@@ -95,737 +82,608 @@ var Application = /*#__PURE__*/function (_Component) {
   ...
   	*/
 
-  function Application(props) {
-    var _this;
-    (0, _classCallCheck2["default"])(this, Application);
-    _this = _callSuper(this, Application, [props]);
-    _this.Modules = [];
-    _this.Services = {};
-    _this.ReduxService = new _ReduxService["default"](_this, "ReduxService");
-    _this.ConfigService = new _ConfigService["default"](_this, "ConfigService");
-    _this.Config = _this.ConfigService.Config;
-    _this.Router = new _Router["default"](_this);
-    _this.Navigation = new _Navigation["default"](_this);
-    _this.SplashscreenRequestors = new Set(); // If not empty, the splash screen will be rendered
-    _this.AxiosInterceptors = new Set();
-    _this.WebSocketInterceptors = new Set();
-    _this.AttentionRequiredService = new _AttentionRequiredService["default"](_this, "AttentionRequired");
-    _this.HeaderService = new _HeaderService["default"](_this, "HeaderService");
-    _this.ThemeService = new _ThemeService["default"](_this, "ThemeService");
-    _this.BrandingService = new _BrandingService["default"](_this, "BrandingService");
-    _this.TitleService = new _TitleService["default"](_this, "TitleService");
-    _this.HelpService = new _HelpService["default"](_this, "HelpService");
-    _this.PreviewService = new _PreviewService["default"](_this, "PreviewService");
-    _this.ReduxService.addReducer("attentionrequired", _reducer8["default"]);
-    _this.ReduxService.addReducer("alerts", _reducer["default"]);
-    _this.ReduxService.addReducer("advmode", _reducer7["default"]);
-    _this.ReduxService.addReducer("fullscreenmode", _reducer6["default"]);
-    _this.ReduxService.addReducer("header", _reducer3["default"]);
-    _this.ReduxService.addReducer("sidebar", _reducer2["default"]);
-    _this.ReduxService.addReducer("navigation", _reducer4["default"]);
-    _this.ReduxService.addReducer("router", _reducer5["default"]);
+  constructor(props) {
+    super(props);
+    this.Modules = [];
+    this.Services = {};
+    this.ReduxService = new _ReduxService.default(this, "ReduxService");
+    this.ConfigService = new _ConfigService.default(this, "ConfigService");
+    this.Config = this.ConfigService.Config;
+    this.Router = new _Router.default(this);
+    this.Navigation = new _Navigation.default(this);
+    this.SplashscreenRequestors = new Set(); // If not empty, the splash screen will be rendered
+    this.AxiosInterceptors = new Set();
+    this.WebSocketInterceptors = new Set();
+    this.AttentionRequiredService = new _AttentionRequiredService.default(this, "AttentionRequired");
+    this.HeaderService = new _HeaderService.default(this, "HeaderService");
+    this.ThemeService = new _ThemeService.default(this, "ThemeService");
+    this.BrandingService = new _BrandingService.default(this, "BrandingService");
+    this.TitleService = new _TitleService.default(this, "TitleService");
+    this.HelpService = new _HelpService.default(this, "HelpService");
+    this.PreviewService = new _PreviewService.default(this, "PreviewService");
+    this.ReduxService.addReducer("attentionrequired", _reducer8.default);
+    this.ReduxService.addReducer("alerts", _reducer.default);
+    this.ReduxService.addReducer("advmode", _reducer7.default);
+    this.ReduxService.addReducer("fullscreenmode", _reducer6.default);
+    this.ReduxService.addReducer("header", _reducer3.default);
+    this.ReduxService.addReducer("sidebar", _reducer2.default);
+    this.ReduxService.addReducer("navigation", _reducer4.default);
+    this.ReduxService.addReducer("router", _reducer5.default);
 
     // The application can provide a list of keys that should be automatically parsed as BigInt, when received from the server in Axios call
     // This is important to preserve 64bit numbers from the server such as IP addresses, timestamps etc.
-    _this.JSONParseBigInt = new Set(props === null || props === void 0 ? void 0 : props.bigint);
-    _this._handleKeyUp = _this._handleKeyUp.bind(_this);
-    _this.state = {
+    this.JSONParseBigInt = new Set(props === null || props === void 0 ? void 0 : props.bigint);
+    this._handleKeyUp = this._handleKeyUp.bind(this);
+    this.state = {
       networking: 0,
       // If more than zero, some networking activity is happening
       splashscreenRequestors: 0
     };
     var composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || _redux.compose;
-    _this.Store = (0, _redux.createStore)((0, _redux.combineReducers)(_this.ReduxService.Reducers), composeEnhancers((0, _redux.applyMiddleware)()));
-    _this.ConfigService.addDefaults(props.configdefaults);
-    _this.Config.dispatch(_this.Store);
-    _this.addSplashScreenRequestor(_this);
-    _this.state.splashscreenRequestors = _this.SplashscreenRequestors.size;
-    var that = _this;
+    this.Store = (0, _redux.createStore)((0, _redux.combineReducers)(this.ReduxService.Reducers), composeEnhancers((0, _redux.applyMiddleware)()));
+    this.ConfigService.addDefaults(props.configdefaults);
+    this.Config.dispatch(this.Store);
+    this.addSplashScreenRequestor(this);
+    this.state.splashscreenRequestors = this.SplashscreenRequestors.size;
+    var that = this;
     function modules_init() {
       return _modules_init.apply(this, arguments);
     }
     function _modules_init() {
-      _modules_init = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee2() {
-        var i, modcandidate, modloaded, mod, _mod, ret;
-        return _regenerator["default"].wrap(function _callee2$(_context2) {
-          while (1) switch (_context2.prev = _context2.next) {
-            case 0:
-              _context2.t0 = _regenerator["default"].keys(props.modules);
-            case 1:
-              if ((_context2.t1 = _context2.t0()).done) {
-                _context2.next = 29;
-                break;
-              }
-              i = _context2.t1.value;
-              // The candidate can be:
-              //  1. { Module } from "asab_webui_components"
-              //  2. A promise that loads the remote module from the federated application
-              modcandidate = props.modules[i];
-              modloaded = void 0;
-              if (!(modcandidate.prototype instanceof _asab_webui_components.Module)) {
-                _context2.next = 10;
-                break;
-              }
-              // This is a Module from "asab_webui_components"
-              mod = new modcandidate(that);
-              that.Modules.push(mod);
-              _context2.next = 25;
-              break;
-            case 10:
-              _context2.prev = 10;
-              _context2.next = 13;
-              return Promise.resolve(modcandidate);
-            case 13:
-              modloaded = _context2.sent;
-              _context2.next = 20;
-              break;
-            case 16:
-              _context2.prev = 16;
-              _context2.t2 = _context2["catch"](10);
-              if (_context2.t2 instanceof Error && _context2.t2.name == 'ScriptExternalLoadError') {
+      _modules_init = (0, _asyncToGenerator2.default)(function* () {
+        // Instantiate statically imported modules
+        for (var i in props.modules) {
+          // The candidate can be:
+          //  1. { Module } from "asab_webui_components"
+          //  2. A promise that loads the remote module from the federated application
+          var modcandidate = props.modules[i];
+          var modloaded = void 0;
+          if (modcandidate.prototype instanceof _asab_webui_components.Module) {
+            // This is a Module from "asab_webui_components"
+            var mod = new modcandidate(that);
+            that.Modules.push(mod);
+          } else {
+            // This is load of the remote module from a federated application using promise
+            try {
+              modloaded = yield Promise.resolve(modcandidate);
+            } catch (error) {
+              if (error instanceof Error && error.name == 'ScriptExternalLoadError') {
                 // The initial load of the remote failed; it is ok in development environment
-                console.warn("Failed to load a remote module: ScriptExternalLoadError:", _context2.t2.message);
+                console.warn("Failed to load a remote module: ScriptExternalLoadError:", error.message);
               } else {
-                console.error(_context2.t2);
-              }
-              return _context2.abrupt("continue", 1);
-            case 20:
-              if (!(!modloaded["default"].prototype instanceof _asab_webui_components.Module)) {
-                _context2.next = 23;
-                break;
+                console.error(error);
               }
+              continue;
+            }
+
+            // Sanity check
+            if (!modloaded.default.prototype instanceof _asab_webui_components.Module) {
               console.error("The default object from the remote is not a Module - skipping");
-              return _context2.abrupt("continue", 1);
-            case 23:
-              _mod = new modloaded["default"](that); // We expect 'export default class ...Module extends Module'
-              that.Modules.push(_mod);
-            case 25:
-              that.Store.replaceReducer((0, _redux.combineReducers)(that.ReduxService.Reducers));
-              that.Config.dispatch(that.Store);
-              _context2.next = 1;
-              break;
-            case 29:
-              _context2.t3 = _regenerator["default"].keys(that.Modules);
-            case 30:
-              if ((_context2.t4 = _context2.t3()).done) {
-                _context2.next = 37;
-                break;
-              }
-              i = _context2.t4.value;
-              ret = that.Modules[i].initialize(); // Transform result in the promise
-              // It unifies synchronous and asynchronous `initialize()` calls
-              _context2.next = 35;
-              return Promise.resolve(ret);
-            case 35:
-              _context2.next = 30;
-              break;
-            case 37:
-            case "end":
-              return _context2.stop();
+              continue; // The load of the remote failed
+            }
+            var _mod = new modloaded.default(that); // We expect 'export default class ...Module extends Module'
+            that.Modules.push(_mod);
           }
-        }, _callee2, null, [[10, 16]]);
-      }));
+          that.Store.replaceReducer((0, _redux.combineReducers)(that.ReduxService.Reducers));
+          that.Config.dispatch(that.Store);
+        }
+
+        // Initialize statically imported modules
+        for (var i in that.Modules) {
+          var ret = that.Modules[i].initialize();
+
+          // Transform result in the promise
+          // It unifies synchronous and asynchronous `initialize()` calls
+          yield Promise.resolve(ret);
+        }
+      });
       return _modules_init.apply(this, arguments);
     }
-    modules_init().then(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {
-      var i, ret;
-      return _regenerator["default"].wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            that.Store.replaceReducer((0, _redux.combineReducers)(that.ReduxService.Reducers));
-            that.Config.dispatch(that.Store);
-
-            // Initialize all services
-            _context.t0 = _regenerator["default"].keys(that.Services);
-          case 3:
-            if ((_context.t1 = _context.t0()).done) {
-              _context.next = 11;
-              break;
-            }
-            i = _context.t1.value;
-            ret = that.Services[i].initialize(); // Transform result in the promise
-            // It unifies synchronous and asynchronous `initialize()` calls
-            _context.next = 8;
-            return Promise.resolve(ret);
-          case 8:
-            that.Config.dispatch(that.Store);
-            _context.next = 3;
-            break;
-          case 11:
-            that.removeSplashScreenRequestor(that);
-          case 12:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee);
-    })));
-    return _this;
-  }
-  (0, _inherits2["default"])(Application, _Component);
-  return (0, _createClass2["default"])(Application, [{
-    key: "getServiceURL",
-    value: function getServiceURL(service) {
-      // Handle if service is unknown => return undefined
-      if (service == undefined) {
-        console.warn("Service is undefined!");
-        return undefined;
+    modules_init().then(/*#__PURE__*/(0, _asyncToGenerator2.default)(function* () {
+      that.Store.replaceReducer((0, _redux.combineReducers)(that.ReduxService.Reducers));
+      that.Config.dispatch(that.Store);
+
+      // Initialize all services
+      for (var i in that.Services) {
+        var ret = that.Services[i].initialize();
+
+        // Transform result in the promise
+        // It unifies synchronous and asynchronous `initialize()` calls
+        yield Promise.resolve(ret);
+        that.Config.dispatch(that.Store);
       }
+      that.removeSplashScreenRequestor(that);
+    }));
+  }
+  getServiceURL(service) {
+    // Handle if service is unknown => return undefined
+    if (service == undefined) {
+      console.warn("Service is undefined!");
+      return undefined;
+    }
 
-      // Handle if SERVICES not provided, empty object will be used as default
-      var services = this.Config.get('SERVICES') ? this.Config.get('SERVICES') : {};
+    // Handle if SERVICES not provided, empty object will be used as default
+    var services = this.Config.get('SERVICES') ? this.Config.get('SERVICES') : {};
 
-      // Handle if service is not in SERVICES => use service as service_path
-      var service_path = services[service] ? services[service] : service;
+    // Handle if service is not in SERVICES => use service as service_path
+    var service_path = services[service] ? services[service] : service;
 
-      // If service_path is complete URL, then return that URL
-      if (service_path.toString().indexOf('http://') !== -1 || service_path.toString().indexOf('https://') !== -1) {
-        return service_path;
-      }
-      // If service_path is complete WebSocket URL, then return that URL
-      if (service_path.toString().indexOf('ws://') !== -1 || service_path.toString().indexOf('wss://') !== -1) {
-        return service_path;
-      }
+    // If service_path is complete URL, then return that URL
+    if (service_path.toString().indexOf('http://') !== -1 || service_path.toString().indexOf('https://') !== -1) {
+      return service_path;
+    }
+    // If service_path is complete WebSocket URL, then return that URL
+    if (service_path.toString().indexOf('ws://') !== -1 || service_path.toString().indexOf('wss://') !== -1) {
+      return service_path;
+    }
 
-      // Obtain BASE_URL
-      var BASE_URL = undefined;
-      if (this.Config.get('BASE_URL') == undefined) {
-        // If BASE_URL has not been defined => take browser URL as BASE_URL
-        BASE_URL = window.location.protocol + '//' + window.location.host + window.location.pathname.replace(/\/$/, '');
-      } else if (this.Config.get('BASE_URL').toString().indexOf('http://') !== -1 || this.Config.get('BASE_URL').toString().indexOf('https://') !== -1) {
-        // If BASE_URL has been defined => take defined BASE_URL as BASE_URL
-        BASE_URL = this.Config.get('BASE_URL');
-      } else {
-        // If BASE_URL has been defined but with relative path => take browser URL as BASE_URL and append relative path from BASE_URL behind the browser URL
-        var relative_base_url = this.Config.get('BASE_URL');
-        // Check if trailing slash has been added on first place of a BASE_URL string and if so, remove it
-        if (relative_base_url.indexOf("/", 0) == 0) {
-          relative_base_url = relative_base_url.substring(1);
-        }
-        BASE_URL = window.location.protocol + '//' + window.location.host + window.location.pathname.replace(/\/$/, '') + '/' + relative_base_url.replace(/\/$/, '');
+    // Obtain BASE_URL
+    var BASE_URL = undefined;
+    if (this.Config.get('BASE_URL') == undefined) {
+      // If BASE_URL has not been defined => take browser URL as BASE_URL
+      BASE_URL = window.location.protocol + '//' + window.location.host + window.location.pathname.replace(/\/$/, '');
+    } else if (this.Config.get('BASE_URL').toString().indexOf('http://') !== -1 || this.Config.get('BASE_URL').toString().indexOf('https://') !== -1) {
+      // If BASE_URL has been defined => take defined BASE_URL as BASE_URL
+      BASE_URL = this.Config.get('BASE_URL');
+    } else {
+      // If BASE_URL has been defined but with relative path => take browser URL as BASE_URL and append relative path from BASE_URL behind the browser URL
+      var relative_base_url = this.Config.get('BASE_URL');
+      // Check if trailing slash has been added on first place of a BASE_URL string and if so, remove it
+      if (relative_base_url.indexOf("/", 0) == 0) {
+        relative_base_url = relative_base_url.substring(1);
       }
+      BASE_URL = window.location.protocol + '//' + window.location.host + window.location.pathname.replace(/\/$/, '') + '/' + relative_base_url.replace(/\/$/, '');
+    }
 
-      // Compose service_url
-      var service_url = undefined;
-      if (this.Config.get('API_PATH') == undefined) {
-        // If API_PATH has not been defined => use /api to compose service_url
-        service_url = BASE_URL.replace(/\/$/, '') + '/api';
-      } else if (this.Config.get('API_PATH').toString().indexOf('http://') !== -1 || this.Config.get('API_PATH').toString().indexOf('https://') !== -1) {
-        // If API_PATH has been defined but with absolute URL => use API_PATH as service_url
-        service_url = this.Config.get('API_PATH');
-      } else {
-        // If API_PATH has been defined => use API_PATH to compose service_url
-        var api_path = this.Config.get('API_PATH');
-        // Check if trailing slash has been added on first place of a API_PATH string and if so, remove it
-        if (api_path.indexOf("/", 0) == 0) {
-          api_path = api_path.substring(1);
-        }
-        service_url = BASE_URL.replace(/\/$/, '') + "/" + api_path;
+    // Compose service_url
+    var service_url = undefined;
+    if (this.Config.get('API_PATH') == undefined) {
+      // If API_PATH has not been defined => use /api to compose service_url
+      service_url = BASE_URL.replace(/\/$/, '') + '/api';
+    } else if (this.Config.get('API_PATH').toString().indexOf('http://') !== -1 || this.Config.get('API_PATH').toString().indexOf('https://') !== -1) {
+      // If API_PATH has been defined but with absolute URL => use API_PATH as service_url
+      service_url = this.Config.get('API_PATH');
+    } else {
+      // If API_PATH has been defined => use API_PATH to compose service_url
+      var api_path = this.Config.get('API_PATH');
+      // Check if trailing slash has been added on first place of a API_PATH string and if so, remove it
+      if (api_path.indexOf("/", 0) == 0) {
+        api_path = api_path.substring(1);
       }
-      return service_url.replace(/\/$/, '') + "/" + service_path;
+      service_url = BASE_URL.replace(/\/$/, '') + "/" + api_path;
     }
+    return service_url.replace(/\/$/, '') + "/" + service_path;
+  }
 
-    /*
-     *	Creates an AXIOS object for communication with TeskaLabs API's
-     *
-     *	IMPORTANT NOTE:
-     *		Bearer token will be sent to any URL specified in the API / Services configuration.
-     *		axiosCreate must only be used for creating http sessions
-     *		towards TeskaLabs API's, since it adds Bearer token to all calls.
-     */
-  }, {
-    key: "axiosCreate",
-    value: function axiosCreate(service, props) {
-      var service_url = this.getServiceURL(service);
-      if (service_url == undefined) {
-        this.addAlert('danger', "ASABApplicationContainer|Service URL is undefined, please check service paths passed to axios", 5, true);
-        return undefined;
-      }
-      var axios = _axios["default"].create(_objectSpread(_objectSpread({}, props), {}, {
-        transformResponse: function transformResponse(res) {
-          return res;
-        },
-        // Disable implicit JSON parsing, we explicitly parse JSON in the interceptor ( https://stackoverflow.com/questions/41013082/disable-json-parsing-in-axios )
-        baseURL: service_url
-      }));
-
-      // Iterate through custom interceptors
-      var _iterator = _createForOfIteratorHelper(this.AxiosInterceptors.keys()),
-        _step;
-      try {
-        for (_iterator.s(); !(_step = _iterator.n()).done;) {
-          var interceptor = _step.value;
-          this.interceptorRequest(axios, interceptor);
-        }
-      } catch (err) {
-        _iterator.e(err);
-      } finally {
-        _iterator.f();
-      }
-      var that = this;
+  /*
+   *	Creates an AXIOS object for communication with TeskaLabs API's
+   *
+   *	IMPORTANT NOTE:
+   *		Bearer token will be sent to any URL specified in the API / Services configuration.
+   *		axiosCreate must only be used for creating http sessions
+   *		towards TeskaLabs API's, since it adds Bearer token to all calls.
+   */
+  axiosCreate(service, props) {
+    var service_url = this.getServiceURL(service);
+    if (service_url == undefined) {
+      this.addAlert('danger', "ASABApplicationContainer|Service URL is undefined, please check service paths passed to axios", 5, true);
+      return undefined;
+    }
+    var axios = _axios.default.create(_objectSpread(_objectSpread({}, props), {}, {
+      transformResponse: res => res,
+      // Disable implicit JSON parsing, we explicitly parse JSON in the interceptor ( https://stackoverflow.com/questions/41013082/disable-json-parsing-in-axios )
+      baseURL: service_url
+    }));
 
-      /*
-      	We want to be notified when networking activity is taking place,
-      	thus we use pushNetworkingIndicator.
-      		Default request headers are X-App and X-Request-Id which
-      	define recognition of the requests from the service perspective
-      */
-      axios.interceptors.request.use(function (config) {
-        that.pushNetworkingIndicator();
-        config.headers['X-App'] = "webui"; // Include X-App header in every axios API request
-        config.headers['X-Request-Id'] = that._generateUID(); // Include X-Request-Id header in every axios API request
-        return config;
-      }, function (error) {
-        return Promise.reject(error);
-      });
+    // Iterate through custom interceptors
+    for (var interceptor of this.AxiosInterceptors.keys()) {
+      this.interceptorRequest(axios, interceptor);
+    }
+    var that = this;
 
-      // We want to remove the networking indicator when we receive the response
-      axios.interceptors.response.use(function (response) {
-        var _response$headers$con;
-        // Call the `popNetworkingIndicator` method to remove the networking indicator (e.g., loading spinner)
-        that.popNetworkingIndicator();
-
-        /*
-        	Custom flag to control JSON parsing for specific requests.
-        	If 'skipJsonParsing' is set to true in the request config,
-        	we return the raw response and skip automatic JSON parsing in the interceptor.
-        	This is useful when we need to get the response as plain text (e.g., for retrieving raw content).
-        */
-        if (response.config.skipJsonParsing) {
-          return response;
-        }
+    /*
+    	We want to be notified when networking activity is taking place,
+    	thus we use pushNetworkingIndicator.
+    		Default request headers are X-App and X-Request-Id which
+    	define recognition of the requests from the service perspective
+    */
+    axios.interceptors.request.use(function (config) {
+      that.pushNetworkingIndicator();
+      config.headers['X-App'] = "webui"; // Include X-App header in every axios API request
+      config.headers['X-Request-Id'] = that._generateUID(); // Include X-Request-Id header in every axios API request
+      return config;
+    }, function (error) {
+      return Promise.reject(error);
+    });
 
-        // Check if the response content type is 'application/json' or starts with 'application/json'
-        if (response !== null && response !== void 0 && (_response$headers$con = response.headers['content-type']) !== null && _response$headers$con !== void 0 && _response$headers$con.startsWith('application/json')) {
-          // If the response is JSON, then parse it with respect to BigInt
-          // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse
-          try {
-            // Parse the response data using a custom reviver function
-            response.data = JSON.parse(response.data,
-            // Custom reviver function to handle BigInt values
-            function (key, value, context) {
-              // If there is no data in the JSONParseBigInt, return the value immediately
-              if (that.JSONParseBigInt.size === 0) {
-                return value;
-              }
-              // Check if the key is in the `JSONParseBigInt` set and the value is a number
-              if (that.JSONParseBigInt.has(key) && typeof value === 'number') {
-                // Convert the number to a BigInt
-                return BigInt(context.source);
-              }
-              // Return the original value if no conversion is needed
-              return value;
-            });
-          } catch (e) {
-            // Log any errors that occur during JSON parsing
-            console.error("Error in axios.interceptors.response", e);
-          }
-        }
-        // If the request was satisfied (application/json and presence of BigInt) return the modified object. If not, we return unchanged object
-        return response;
-      }, function (error) {
-        var _error$response, _error$response2;
-        that.popNetworkingIndicator();
-        var contentType = error === null || error === void 0 || (_error$response = error.response) === null || _error$response === void 0 || (_error$response = _error$response.headers) === null || _error$response === void 0 ? void 0 : _error$response['content-type'];
-        // Check if the response content type is 'application/json' and data is a string
-        if (contentType !== null && contentType !== void 0 && contentType.startsWith('application/json') && typeof (error === null || error === void 0 || (_error$response2 = error.response) === null || _error$response2 === void 0 ? void 0 : _error$response2.data) === 'string') {
-          try {
-            error.response.data = JSON.parse(error.response.data);
-          } catch (e) {
-            console.error("Error parsing error of the error body:", e);
-          }
-        }
-        return Promise.reject(error);
-      });
-      return axios;
-    }
+    // We want to remove the networking indicator when we receive the response
+    axios.interceptors.response.use(function (response) {
+      var _response$headers$con;
+      // Call the `popNetworkingIndicator` method to remove the networking indicator (e.g., loading spinner)
+      that.popNetworkingIndicator();
 
-    // Internal method for generating random UID's
-  }, {
-    key: "_generateUID",
-    value: function _generateUID() {
       /*
-      	- Math.random() * 0x100000000: Generates a random floating-point number between 0 and 0x100000000.
-      	- >>> 0: Applies a bitwise unsigned right shift by 0, effectively converting the floating-point number to a 32-bit unsigned integer.
-      	- toString(36): Converts the integer to a base-36 string, using the digits 0-9 and letters a-z.
+      	Custom flag to control JSON parsing for specific requests.
+      	If 'skipJsonParsing' is set to true in the request config,
+      	we return the raw response and skip automatic JSON parsing in the interceptor.
+      	This is useful when we need to get the response as plain text (e.g., for retrieving raw content).
       */
-      return (Math.random() * 0x100000000 >>> 0).toString(36) + (Math.random() * 0x100000000 >>> 0).toString(36) + (Math.random() * 0x100000000 >>> 0).toString(36) + (Math.random() * 0x100000000 >>> 0).toString(36);
-    }
-  }, {
-    key: "interceptorRequest",
-    value: function interceptorRequest(axios, interceptor) {
-      // Add a request interceptor
-      axios.interceptors.request.use(interceptor, function (error) {
-        return Promise.reject(error);
-      });
-    }
-  }, {
-    key: "addAxiosInterceptor",
-    value: function addAxiosInterceptor(interceptor) {
-      this.AxiosInterceptors.add(interceptor);
-    }
-  }, {
-    key: "removeAxiosInterceptor",
-    value: function removeAxiosInterceptor(interceptor) {
-      this.AxiosInterceptors["delete"](interceptor);
-    }
-  }, {
-    key: "addWebSocketInterceptor",
-    value: function addWebSocketInterceptor(interceptor) {
-      this.WebSocketInterceptors.add(interceptor);
-    }
-  }, {
-    key: "removeWebSocketInterceptor",
-    value: function removeWebSocketInterceptor(interceptor) {
-      this.WebSocketInterceptors["delete"](interceptor);
-    }
-  }, {
-    key: "getWebSocketURL",
-    value: function getWebSocketURL(service, subpath) {
-      // Handle if service is unknown => return undefined
-      var service_url = this.getServiceURL(service);
-      if (service_url == undefined) {
-        return undefined;
+      if (response.config.skipJsonParsing) {
+        return response;
       }
 
-      // Handle if subpath is unknown => subpath = ""
-      if (subpath == undefined) {
-        subpath = "";
+      // Check if the response content type is 'application/json' or starts with 'application/json'
+      if (response !== null && response !== void 0 && (_response$headers$con = response.headers['content-type']) !== null && _response$headers$con !== void 0 && _response$headers$con.startsWith('application/json')) {
+        // If the response is JSON, then parse it with respect to BigInt
+        // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse
+        try {
+          // Parse the response data using a custom reviver function
+          response.data = JSON.parse(response.data,
+          // Custom reviver function to handle BigInt values
+          (key, value, context) => {
+            // If there is no data in the JSONParseBigInt, return the value immediately
+            if (that.JSONParseBigInt.size === 0) {
+              return value;
+            }
+            // Check if the key is in the `JSONParseBigInt` set and the value is a number
+            if (that.JSONParseBigInt.has(key) && typeof value === 'number') {
+              // Convert the number to a BigInt
+              return BigInt(context.source);
+            }
+            // Return the original value if no conversion is needed
+            return value;
+          });
+        } catch (e) {
+          // Log any errors that occur during JSON parsing
+          console.error("Error in axios.interceptors.response", e);
+        }
       }
-
-      // If service_path is complete WebSocket URL, then return that URL
-      if (service_url.toString().indexOf('ws://') !== -1 || service_url.toString().indexOf('wss://') !== -1) {
-        return service_url;
+      // If the request was satisfied (application/json and presence of BigInt) return the modified object. If not, we return unchanged object
+      return response;
+    }, function (error) {
+      var _error$response, _error$response2;
+      that.popNetworkingIndicator();
+      var contentType = error === null || error === void 0 || (_error$response = error.response) === null || _error$response === void 0 || (_error$response = _error$response.headers) === null || _error$response === void 0 ? void 0 : _error$response['content-type'];
+      // Check if the response content type is 'application/json' and data is a string
+      if (contentType !== null && contentType !== void 0 && contentType.startsWith('application/json') && typeof (error === null || error === void 0 || (_error$response2 = error.response) === null || _error$response2 === void 0 ? void 0 : _error$response2.data) === 'string') {
+        try {
+          error.response.data = JSON.parse(error.response.data);
+        } catch (e) {
+          console.error("Error parsing error of the error body:", e);
+        }
       }
+      return Promise.reject(error);
+    });
+    return axios;
+  }
 
-      // Replace http:// or https:// protocol with ws:// or wss://
-      var ws_service_url = service_url.replace(/(http)(s)?\:\/\//, "ws$2://");
-      return ws_service_url + subpath;
+  // Internal method for generating random UID's
+  _generateUID() {
+    /*
+    	- Math.random() * 0x100000000: Generates a random floating-point number between 0 and 0x100000000.
+    	- >>> 0: Applies a bitwise unsigned right shift by 0, effectively converting the floating-point number to a 32-bit unsigned integer.
+    	- toString(36): Converts the integer to a base-36 string, using the digits 0-9 and letters a-z.
+    */
+    return (Math.random() * 0x100000000 >>> 0).toString(36) + (Math.random() * 0x100000000 >>> 0).toString(36) + (Math.random() * 0x100000000 >>> 0).toString(36) + (Math.random() * 0x100000000 >>> 0).toString(36);
+  }
+  interceptorRequest(axios, interceptor) {
+    // Add a request interceptor
+    axios.interceptors.request.use(interceptor, function (error) {
+      return Promise.reject(error);
+    });
+  }
+  addAxiosInterceptor(interceptor) {
+    this.AxiosInterceptors.add(interceptor);
+  }
+  removeAxiosInterceptor(interceptor) {
+    this.AxiosInterceptors.delete(interceptor);
+  }
+  addWebSocketInterceptor(interceptor) {
+    this.WebSocketInterceptors.add(interceptor);
+  }
+  removeWebSocketInterceptor(interceptor) {
+    this.WebSocketInterceptors.delete(interceptor);
+  }
+  getWebSocketURL(service, subpath) {
+    // Handle if service is unknown => return undefined
+    var service_url = this.getServiceURL(service);
+    if (service_url == undefined) {
+      return undefined;
     }
-  }, {
-    key: "createWebSocket",
-    value: function createWebSocket(service, subpath) {
-      var socket_url = this.getWebSocketURL(service, subpath);
-      if (socket_url == undefined) {
-        this.addAlert('danger', "ASABApplicationContainer|WebSocket URL is undefined, please check service and subpath passed to WebSocket", 5, true);
-        return undefined;
-      }
-
-      /*
-      	Adding ws interceptors to the ws subprotocols (e.g. to pass auth token).
-      		"asab" subprotocol is given by default for consumer (any websocket service)
-      	which require this particular value to authenticate websocket connection,
-      	since some browsers (Chrome, Safari, ...) requires Sec-Websocket-Accept
-      	response header.
-      		Another default subprotocols are "app_webui" and "request_id_<uid>"
-      	which define recognition of the requests from the service perspective
-      */
-      var subprotocols = ["asab", "app_webui", "request_id_".concat(this._generateUID())];
-      var _iterator2 = _createForOfIteratorHelper(this.WebSocketInterceptors.keys()),
-        _step2;
-      try {
-        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-          var interceptor = _step2.value;
-          // Avoid pushing undefined interceptor values
-          if (interceptor) {
-            subprotocols.push(interceptor);
-          }
-        }
 
-        // Create new WebSocket based on socket URL
-      } catch (err) {
-        _iterator2.e(err);
-      } finally {
-        _iterator2.f();
-      }
-      var socket = new WebSocket(socket_url, subprotocols);
-      return socket;
+    // Handle if subpath is unknown => subpath = ""
+    if (subpath == undefined) {
+      subpath = "";
     }
 
-    // Display and hide networking indicator
-  }, {
-    key: "pushNetworkingIndicator",
-    value: function pushNetworkingIndicator() {
-      this.setState(function (prevState, props) {
-        return {
-          networking: prevState.networking + 1
-        };
-      });
-    }
-  }, {
-    key: "popNetworkingIndicator",
-    value: function popNetworkingIndicator() {
-      this.setState(function (prevState, props) {
-        return {
-          networking: prevState.networking - 1
-        };
-      });
+    // If service_path is complete WebSocket URL, then return that URL
+    if (service_url.toString().indexOf('ws://') !== -1 || service_url.toString().indexOf('wss://') !== -1) {
+      return service_url;
     }
-  }, {
-    key: "registerService",
-    value: function registerService(service) {
-      if (service.Name in this.Services) {
-        console.warn("Service ".concat(service.Name, " is already registered."));
-        return;
-      }
-      this.Services[service.Name] = service;
+
+    // Replace http:// or https:// protocol with ws:// or wss://
+    var ws_service_url = service_url.replace(/(http)(s)?\:\/\//, "ws$2://");
+    return ws_service_url + subpath;
+  }
+  createWebSocket(service, subpath) {
+    var socket_url = this.getWebSocketURL(service, subpath);
+    if (socket_url == undefined) {
+      this.addAlert('danger', "ASABApplicationContainer|WebSocket URL is undefined, please check service and subpath passed to WebSocket", 5, true);
+      return undefined;
     }
-  }, {
-    key: "locateService",
-    value: function locateService(name) {
-      if (!name in this.Services) {
-        console.warn("Service ".concat(name, " doesn't exist."));
-        return null;
+
+    /*
+    	Adding ws interceptors to the ws subprotocols (e.g. to pass auth token).
+    		"asab" subprotocol is given by default for consumer (any websocket service)
+    	which require this particular value to authenticate websocket connection,
+    	since some browsers (Chrome, Safari, ...) requires Sec-Websocket-Accept
+    	response header.
+    		Another default subprotocols are "app_webui" and "request_id_<uid>"
+    	which define recognition of the requests from the service perspective
+    */
+    var subprotocols = ["asab", "app_webui", "request_id_".concat(this._generateUID())];
+    for (var interceptor of this.WebSocketInterceptors.keys()) {
+      // Avoid pushing undefined interceptor values
+      if (interceptor) {
+        subprotocols.push(interceptor);
       }
-      return this.Services[name];
     }
 
-    // This function handles keystroke events and performs enabling/disabling of mods
-  }, {
-    key: "_handleKeyUp",
-    value: function _handleKeyUp(event) {
-      // CTRL+SHIFT+F enables the fullscreen mode
-      if (event.ctrlKey && event.shiftKey && event.code === 'KeyF') {
-        this.setFullScreenMode('on');
-      }
+    // Create new WebSocket based on socket URL
+    var socket = new WebSocket(socket_url, subprotocols);
+    return socket;
+  }
 
-      // CTRL+Q (Windows) or CTRL+1 (Linux) enables the advanced mode
-      if (event.ctrlKey && event.code === 'KeyQ' || event.code === 'Digit1' && event.ctrlKey) {
-        this.setAdvancedMode(0);
-      }
-    }
-  }, {
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      document.addEventListener("keyup", this._handleKeyUp, false);
+  // Display and hide networking indicator
+  pushNetworkingIndicator() {
+    this.setState((prevState, props) => ({
+      networking: prevState.networking + 1
+    }));
+  }
+  popNetworkingIndicator() {
+    this.setState((prevState, props) => ({
+      networking: prevState.networking - 1
+    }));
+  }
+  registerService(service) {
+    if (service.Name in this.Services) {
+      console.warn("Service ".concat(service.Name, " is already registered."));
+      return;
     }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      document.removeEventListener("keyup", this._handleKeyUp, false);
+    this.Services[service.Name] = service;
+  }
+  locateService(name) {
+    if (!name in this.Services) {
+      console.warn("Service ".concat(name, " doesn't exist."));
+      return null;
     }
+    return this.Services[name];
+  }
 
-    // Splash screen
-  }, {
-    key: "addSplashScreenRequestor",
-    value: function addSplashScreenRequestor(obj) {
-      var origLen = this.SplashscreenRequestors.size;
-      this.SplashscreenRequestors.add(obj);
-      if (origLen != this.SplashscreenRequestors.size) {
-        this.state.splashscreenRequestors = this.SplashscreenRequestors.size;
-      }
-      var splashscreen = document.getElementById('app-splashscreen'); // See public/index.html`
-      splashscreen === null || splashscreen === void 0 || splashscreen.classList.remove("d-none");
+  // This function handles keystroke events and performs enabling/disabling of mods
+  _handleKeyUp(event) {
+    // CTRL+SHIFT+F enables the fullscreen mode
+    if (event.ctrlKey && event.shiftKey && event.code === 'KeyF') {
+      this.setFullScreenMode('on');
     }
-  }, {
-    key: "removeSplashScreenRequestor",
-    value: function removeSplashScreenRequestor(obj) {
-      var origLen = this.SplashscreenRequestors.size;
-      this.SplashscreenRequestors["delete"](obj);
-      if (origLen != this.SplashscreenRequestors.size) {
-        this.setState({
-          splashscreenRequestors: this.SplashscreenRequestors.size
-        });
-      }
-      if (this.SplashscreenRequestors.size == 0) {
-        var splashscreen = document.getElementById('app-splashscreen'); // See public/index.html
-        splashscreen === null || splashscreen === void 0 || splashscreen.classList.add("d-none");
-      }
+
+    // CTRL+Q (Windows) or CTRL+1 (Linux) enables the advanced mode
+    if (event.ctrlKey && event.code === 'KeyQ' || event.code === 'Digit1' && event.ctrlKey) {
+      this.setAdvancedMode(0);
     }
+  }
+  componentDidMount() {
+    document.addEventListener("keyup", this._handleKeyUp, false);
+  }
+  componentWillUnmount() {
+    document.removeEventListener("keyup", this._handleKeyUp, false);
+  }
 
-    // Alerts
-    /*
-    	levels:
-    	* danger
-    	* warning
-    	* info
-    	* success
-    */
-  }, {
-    key: "addAlert",
-    value: function addAlert(level, message) {
-      var expire = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 5;
-      var shouldBeTranslated = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
-      var component = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
-      this.Store.dispatch({
-        type: _actions.ADD_ALERT,
-        level: level,
-        message: message,
-        expire: expire,
-        shouldBeTranslated: shouldBeTranslated,
-        component: component
+  // Splash screen
+
+  addSplashScreenRequestor(obj) {
+    var origLen = this.SplashscreenRequestors.size;
+    this.SplashscreenRequestors.add(obj);
+    if (origLen != this.SplashscreenRequestors.size) {
+      this.state.splashscreenRequestors = this.SplashscreenRequestors.size;
+    }
+    var splashscreen = document.getElementById('app-splashscreen'); // See public/index.html`
+    splashscreen === null || splashscreen === void 0 || splashscreen.classList.remove("d-none");
+  }
+  removeSplashScreenRequestor(obj) {
+    var origLen = this.SplashscreenRequestors.size;
+    this.SplashscreenRequestors.delete(obj);
+    if (origLen != this.SplashscreenRequestors.size) {
+      this.setState({
+        splashscreenRequestors: this.SplashscreenRequestors.size
       });
     }
+    if (this.SplashscreenRequestors.size == 0) {
+      var splashscreen = document.getElementById('app-splashscreen'); // See public/index.html
+      splashscreen === null || splashscreen === void 0 || splashscreen.classList.add("d-none");
+    }
+  }
+
+  // Alerts
+  /*
+  	levels:
+  	* danger
+  	* warning
+  	* info
+  	* success
+  */
+  addAlert(level, message) {
+    var expire = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 5;
+    var shouldBeTranslated = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
+    var component = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
+    this.Store.dispatch({
+      type: _actions.ADD_ALERT,
+      level: level,
+      message: message,
+      expire: expire,
+      shouldBeTranslated: shouldBeTranslated,
+      component: component
+    });
+  }
 
+  /*
+  	Alert from exception suppose to be used ONLY for exception cases.
+  	By default it requires:
+  			- exception - this is comming from the try{...}catch(exception){...} . It is important to pass the whole exception.
+  		- message - this is the custom message written by developer based on the situation
+  		Additional options are:
+  			- expire - expiration of the aler (by default set to 30s)
+  		- shouldBeTranslated - boolean for cases where is not possible to use useTranslation hook (by default false)
+  		- component - option to pass additional component of the alert message e.g. button (by default null)
+  		addAlertFromException will always use "danger" color as its background and the full exception will be printed into the console
+  */
+  addAlertFromException(exception, message) {
+    var _exception$response;
+    var expire = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 30;
+    var shouldBeTranslated = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
+    var component = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
+    console.error(exception); // Log the whole exception in the browser
+    var exceptionMessage = /*#__PURE__*/_react.default.createElement("span", null, message);
     /*
-    	Alert from exception suppose to be used ONLY for exception cases.
-    	By default it requires:
-    			- exception - this is comming from the try{...}catch(exception){...} . It is important to pass the whole exception.
-    		- message - this is the custom message written by developer based on the situation
-    		Additional options are:
-    			- expire - expiration of the aler (by default set to 30s)
-    		- shouldBeTranslated - boolean for cases where is not possible to use useTranslation hook (by default false)
-    		- component - option to pass additional component of the alert message e.g. button (by default null)
-    		addAlertFromException will always use "danger" color as its background and the full exception will be printed into the console
+    	If the exception has an error_dict in the response data (error in the new format),
+    	the ErrorHandler component is used to display the error,
+    	along with the exception message in the form-text class.
     */
-  }, {
-    key: "addAlertFromException",
-    value: function addAlertFromException(exception, message) {
-      var _exception$response;
-      var expire = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 30;
-      var shouldBeTranslated = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
-      var component = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
-      console.error(exception); // Log the whole exception in the browser
-      var exceptionMessage = /*#__PURE__*/_react["default"].createElement("span", null, message);
+    if (exception !== null && exception !== void 0 && (_exception$response = exception.response) !== null && _exception$response !== void 0 && (_exception$response = _exception$response.data) !== null && _exception$response !== void 0 && _exception$response.error_dict) {
+      exceptionMessage = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_asab_webui_components.ErrorHandler, {
+        error: exception.response.data
+      }), (exception === null || exception === void 0 ? void 0 : exception.message) && /*#__PURE__*/_react.default.createElement("div", {
+        className: "form-text"
+      }, exception.message));
+    } else {
+      var _exception$response2;
       /*
-      	If the exception has an error_dict in the response data (error in the new format),
-      	the ErrorHandler component is used to display the error,
-      	along with the exception message in the form-text class.
+      	Capture the cases when service returns a message in the exception response data.
+      	Add hoc messages are displayed in form-text class on the new line
       */
-      if (exception !== null && exception !== void 0 && (_exception$response = exception.response) !== null && _exception$response !== void 0 && (_exception$response = _exception$response.data) !== null && _exception$response !== void 0 && _exception$response.error_dict) {
-        exceptionMessage = /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_asab_webui_components.ErrorHandler, {
-          error: exception.response.data
-        }), (exception === null || exception === void 0 ? void 0 : exception.message) && /*#__PURE__*/_react["default"].createElement("div", {
-          className: "form-text"
-        }, exception.message));
+      if (exception !== null && exception !== void 0 && (_exception$response2 = exception.response) !== null && _exception$response2 !== void 0 && (_exception$response2 = _exception$response2.data) !== null && _exception$response2 !== void 0 && _exception$response2.message) {
+        exceptionMessage = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("h5", null, exceptionMessage), /*#__PURE__*/_react.default.createElement("div", {
+          className: "mt-2",
+          style: {
+            whiteSpace: 'pre-wrap'
+          }
+        }, exception.response.data.message));
       } else {
-        var _exception$response2;
-        /*
-        	Capture the cases when service returns a message in the exception response data.
-        	Add hoc messages are displayed in form-text class on the new line
-        */
-        if (exception !== null && exception !== void 0 && (_exception$response2 = exception.response) !== null && _exception$response2 !== void 0 && (_exception$response2 = _exception$response2.data) !== null && _exception$response2 !== void 0 && _exception$response2.message) {
-          exceptionMessage = /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("h5", null, exceptionMessage), /*#__PURE__*/_react["default"].createElement("div", {
-            className: "mt-2",
-            style: {
-              whiteSpace: 'pre-wrap'
-            }
-          }, exception.response.data.message));
-        } else {
-          // Exception message is always present in the exception
-          exceptionMessage = /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("h5", null, exceptionMessage), (exception === null || exception === void 0 ? void 0 : exception.message) && /*#__PURE__*/_react["default"].createElement("div", {
-            className: "mt-2"
-          }, exception.message));
-        }
+        // Exception message is always present in the exception
+        exceptionMessage = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("h5", null, exceptionMessage), (exception === null || exception === void 0 ? void 0 : exception.message) && /*#__PURE__*/_react.default.createElement("div", {
+          className: "mt-2"
+        }, exception.message));
       }
-      this.Store.dispatch({
-        type: _actions.ADD_ALERT,
-        level: "danger",
-        message: exceptionMessage,
-        expire: expire,
-        shouldBeTranslated: shouldBeTranslated,
-        component: component
-      });
     }
-  }, {
-    key: "setAdvancedMode",
-    value: function setAdvancedMode(enabled) {
-      if (enabled === 0) {
-        var state = this.Store.getState();
-        enabled = !state.advmode.enabled;
-      }
-      this.Store.dispatch({
-        type: _actions.SET_ADVANCED_MODE,
-        enabled: enabled
-      });
-      if (enabled) {
-        this.addAlert('warning', "ASABApplicationContainer|Advanced mode enabled", 1, true);
-      } else {
-        this.addAlert('success', "ASABApplicationContainer|Advanced mode disabled", 1, true);
-      }
+    this.Store.dispatch({
+      type: _actions.ADD_ALERT,
+      level: "danger",
+      message: exceptionMessage,
+      expire: expire,
+      shouldBeTranslated: shouldBeTranslated,
+      component: component
+    });
+  }
+  setAdvancedMode(enabled) {
+    if (enabled === 0) {
+      var state = this.Store.getState();
+      enabled = !state.advmode.enabled;
+    }
+    this.Store.dispatch({
+      type: _actions.SET_ADVANCED_MODE,
+      enabled: enabled
+    });
+    if (enabled) {
+      this.addAlert('warning', "ASABApplicationContainer|Advanced mode enabled", 1, true);
+    } else {
+      this.addAlert('success', "ASABApplicationContainer|Advanced mode disabled", 1, true);
     }
+  }
 
-    /*
-    	This method toggles the full-screen mode of the application container.
-    	It takes a parameter called "status" to indicate whether to turn the full-screen mode on or off.
-    */
-  }, {
-    key: "setFullScreenMode",
-    value: function setFullScreenMode(status) {
-      var state = this.Store.getState();
-      if (status === 'on' && state.fullscreenmode.status === 'on') {
-        status = 'off';
-      }
+  /*
+  	This method toggles the full-screen mode of the application container.
+  	It takes a parameter called "status" to indicate whether to turn the full-screen mode on or off.
+  */
+  setFullScreenMode(status) {
+    var state = this.Store.getState();
+    if (status === 'on' && state.fullscreenmode.status === 'on') {
+      status = 'off';
+    }
+    this.Store.dispatch({
+      type: _actions.SET_FULLSCREEN_MODE,
+      status: status
+    });
+    if (status === 'on') {
+      document.body.classList.add('fullscreen');
+      this.addAlert('info', 'ASABApplicationContainer|Fullscreen mode turned on. To turn it off, press CTRL + SHIFT + F.', 30, true);
+    } else {
+      document.body.classList.remove('fullscreen');
+      this.addAlert('info', 'ASABApplicationContainer|Fullscreen mode turned off', 30, true);
+    }
+  }
+  setFlag(name) {
+    (0, _react.useEffect)(() => {
       this.Store.dispatch({
-        type: _actions.SET_FULLSCREEN_MODE,
-        status: status
+        type: _actions.SET_FLAG,
+        flag: name
       });
-      if (status === 'on') {
-        document.body.classList.add('fullscreen');
-        this.addAlert('info', 'ASABApplicationContainer|Fullscreen mode turned on. To turn it off, press CTRL + SHIFT + F.', 30, true);
-      } else {
-        document.body.classList.remove('fullscreen');
-        this.addAlert('info', 'ASABApplicationContainer|Fullscreen mode turned off', 30, true);
-      }
-    }
-  }, {
-    key: "setFlag",
-    value: function setFlag(name) {
-      var _this2 = this;
-      (0, _react.useEffect)(function () {
-        _this2.Store.dispatch({
+      return () => {
+        this.Store.dispatch({
           type: _actions.SET_FLAG,
-          flag: name
+          flag: undefined
         });
-        return function () {
-          _this2.Store.dispatch({
-            type: _actions.SET_FLAG,
-            flag: undefined
-          });
-        };
-      }, [name]);
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      if (this.state.splashscreenRequestors > 0) return (
-        /*#__PURE__*/
-        // When splashscreenRequestors is requested, the application is not rendered.
-        // This prevents race conditions during application init time.
-        _react["default"].createElement(_asab_webui_components.PubSubProvider, {
-          app: this
-        }, /*#__PURE__*/_react["default"].createElement(_reactRedux.Provider, {
-          store: this.Store
-        }, /*#__PURE__*/_react["default"].createElement(_react.Suspense, {
-          fallback: /*#__PURE__*/_react["default"].createElement("div", null)
-        }, /*#__PURE__*/_react["default"].createElement(_Alerts["default"], {
-          app: this
-        }), /*#__PURE__*/_react["default"].createElement("main", {
-          id: "app-main"
-        }, /*#__PURE__*/_react["default"].createElement(_AccessDeniedCard["default"], {
-          app: this
-        })))))
-      );
-      return /*#__PURE__*/_react["default"].createElement(_asab_webui_components.PubSubProvider, {
+      };
+    }, [name]);
+  }
+  render() {
+    if (this.state.splashscreenRequestors > 0) return (
+      /*#__PURE__*/
+      // When splashscreenRequestors is requested, the application is not rendered.
+      // This prevents race conditions during application init time.
+      _react.default.createElement(_asab_webui_components.PubSubProvider, {
         app: this
-      }, /*#__PURE__*/_react["default"].createElement(_reactRedux.Provider, {
+      }, /*#__PURE__*/_react.default.createElement(_reactRedux.Provider, {
         store: this.Store
-      }, /*#__PURE__*/_react["default"].createElement(_react.Suspense, {
-        fallback: /*#__PURE__*/_react["default"].createElement("div", null)
-      }, /*#__PURE__*/_react["default"].createElement("div", {
-        id: "app-networking-indicator",
-        className: "progress-bar progress-bar-animated progress-bar-striped" + (this.state.networking == 0 ? " transparent" : "")
-      }), /*#__PURE__*/_react["default"].createElement(_Alerts["default"], {
-        app: this
-      }), /*#__PURE__*/_react["default"].createElement(_NavbarBrand["default"], {
-        app: this
-      }), /*#__PURE__*/_react["default"].createElement(_Sidebar["default"], {
+      }, /*#__PURE__*/_react.default.createElement(_react.Suspense, {
+        fallback: /*#__PURE__*/_react.default.createElement("div", null)
+      }, /*#__PURE__*/_react.default.createElement(_Alerts.default, {
         app: this
-      }), /*#__PURE__*/_react["default"].createElement(_ToastContainer["default"], {
-        app: this
-      }), /*#__PURE__*/_react["default"].createElement(_Header["default"], {
-        app: this
-      }), /*#__PURE__*/_react["default"].createElement("main", {
+      }), /*#__PURE__*/_react.default.createElement("main", {
         id: "app-main"
-      }, /*#__PURE__*/_react["default"].createElement(_react.Suspense, {
-        fallback: /*#__PURE__*/_react["default"].createElement(_SuspenseScreen["default"], {
-          app: this
-        }) /*The suspense that captures lazy loading of the federated apps*/
-      }, /*#__PURE__*/_react["default"].createElement(_ApplicationRouter["default"], {
+      }, /*#__PURE__*/_react.default.createElement(_AccessDeniedCard.default, {
         app: this
-      }))), /*#__PURE__*/_react["default"].createElement(_Sidepanel["default"], {
+      })))))
+    );
+    return /*#__PURE__*/_react.default.createElement(_asab_webui_components.PubSubProvider, {
+      app: this
+    }, /*#__PURE__*/_react.default.createElement(_reactRedux.Provider, {
+      store: this.Store
+    }, /*#__PURE__*/_react.default.createElement(_react.Suspense, {
+      fallback: /*#__PURE__*/_react.default.createElement("div", null)
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      id: "app-networking-indicator",
+      className: "progress-bar progress-bar-animated progress-bar-striped" + (this.state.networking == 0 ? " transparent" : "")
+    }), /*#__PURE__*/_react.default.createElement(_Alerts.default, {
+      app: this
+    }), /*#__PURE__*/_react.default.createElement(_NavbarBrand.default, {
+      app: this
+    }), /*#__PURE__*/_react.default.createElement(_Sidebar.default, {
+      app: this
+    }), /*#__PURE__*/_react.default.createElement(_ToastContainer.default, {
+      app: this
+    }), /*#__PURE__*/_react.default.createElement(_Header.default, {
+      app: this
+    }), /*#__PURE__*/_react.default.createElement("main", {
+      id: "app-main"
+    }, /*#__PURE__*/_react.default.createElement(_react.Suspense, {
+      fallback: /*#__PURE__*/_react.default.createElement(_SuspenseScreen.default, {
         app: this
-      }))));
-    }
-  }]);
-}(_react.Component);
-var _default = exports["default"] = Application;
+      }) /*The suspense that captures lazy loading of the federated apps*/
+    }, /*#__PURE__*/_react.default.createElement(_ApplicationRouter.default, {
+      app: this
+    }))), /*#__PURE__*/_react.default.createElement(_Sidepanel.default, {
+      app: this
+    }))));
+  }
+}
+var _default = exports.default = Application;