diff --git a/client/src/helpers.js b/client/src/helpers.js
index c941027311..0cca4fb3eb 100644
--- a/client/src/helpers.js
+++ b/client/src/helpers.js
@@ -67,9 +67,7 @@ class Helpers {
    * @param {string} id listenerId
    */
   removeEventListener(id) {
-    const listenerExists = Boolean(
-      this.listeners.find(l => l.listenerId === id)
-    );
+    const listenerExists = Boolean(this.listeners.find(l => l.listenerId === id));
     if (listenerExists) {
       this.listeners = this.listeners.filter(l => l.listenerId !== id);
       return true;
@@ -83,9 +81,7 @@ class Helpers {
    */
   getRandomId() {
     // window.msCrypto for IE 11
-    return (window.crypto || window.msCrypto).getRandomValues(
-      new Uint32Array(1)
-    )[0];
+    return (window.crypto || window.msCrypto).getRandomValues(new Uint32Array(1))[0];
   }
 
   /**
diff --git a/client/src/lifecycleManager.js b/client/src/lifecycleManager.js
index 8aa3e1d3a3..ae3a26ecb0 100644
--- a/client/src/lifecycleManager.js
+++ b/client/src/lifecycleManager.js
@@ -10,12 +10,7 @@ class LifecycleManager extends LuigiClientBase {
   constructor() {
     super();
     this.luigiInitialized = false;
-    this.defaultContextKeys = [
-      'context',
-      'internal',
-      'nodeParams',
-      'pathParams'
-    ];
+    this.defaultContextKeys = ['context', 'internal', 'nodeParams', 'pathParams'];
     this.setCurrentContext(
       this.defaultContextKeys.reduce(function(acc, key) {
         acc[key] = {};
@@ -50,12 +45,12 @@ class LifecycleManager extends LuigiClientBase {
    * @example
    * const init = LuigiClient.isLuigiClientInitialized()
    */
-  isLuigiClientInitialized(){
+  isLuigiClientInitialized() {
     return this.luigiInitialized;
   }
 
   /**
-   * Starts the handshake with Luigi Core and thereafter resulting in initialization of Luigi Client. It is always ran by default when importing luigi-client package in your micro frontend. Note that when using 'defer-luigi-init' to defer default initialization you will need to initialize the handshake using this function manually wherever needed. 
+   * Starts the handshake with Luigi Core and thereafter resulting in initialization of Luigi Client. It is always ran by default when importing luigi-client package in your micro frontend. Note that when using 'defer-luigi-init' to defer default initialization you will need to initialize the handshake using this function manually wherever needed.
    * @since 1.12.0
    * @memberof Lifecycle
    * @example
@@ -63,7 +58,7 @@ class LifecycleManager extends LuigiClientBase {
    */
   luigiClientInit() {
     if (this.luigiInitialized) {
-      console.warn("Luigi Client has been already initialized")
+      console.warn('Luigi Client has been already initialized');
       return;
     }
     /**
@@ -78,12 +73,7 @@ class LifecycleManager extends LuigiClientBase {
             rawData[key] = JSON.parse(rawData[key]);
           }
         } catch (e) {
-          console.info(
-            'unable to parse luigi context data for',
-            key,
-            rawData[key],
-            e
-          );
+          console.info('unable to parse luigi context data for', key, rawData[key], e);
         }
       }
       this.setCurrentContext(rawData);
@@ -116,9 +106,7 @@ class LifecycleManager extends LuigiClientBase {
       setContext(e.data);
       if (!this.currentContext.internal.isNavigateBack) {
         history.replaceState({ luigiInduced: true }, '', e.data.viewUrl);
-        window.dispatchEvent(
-          new PopStateEvent('popstate', { state: 'luiginavigation' })
-        );
+        window.dispatchEvent(new PopStateEvent('popstate', { state: 'luiginavigation' }));
       }
       // execute the context change listener if set by the micro frontend
       this._notifyUpdate();
@@ -137,8 +125,7 @@ class LifecycleManager extends LuigiClientBase {
       '*'
     );
     this._tpcCheck();
-  };
-
+  }
 
   _tpcCheck() {
     let tpc = 'enabled';
@@ -335,12 +322,9 @@ class LifecycleManager extends LuigiClientBase {
    * const customMsgId = LuigiClient.addCustomMessageListener('myapp.project-updated', (data) => doSomething(data))
    */
   addCustomMessageListener(customMessageId, customMessageListener) {
-    return helpers.addEventListener(
-      customMessageId,
-      (customMessage, listenerId) => {
-        return customMessageListener(customMessage, listenerId);
-      }
-    );
+    return helpers.addEventListener(customMessageId, (customMessage, listenerId) => {
+      return customMessageListener(customMessage, listenerId);
+    });
   }
 
   /**
@@ -467,9 +451,7 @@ class LifecycleManager extends LuigiClientBase {
    * @since 0.6.2
    */
   sendCustomMessage(message) {
-    const customMessageInternal = helpers.convertCustomMessageUserToInternal(
-      message
-    );
+    const customMessageInternal = helpers.convertCustomMessageUserToInternal(message);
     helpers.sendPostMessageToLuigiCore(customMessageInternal);
   }
 
diff --git a/client/src/linkManager.js b/client/src/linkManager.js
index 55f3dfb237..9b9d638b61 100644
--- a/client/src/linkManager.js
+++ b/client/src/linkManager.js
@@ -53,14 +53,7 @@ export class linkManager extends LuigiClientBase {
    * LuigiClient.linkManager().navigate('/settings', null, true) // preserve view
    * LuigiClient.linkManager().navigate('#?Intent=Sales-order?id=13') // intent navigation
    */
-  navigate(
-    path,
-    sessionId,
-    preserveView,
-    modalSettings,
-    splitViewSettings,
-    drawerSettings
-  ) {
+  navigate(path, sessionId, preserveView, modalSettings, splitViewSettings, drawerSettings) {
     if (this.options.errorSkipNavigation) {
       this.options.errorSkipNavigation = false;
       return;
@@ -150,18 +143,12 @@ export class linkManager extends LuigiClientBase {
   fromContext(navigationContext) {
     const navigationContextInParent =
       this.currentContext.context.parentNavigationContexts &&
-      this.currentContext.context.parentNavigationContexts.indexOf(
-        navigationContext
-      ) !== -1;
+      this.currentContext.context.parentNavigationContexts.indexOf(navigationContext) !== -1;
     if (navigationContextInParent) {
       this.options.fromContext = navigationContext;
     } else {
       this.options.errorSkipNavigation = true;
-      console.error(
-        'Navigation not possible, navigationContext ' +
-          navigationContext +
-          ' not found.'
-      );
+      console.error('Navigation not possible, navigationContext ' + navigationContext + ' not found.');
     }
     return this;
   }
@@ -175,15 +162,12 @@ export class linkManager extends LuigiClientBase {
    */
   fromClosestContext() {
     const hasParentNavigationContext =
-      this.currentContext &&
-      this.currentContext.context.parentNavigationContexts.length > 0;
+      this.currentContext && this.currentContext.context.parentNavigationContexts.length > 0;
     if (hasParentNavigationContext) {
       this.options.fromContext = null;
       this.options.fromClosestContext = true;
     } else {
-      console.error(
-        'Navigation not possible, no parent navigationContext found.'
-      );
+      console.error('Navigation not possible, no parent navigationContext found.');
     }
     return this;
   }
@@ -292,10 +276,7 @@ export class linkManager extends LuigiClientBase {
    * @returns {boolean} indicating if there is a preserved view you can return to
    */
   hasBack() {
-    return (
-      !!this.currentContext.internal.modal ||
-      this.currentContext.internal.viewStackSize !== 0
-    );
+    return !!this.currentContext.internal.modal || this.currentContext.internal.viewStackSize !== 0;
   }
 
   /**
diff --git a/client/src/luigi-client.js b/client/src/luigi-client.js
index 152f79a3a8..c1e459305a 100644
--- a/client/src/luigi-client.js
+++ b/client/src/luigi-client.js
@@ -9,11 +9,7 @@ import { storageManager } from './storageManager';
  */
 class LuigiClient {
   constructor() {
-    if (
-      window !== window.top &&
-      window.document.head.getAttribute('disable-luigi-history-handling') !=
-      'true'
-    ) {
+    if (window !== window.top && window.document.head.getAttribute('disable-luigi-history-handling') != 'true') {
       history.pushState = history.replaceState.bind(history);
     }
   }
diff --git a/client/src/luigi-element.js b/client/src/luigi-element.js
index c3c093609c..591eb82e5c 100644
--- a/client/src/luigi-element.js
+++ b/client/src/luigi-element.js
@@ -36,11 +36,7 @@ export class LuigiElement extends HTMLElement {
       this.afterInit(ctx);
       this.__initialized = true;
     };
-    if (
-      this.luigiConfig &&
-      this.luigiConfig.styleSources &&
-      this.luigiConfig.styleSources.length > 0
-    ) {
+    if (this.luigiConfig && this.luigiConfig.styleSources && this.luigiConfig.styleSources.length > 0) {
       let nr_styles = this.luigiConfig.styleSources.length;
       const loadStylesSync = this.luigiConfig.loadStylesSync;
       const afterLoadOrError = () => {
@@ -150,11 +146,7 @@ export function html(literal, ...keys) {
   let html = '';
   literal.forEach((el, index) => {
     html += el;
-    if (
-      index < keys.length &&
-      keys[index] !== undefined &&
-      keys[index] !== null
-    ) {
+    if (index < keys.length && keys[index] !== undefined && keys[index] !== null) {
       html += keys[index];
     }
   });
diff --git a/client/src/splitViewHandle.js b/client/src/splitViewHandle.js
index a2d7c0eed0..f549b0e798 100644
--- a/client/src/splitViewHandle.js
+++ b/client/src/splitViewHandle.js
@@ -111,10 +111,7 @@ export class splitViewHandle extends LuigiClientBase {
       console.warn(name + ' is not a valid split view event');
       return false;
     }
-    const id = helpers.addEventListener(
-      `luigi.navigation.splitview.${name}.ok`,
-      e => callback(e.data.data)
-    );
+    const id = helpers.addEventListener(`luigi.navigation.splitview.${name}.ok`, e => callback(e.data.data));
     this.splitView.listeners.push(id);
     return id;
   }
diff --git a/client/src/storageManager.js b/client/src/storageManager.js
index 007b7576fa..f8651e60d4 100644
--- a/client/src/storageManager.js
+++ b/client/src/storageManager.js
@@ -14,9 +14,7 @@ class StorageManager extends LuigiClientBase {
   constructor() {
     super();
     this.storageEventProcessor = new StorageEventProcessor();
-    helpers.addEventListener('storage', (evt, listenerId) =>
-      this.storageEventProcessor.processEvent(evt, listenerId)
-    );
+    helpers.addEventListener('storage', (evt, listenerId) => this.storageEventProcessor.processEvent(evt, listenerId));
   }
 
   /**
diff --git a/client/src/uxManager.js b/client/src/uxManager.js
index 66b8785f1b..1973afac27 100644
--- a/client/src/uxManager.js
+++ b/client/src/uxManager.js
@@ -12,8 +12,7 @@ class UxManager extends LuigiClientBase {
     super();
     helpers.addEventListener('luigi.current-locale-changed', e => {
       if (e.data.currentLocale && lifecycleManager.currentContext?.internal) {
-        lifecycleManager.currentContext.internal.currentLocale =
-          e.data.currentLocale;
+        lifecycleManager.currentContext.internal.currentLocale = e.data.currentLocale;
         lifecycleManager._notifyUpdate();
       }
     });
@@ -95,13 +94,10 @@ class UxManager extends LuigiClientBase {
    *  });
    */
   showConfirmationModal(settings) {
-    helpers.addEventListener(
-      'luigi.ux.confirmationModal.hide',
-      (e, listenerId) => {
-        this.hideConfirmationModal(e.data.data);
-        helpers.removeEventListener(listenerId);
-      }
-    );
+    helpers.addEventListener('luigi.ux.confirmationModal.hide', (e, listenerId) => {
+      this.hideConfirmationModal(e.data.data);
+      helpers.removeEventListener(listenerId);
+    });
     helpers.sendPostMessageToLuigiCore({
       msg: 'luigi.ux.confirmationModal.show',
       data: { settings }
@@ -169,9 +165,7 @@ class UxManager extends LuigiClientBase {
     //generate random ID
     settings.id = helpers.getRandomId();
     if (settings?.closeAfter < 100) {
-      console.warn(
-        `Message with id='${settings.id}' has too small 'closeAfter' value. It needs to be at least 100ms.`
-      );
+      console.warn(`Message with id='${settings.id}' has too small 'closeAfter' value. It needs to be at least 100ms.`);
       settings.closeAfter = undefined;
     }
     helpers.sendPostMessageToLuigiCore({
diff --git a/core/package.json b/core/package.json
index b2eaa39a02..7896060ba7 100644
--- a/core/package.json
+++ b/core/package.json
@@ -77,7 +77,7 @@
     },
     {
       "path": "./public/luigi.css",
-      "maxSize": "460 kB",
+      "maxSize": "461 kB",
       "compression": "none"
     },
     {
diff --git a/core/src/Alerts.html b/core/src/Alerts.html
index 8c1a2b6e01..0ba5ddbfc8 100644
--- a/core/src/Alerts.html
+++ b/core/src/Alerts.html
@@ -6,9 +6,9 @@
     id="j2ALl423"
     data-testid="luigi-alert"
   >
-    <p
-      class="fd-message-strip__text"
-    >{@html al.dataSanitized ? al.settings.text: ''}</p>
+    <p class="fd-message-strip__text">
+      {@html al.dataSanitized ? al.settings.text: ''}
+    </p>
     <button
       class="fd-button fd-button--transparent fd-message"
       on:click="{() => dispatch('alertDismiss',{id: al.settings.id})}"
@@ -28,27 +28,27 @@
     createEventDispatcher,
     onMount,
     getContext
-  } from 'svelte';
+  } from "svelte";
 
   const dispatch = createEventDispatcher();
 
-  import { EscapingHelpers } from './utilities/helpers';
+  import { EscapingHelpers } from "./utilities/helpers";
 
   export let alertQueue;
   export let alertTypeMap = {
-    info: 'information',
-    success: 'success',
-    warning: 'warning',
-    error: 'error'
+    info: "information",
+    success: "success",
+    warning: "warning",
+    error: "error"
   };
   const getUnsavedChangesModalPromise = getContext(
-    'getUnsavedChangesModalPromise'
+    "getUnsavedChangesModalPromise"
   );
-  const handleNavigation = getContext('handleNavigation');
+  const handleNavigation = getContext("handleNavigation");
 
   beforeUpdate(() => {
     if (!alertQueue || !alertQueue.length) {
-      console.warn('There are no alerts to display');
+      console.warn("There are no alerts to display");
       return;
     }
 
@@ -87,8 +87,8 @@
   // review these functions and remove unnecessary 'export' keywords
   export function addClickListener(url, elemId) {
     try {
-      document.getElementById(elemId).addEventListener('click', event => {
-        const isRelative = !url.startsWith('/');
+      document.getElementById(elemId).addEventListener("click", event => {
+        const isRelative = !url.startsWith("/");
         event.stopPropagation();
         getUnsavedChangesModalPromise().then(() => {
           const data = {
@@ -101,7 +101,7 @@
         });
       });
     } catch (e) {
-      console.error('Error on Alert::addClickListener', e);
+      console.error("Error on Alert::addClickListener", e);
     }
   }
 </script>
diff --git a/core/src/App.html b/core/src/App.html
index 3d23687555..255dbdef89 100644
--- a/core/src/App.html
+++ b/core/src/App.html
@@ -1,9 +1,11 @@
-<svelte:window on:resize="{onResize}"/>
+<svelte:window on:resize="{onResize}" />
 <div id="app" class="{hideNav? 'no-nav' : ''} {hideSideNav? 'no-side-nav':''}">
   {#if alerts && alerts.length}
-  <Alerts alertQueue="{alerts}" on:alertDismiss="{handleAlertDismissExternal}"></Alerts>
-  {/if}
-  {#if mfModal.displayed}
+  <Alerts
+    alertQueue="{alerts}"
+    on:alertDismiss="{handleAlertDismissExternal}"
+  ></Alerts>
+  {/if} {#if mfModal.displayed}
   <Modal
     settings="{mfModal.settings}"
     nodepath="{mfModal.nodepath}"
@@ -11,8 +13,7 @@
     on:iframeCreated="{modalIframeCreated}"
     on:wcCreated="{modalWCCreated}"
   ></Modal>
-  {/if}
-  {#if mfDrawer.displayed && mfDrawer.settings.isDrawer}
+  {/if} {#if mfDrawer.displayed && mfDrawer.settings.isDrawer}
   <Modal
     settings="{mfDrawer.settings}"
     nodepath="{mfDrawer.nodepath}"
@@ -22,15 +23,13 @@
   >
     <Backdrop area="drawer" disable="{disableBackdrop}"></Backdrop>
   </Modal>
-  {/if}
-  {#if confirmationModal.displayed}
+  {/if} {#if confirmationModal.displayed}
   <ConfirmationModal
     settings="{confirmationModal.settings}"
     on:modalConfirm="{()=> handleModalResult(true)}"
     on:modalDismiss="{() => handleModalResult(false)}"
   ></ConfirmationModal>
-  {/if}
-  {#if internalUserSettingsObject.displayed}
+  {/if} {#if internalUserSettingsObject.displayed}
   <UserSettingsDialog
     on:close="{closeUserSettings}"
     userSettingGroups="{internalUserSettingsObject.userSettingGroups}"
@@ -107,8 +106,7 @@
     on:resizeTabNav="{onResizeTabNav}"
     burgerTooltip="{burgerTooltip}"
   />
-  {/if}
-  {#if (tabNav && !hideNav)}
+  {/if} {#if (tabNav && !hideNav)}
   <TabNav
     pathData="{navigationPath}"
     pathParams="{pathParams}"
@@ -119,24 +117,24 @@
 </div>
 
 <script type="text/javascript">
-  import Alerts from './Alerts.html';
-  import ConfirmationModal from './ConfirmationModal.html';
-  import Modal from './Modal.html';
-  import UserSettingsDialog from './UserSettingsDialog.html';
-  import Backdrop from './Backdrop.html';
-  import SplitView from './SplitView.html';
-  import LeftNav from './navigation/LeftNav.html';
-  import TopNav from './navigation/TopNav.html';
-  import TabNav from './navigation/TabNav.html';
-  import GlobalNav from './navigation/GlobalNav.html';
+  import Alerts from "./Alerts.html";
+  import ConfirmationModal from "./ConfirmationModal.html";
+  import Modal from "./Modal.html";
+  import UserSettingsDialog from "./UserSettingsDialog.html";
+  import Backdrop from "./Backdrop.html";
+  import SplitView from "./SplitView.html";
+  import LeftNav from "./navigation/LeftNav.html";
+  import TopNav from "./navigation/TopNav.html";
+  import TabNav from "./navigation/TabNav.html";
+  import GlobalNav from "./navigation/GlobalNav.html";
   import {
     afterUpdate,
     onMount,
     setContext,
     createEventDispatcher
-  } from 'svelte';
-  import { fade } from 'svelte/transition';
-  import { CSS_BREAKPOINTS } from './utilities/constants';
+  } from "svelte";
+  import { fade } from "svelte/transition";
+  import { CSS_BREAKPOINTS } from "./utilities/constants";
   import {
     EventListenerHelpers,
     GenericHelpers,
@@ -147,7 +145,7 @@
     StorageHelper,
     UserSettingsHelper,
     NavigationHelpers
-  } from './utilities/helpers';
+  } from "./utilities/helpers";
   import {
     LuigiI18N,
     LuigiConfig,
@@ -155,15 +153,15 @@
     LuigiGlobalSearch,
     LuigiFeatureToggles,
     LuigiTheming
-  } from './core-api';
-  import { Navigation } from './navigation/services/navigation';
-  import { Routing } from './services/routing';
-  import { Iframe } from './services/iframe';
-  import { SplitViewSvc } from './services/split-view';
-  import { ViewGroupPreloading } from './services/preloading';
-  import { MessagesListeners } from './services/messages-listeners';
-  import { thirdPartyCookiesStatus } from './utilities/third-party-cookies-check.js';
-  import { NodeDataManagementStorage } from './services/node-data-management.js';
+  } from "./core-api";
+  import { Navigation } from "./navigation/services/navigation";
+  import { Routing } from "./services/routing";
+  import { Iframe } from "./services/iframe";
+  import { SplitViewSvc } from "./services/split-view";
+  import { ViewGroupPreloading } from "./services/preloading";
+  import { MessagesListeners } from "./services/messages-listeners";
+  import { thirdPartyCookiesStatus } from "./utilities/third-party-cookies-check.js";
+  import { NodeDataManagementStorage } from "./services/node-data-management.js";
 
   const dispatch = createEventDispatcher();
 
@@ -238,7 +236,7 @@
     const userSettingGroups = await LuigiConfig.readUserSettings();
     const hasUserSettings =
       userSettingsGroupName &&
-      typeof userSettingGroups === 'object' &&
+      typeof userSettingGroups === "object" &&
       userSettingGroups !== null;
     const internalData = {
       isNavigateBack,
@@ -265,12 +263,12 @@
 
   const sendContextToClient = async (config, goBackContext = {}) => {
     if (!config.iframe) {
-      console.info('iframe does not exist, not able to send context.');
+      console.info("iframe does not exist, not able to send context.");
       return;
     }
 
     const message = {
-      msg: 'luigi.init',
+      msg: "luigi.init",
       context: JSON.stringify(
         Object.assign({}, config.context || context, goBackContext)
       ),
@@ -288,7 +286,7 @@
 
   const sendAuthDataToClient = authData => {
     const message = {
-      msg: 'luigi.auth.tokenIssued',
+      msg: "luigi.auth.tokenIssued",
       authData
     };
     IframeHelpers.broadcastMessageToAllIframes(message);
@@ -302,12 +300,12 @@
 
       $: preservedViews.push({
         path: Routing.getNodePath(currentNode, urlParamsRaw),
-        nextPath: nextPath.startsWith('/') ? nextPath : '/' + nextPath,
+        nextPath: nextPath.startsWith("/") ? nextPath : "/" + nextPath,
         context
       });
 
       // Mark iframe with pv if there is a preserved view situation
-      config.iframe['pv'] = 'pv';
+      config.iframe["pv"] = "pv";
     }
   };
 
@@ -323,7 +321,7 @@
     Routing.navigateTo(path, true, isNavigationSyncEnabled);
   };
 
-  const removeQueryParams = str => str.split('?')[0];
+  const removeQueryParams = str => str.split("?")[0];
 
   const isValidBackRoute = (preservedViews, routeHash) => {
     if (preservedViews.length === 0) {
@@ -331,7 +329,7 @@
     }
     // we're only checking the previous goBack state and
     // compare it with the new route
-    const routePath = routeHash.startsWith('/') ? routeHash : `/${routeHash}`;
+    const routePath = routeHash.startsWith("/") ? routeHash : `/${routeHash}`;
     const lastPreservedView = [...preservedViews].pop();
     const paths = [
       removeQueryParams(lastPreservedView.path),
@@ -395,49 +393,49 @@
       set: obj => {
         if (obj) {
           Object.getOwnPropertyNames(obj).forEach(prop => {
-            if (prop === 'hideNav') {
+            if (prop === "hideNav") {
               hideNav = obj.hideNav;
-            } else if (prop === 'viewUrl') {
+            } else if (prop === "viewUrl") {
               viewUrl = obj.viewUrl;
-            } else if (prop === 'nodeParams') {
+            } else if (prop === "nodeParams") {
               nodeParams = obj.nodeParams;
-            } else if (prop === 'viewGroup') {
+            } else if (prop === "viewGroup") {
               viewGroup = obj.viewGroup;
-            } else if (prop === 'urlParamsRaw') {
+            } else if (prop === "urlParamsRaw") {
               urlParamsRaw = obj.urlParamsRaw;
-            } else if (prop === 'currentNode') {
+            } else if (prop === "currentNode") {
               currentNode = obj.currentNode;
-            } else if (prop === 'navigationPath') {
+            } else if (prop === "navigationPath") {
               navigationPath = obj.navigationPath;
-            } else if (prop === 'context') {
+            } else if (prop === "context") {
               context = obj.context;
-            } else if (prop === 'pathParams') {
+            } else if (prop === "pathParams") {
               pathParams = obj.pathParams;
-            } else if (prop === 'hideSideNav') {
+            } else if (prop === "hideSideNav") {
               hideSideNav = obj.hideSideNav;
-            } else if (prop === 'isolateView') {
+            } else if (prop === "isolateView") {
               isolateView = obj.isolateView;
-            } else if (prop === 'pageErrorHandler') {
+            } else if (prop === "pageErrorHandler") {
               pageErrorHandler = obj.pageErrorHandler;
-            } else if (prop === 'previousNodeValues') {
+            } else if (prop === "previousNodeValues") {
               previousNodeValues = obj.previousNodeValues;
-            } else if (prop === 'mfSplitView') {
+            } else if (prop === "mfSplitView") {
               mfSplitView = obj.mfSplitView;
-            } else if (prop === 'splitViewValues') {
+            } else if (prop === "splitViewValues") {
               splitViewValues = obj.splitViewValues;
-            } else if (prop === 'splitViewIframe') {
+            } else if (prop === "splitViewIframe") {
               splitViewIframe = obj.splitViewIframe;
-            } else if (prop == 'splitViewWC') {
+            } else if (prop == "splitViewWC") {
               splitViewWC = obj.splitViewWC;
-            } else if (prop === 'showLoadingIndicator') {
+            } else if (prop === "showLoadingIndicator") {
               showLoadingIndicator = obj.showLoadingIndicator;
-            } else if (prop === 'tabNav') {
+            } else if (prop === "tabNav") {
               tabNav = obj.tabNav;
-            } else if (prop === 'isNavigateBack') {
+            } else if (prop === "isNavigateBack") {
               isNavigateBack = obj.isNavigateBack;
-            } else if (prop === 'goBackContext') {
+            } else if (prop === "goBackContext") {
               goBackContext = obj.goBackContext;
-            } else if (prop === 'isNavigationSyncEnabled') {
+            } else if (prop === "isNavigationSyncEnabled") {
               isNavigationSyncEnabled = obj.isNavigationSyncEnabled;
             }
           });
@@ -466,7 +464,7 @@
           config
         );
       },
-      ['navigation.nodes']
+      ["navigation.nodes"]
     );
 
     // subsequential route handling
@@ -495,7 +493,7 @@
     return GenericHelpers.replaceVars(
       Routing.getNodePath(node),
       pathParams,
-      ':',
+      ":",
       false
     );
   };
@@ -507,7 +505,7 @@
       const node = [...navigationPath].reverse().find(n => n.virtualTree);
       if (!node) {
         console.error(
-          'LuigiClient Error: fromVirtualTreeRoot() is not possible, not inside a virtualTree navigation. Docs: https://docs.luigi-project.io/docs/navigation-parameters-reference/?section=virtualtree'
+          "LuigiClient Error: fromVirtualTreeRoot() is not possible, not inside a virtualTree navigation. Docs: https://docs.luigi-project.io/docs/navigation-parameters-reference/?section=virtualtree"
         );
         return;
       }
@@ -539,15 +537,15 @@
       path = Routing.concatenatePath(getSubPath(currentNode), params.link);
     }
     if (params.nodeParams && Object.keys(params.nodeParams).length) {
-      path += path.includes('?') ? '&' : '?';
+      path += path.includes("?") ? "&" : "?";
       Object.entries(params.nodeParams).forEach((entry, index) => {
         path +=
           encodeURIComponent(
             RoutingHelpers.getContentViewParamPrefix() + entry[0]
           ) +
-          '=' +
+          "=" +
           encodeURIComponent(entry[1]) +
-          (index < Object.keys(params.nodeParams).length - 1 ? '&' : '');
+          (index < Object.keys(params.nodeParams).length - 1 ? "&" : "");
       });
     }
     return path;
@@ -578,13 +576,13 @@
     resizeTabNavToggle = !resizeTabNavToggle;
   };
 
-  setContext('handleNavigation', handleNavigation);
+  setContext("handleNavigation", handleNavigation);
 
   ////GLOBALSEARCH
 
   const checkSearchProvider = searchProvider => {
     if (!searchProvider) {
-      console.warn('No search provider defined.');
+      console.warn("No search provider defined.");
       return false;
     } else {
       return true;
@@ -610,7 +608,7 @@
   export const clearSearchField = () => {
     if (checkSearchProvider(searchProvider)) {
       if (inputElem) {
-        inputElem.value = '';
+        inputElem.value = "";
         closeSearchResult();
       }
     }
@@ -637,7 +635,7 @@
           searchProvider.onInput();
         } else {
           console.error(
-            'onInput is not a function. Please check the global search configuration.'
+            "onInput is not a function. Please check the global search configuration."
           );
         }
       }
@@ -672,7 +670,7 @@
           searchResult = arr;
         }
       } else {
-        console.warn('Search result array is empty.');
+        console.warn("Search result array is empty.");
       }
     }
   };
@@ -704,7 +702,7 @@
   //// SPLIT VIEW
   export const openSplitView = (nodepath, settings) => {
     if (mfSplitView.displayed) {
-      console.warn('Only one splitview can be opened at a time');
+      console.warn("Only one splitview can be opened at a time");
       return;
     }
     mfSplitView = SplitViewSvc.getDefaultData().mfSplitView;
@@ -771,7 +769,7 @@
   let previousWindowWidth;
 
   const closeLeftNav = () => {
-    document.body.classList.remove('lui-leftNavToggle');
+    document.body.classList.remove("lui-leftNavToggle");
   };
 
   const onResize = () => {
@@ -842,7 +840,7 @@
     const alert = getAlertWithId(alerts, id);
 
     if (!alert) {
-      console.error('An unexisting alert has been dismissed.', alerts, id);
+      console.error("An unexisting alert has been dismissed.", alerts, id);
       return;
     }
 
@@ -853,7 +851,7 @@
     if (openFromClient) {
       const iframe = Iframe.getActiveIframe(contentNode);
       const message = {
-        msg: 'luigi.ux.alert.hide',
+        msg: "luigi.ux.alert.hide",
         id
         //TODO: update docu for this param
       };
@@ -905,7 +903,7 @@
     if (openFromClient) {
       const iframe = Iframe.getActiveIframe(contentNode);
       const message = {
-        msg: 'luigi.ux.confirmationModal.hide',
+        msg: "luigi.ux.confirmationModal.hide",
         data: { confirmed: result }
       };
       IframeHelpers.sendMessageToIframe(iframe, message);
@@ -928,14 +926,14 @@
 
   const showUnsavedChangesModal = () => {
     return showModal({
-      header: LuigiI18N.getTranslation('luigi.unsavedChangesAlert.header'),
-      body: LuigiI18N.getTranslation('luigi.unsavedChangesAlert.body'),
-      buttonDismiss: LuigiI18N.getTranslation('luigi.button.dismiss'),
-      buttonConfirm: LuigiI18N.getTranslation('luigi.button.confirm')
+      header: LuigiI18N.getTranslation("luigi.unsavedChangesAlert.header"),
+      body: LuigiI18N.getTranslation("luigi.unsavedChangesAlert.body"),
+      buttonDismiss: LuigiI18N.getTranslation("luigi.button.dismiss"),
+      buttonConfirm: LuigiI18N.getTranslation("luigi.button.confirm")
     });
   };
 
-  setContext('getUnsavedChangesModalPromise', getUnsavedChangesModalPromise);
+  setContext("getUnsavedChangesModalPromise", getUnsavedChangesModalPromise);
 
   //// MICRO-FRONTEND MODAL
 
@@ -960,7 +958,7 @@
     mfModal.settings = settings;
 
     const showModalPathInUrl = LuigiConfig.getConfigBooleanValue(
-      'routing.showModalPathInUrl'
+      "routing.showModalPathInUrl"
     );
     if (showModalPathInUrl) {
       Routing.appendModalDataToUrl(nodepath, settings);
@@ -978,11 +976,10 @@
   };
 
   const closeModal = event => {
-
     if (modalIframe) {
       getUnsavedChangesModalPromise(modalIframe.contentWindow).then(() => {
         const showModalPathInUrl = LuigiConfig.getConfigBooleanValue(
-          'routing.showModalPathInUrl'
+          "routing.showModalPathInUrl"
         );
         if (showModalPathInUrl) {
           Routing.removeModalDataFromUrl();
@@ -991,7 +988,7 @@
       });
     } else if (modalWC) {
       const showModalPathInUrl = LuigiConfig.getConfigBooleanValue(
-        'routing.showModalPathInUrl'
+        "routing.showModalPathInUrl"
       );
       if (showModalPathInUrl) {
         Routing.removeModalDataFromUrl();
@@ -1000,7 +997,7 @@
     }
   };
 
-  setContext('openViewInModal', openViewInModal);
+  setContext("openViewInModal", openViewInModal);
 
   ///
   let mfDrawer = {};
@@ -1042,7 +1039,7 @@
     }
     if (
       !activeDrawer ||
-      (event && event.detail && event.detail.type !== 'modal')
+      (event && event.detail && event.detail.type !== "modal")
     ) {
       if (drawerIframe) {
         getUnsavedChangesModalPromise(drawerIframe.contentWindow).then(() => {
@@ -1061,7 +1058,7 @@
       internalUserSettingsObject.displayed = true;
     } else {
       console.info(
-        'There are no user setting groups in the settings section of the luigi config defined.'
+        "There are no user setting groups in the settings section of the luigi config defined."
       );
     }
   };
@@ -1072,10 +1069,10 @@
 
   function init(node) {
     const isolateAllViews = LuigiConfig.getConfigValue(
-      'navigation.defaults.isolateView'
+      "navigation.defaults.isolateView"
     );
     const defaultPageErrorHandler = LuigiConfig.getConfigValue(
-      'navigation.defaults.pageErrorHandler'
+      "navigation.defaults.pageErrorHandler"
     );
     const config = {
       iframe: null,
@@ -1086,19 +1083,19 @@
     };
     LuigiI18N.addCurrentLocaleChangeListener(locale => {
       const message = {
-        msg: 'luigi.current-locale-changed',
+        msg: "luigi.current-locale-changed",
         currentLocale: locale
       };
       IframeHelpers.broadcastMessageToAllIframes(message);
     });
 
-    EventListenerHelpers.addEventListener('popstate', async e => {
+    EventListenerHelpers.addEventListener("popstate", async e => {
       const alertQueue = alerts;
       if (!alertQueue || !alertQueue.length) return;
 
       const updatedAlerts = alertQueue
         .map(a => {
-          if (a && !a.openFromClient && typeof a.settings.ttl === 'number') {
+          if (a && !a.openFromClient && typeof a.settings.ttl === "number") {
             //alert has some TTL set
             if (a.settings.ttl === 0) {
               //the TTL value dropped down to 0, remove this alert
@@ -1116,20 +1113,20 @@
       alerts = updatedAlerts;
     });
 
-    EventListenerHelpers.addEventListener('message', async e => {
+    EventListenerHelpers.addEventListener("message", async e => {
       const iframe = IframeHelpers.getValidMessageSource(e);
       if (!iframe) return;
       iframe._ready = true;
 
-      if ('custom' === e.data.msg) {
+      if ("custom" === e.data.msg) {
         const customMessagesListeners =
-          LuigiConfig.getConfigValue('communication.customMessagesListeners') ||
+          LuigiConfig.getConfigValue("communication.customMessagesListeners") ||
           {};
         const message = MessagesListeners.convertCustomMessageInternalToUser(
           e.data
         );
         const customMessageListener = customMessagesListeners[message.id];
-        const userSettingsCMKey = 'luigi.updateUserSettings';
+        const userSettingsCMKey = "luigi.updateUserSettings";
         if (internalUserSettingsObject && message.id === userSettingsCMKey) {
           if (customMessageListener) {
             console.warn(
@@ -1138,7 +1135,7 @@
           }
           return;
         }
-        if (typeof customMessageListener === 'function') {
+        if (typeof customMessageListener === "function") {
           const microfrontend = LuigiElements.getMicrofrontends().find(mf =>
             IframeHelpers.isMessageSource(e, mf.container)
           );
@@ -1159,13 +1156,13 @@
        * Persist the answer of the init handshake
        * to prevent half-initialized clients
        */
-      if ('luigi.init.ok' === e.data.msg) {
+      if ("luigi.init.ok" === e.data.msg) {
         config.iframe.luigi.initOk = true;
       }
 
-      if ('luigi.navigate.ok' === e.data.msg) {
+      if ("luigi.navigate.ok" === e.data.msg) {
         iframe.luigi.viewUrl = iframe.luigi.nextViewUrl;
-        iframe.luigi.nextViewUrl = '';
+        iframe.luigi.nextViewUrl = "";
         iframe.luigi.clientPermissions = iframe.luigi.nextClientPermissions;
         delete iframe.luigi.nextClientPermissions;
         config.navigateOk = true;
@@ -1173,7 +1170,7 @@
         ViewGroupPreloading.preload();
       }
 
-      if ('luigi.get-context' === e.data.msg) {
+      if ("luigi.get-context" === e.data.msg) {
         config.iframe.luigi.clientVersion = e.data.clientVersion; // undefined for v0.x clients
         config.iframe.luigi.initOk = false; // get-context indication. used for handshake verification
 
@@ -1202,9 +1199,9 @@
               context: ctx,
               pathParams: specialIframeProps[typ.dataKey].pathParams,
               nodeParams: specialIframeProps[typ.dataKey].nodeParams,
-              modal: typ.iframeKey.startsWith('modal'),
-              drawer: typ.iframeKey.startsWith('drawer'),
-              splitView: typ.iframeKey.startsWith('splitView')
+              modal: typ.iframeKey.startsWith("modal"),
+              drawer: typ.iframeKey.startsWith("drawer"),
+              splitView: typ.iframeKey.startsWith("splitView")
             };
             await sendContextToClient(conf, {});
           });
@@ -1240,7 +1237,7 @@
           );
           if (userSettingsIframe) {
             let userSettingsGroupKey = userSettingsIframe.getAttribute(
-              'userSettingsGroup'
+              "userSettingsGroup"
             );
             let config = {
               context: {
@@ -1254,22 +1251,25 @@
         ViewGroupPreloading.viewGroupLoaded(iframe);
       }
 
-      if ('luigi.show-loading-indicator' === e.data.msg) {
+      if ("luigi.show-loading-indicator" === e.data.msg) {
         showLoadingIndicator = true;
       }
 
-      if ('luigi.hide-loading-indicator' === e.data.msg) {
+      if ("luigi.hide-loading-indicator" === e.data.msg) {
         showLoadingIndicator = false;
       }
 
-      if ('luigi.navigation.open' === e.data.msg) {
+      if ("luigi.navigation.open" === e.data.msg) {
         isNavigateBack = false;
         if (e.data.params.modal !== undefined) {
           let path = buildPath(e.data.params);
           path = GenericHelpers.addLeadingSlash(path);
           contentNode = node;
           resetMicrofrontendModalData();
-          openViewInModal(path, e.data.params.modal === true ? {} : e.data.params.modal);
+          openViewInModal(
+            path,
+            e.data.params.modal === true ? {} : e.data.params.modal
+          );
         } else if (e.data.params.splitView !== undefined) {
           let path = buildPath(e.data.params);
           path = GenericHelpers.addLeadingSlash(path);
@@ -1294,7 +1294,7 @@
         }
       }
 
-      if ('luigi.navigation.back' === e.data.msg) {
+      if ("luigi.navigation.back" === e.data.msg) {
         if (IframeHelpers.isMessageSource(e, modalIframe)) {
           closeModal();
           await sendContextToClient(config, {
@@ -1347,19 +1347,19 @@
         }
       }
 
-      if ('luigi.auth.tokenIssued' === e.data.msg) {
+      if ("luigi.auth.tokenIssued" === e.data.msg) {
         sendAuthDataToClient(e.data.authData);
       }
 
-      if ('luigi.navigation.pathExists' === e.data.msg) {
+      if ("luigi.navigation.pathExists" === e.data.msg) {
         const data = e.data.data;
         const path = buildPath(data);
         const pathData = await Navigation.getNavigationPath(
-          LuigiConfig.getConfigValueAsync('navigation.nodes'),
+          LuigiConfig.getConfigValueAsync("navigation.nodes"),
           path
         );
         const message = {
-          msg: 'luigi.navigation.pathExists.answer',
+          msg: "luigi.navigation.pathExists.answer",
           data: {
             correlationId: data.id,
             pathExists: pathData.isExistingRoute
@@ -1368,7 +1368,7 @@
         IframeHelpers.sendMessageToIframe(iframe, message);
       }
 
-      if ('luigi.set-page-dirty' === e.data.msg) {
+      if ("luigi.set-page-dirty" === e.data.msg) {
         if (!unsavedChanges.dirtySet) {
           const dirtySet = new Set();
           dirtySet.add(e.source);
@@ -1384,7 +1384,7 @@
         }
       }
 
-      if ('luigi.ux.confirmationModal.show' === e.data.msg) {
+      if ("luigi.ux.confirmationModal.show" === e.data.msg) {
         const settings = e.data.data.settings;
         contentNode = node;
         resetConfirmationModalData();
@@ -1393,7 +1393,7 @@
         });
       }
 
-      if ('luigi.ux.alert.show' === e.data.msg) {
+      if ("luigi.ux.alert.show" === e.data.msg) {
         const { settings } = e.data.data;
 
         if (!settings.text) {
@@ -1408,7 +1408,7 @@
         });
       }
 
-      if ('luigi.ux.set-current-locale' === e.data.msg) {
+      if ("luigi.ux.set-current-locale" === e.data.msg) {
         if (
           iframe.luigi.clientPermissions &&
           iframe.luigi.clientPermissions.changeCurrentLocale
@@ -1419,21 +1419,21 @@
           }
         } else {
           console.error(
-            'Current local change from client declined because client permission changeCurrentLocale is not set for this view.'
+            "Current local change from client declined because client permission changeCurrentLocale is not set for this view."
           );
         }
       }
       if (
         thirdPartyCookiesCheck &&
         !thirdPartyCookiesCheck.thirdPartyCookieScriptLocation &&
-        'luigi.third-party-cookie' === e.data.msg
+        "luigi.third-party-cookie" === e.data.msg
       ) {
-        if (e.data.tpc === 'disabled') {
+        if (e.data.tpc === "disabled") {
           tpcErrorHandling(thirdPartyCookiesCheck);
         }
       }
 
-      if ('storage' === e.data.msg) {
+      if ("storage" === e.data.msg) {
         let getValidMessageSource = IframeHelpers.getValidMessageSource(e);
         let microfrontendId = getValidMessageSource.luigi.id;
         StorageHelper.process(
@@ -1452,8 +1452,8 @@
     enableRouting(node, config);
   }
 
-  setContext('store', store);
-  setContext('getTranslation', getTranslation);
+  setContext("store", store);
+  setContext("getTranslation", getTranslation);
 
   const tpcErrorHandling = thirdpartycookiecheck => {
     if (
@@ -1470,11 +1470,11 @@
   export const pathExists = async path => {
     const data = {
       link: path,
-      relative: path[0] !== '/'
+      relative: path[0] !== "/"
     };
     const builtPath = buildPath(data);
     const pathData = await Navigation.getNavigationPath(
-      LuigiConfig.getConfigValueAsync('navigation.nodes'),
+      LuigiConfig.getConfigValueAsync("navigation.nodes"),
       builtPath
     );
     return pathData.isExistingRoute;
@@ -1486,13 +1486,13 @@
 
   onMount(() => {
     LuigiTheming._init();
-    searchProvider = LuigiConfig.getConfigValue('globalSearch.searchProvider');
+    searchProvider = LuigiConfig.getConfigValue("globalSearch.searchProvider");
     responsiveNavSetting = LuigiConfig.getConfigValue(
-      'settings.responsiveNavigation'
+      "settings.responsiveNavigation"
     );
     previousWindowWidth = window.innerWidth;
-    if (responsiveNavSetting === 'simple') {
-      document.body.classList.add('lui-simpleSlideInNav');
+    if (responsiveNavSetting === "simple") {
+      document.body.classList.add("lui-simpleSlideInNav");
       simpleSlideInNav = true;
       if (NavigationHelpers.getBurgerTooltipConfig()) {
         const [
@@ -1500,15 +1500,15 @@
           expandNavTooltip
         ] = NavigationHelpers.getBurgerTooltipConfig();
         if (collapseNavTooltip && expandNavTooltip) {
-          burgerTooltip = document.body.classList.contains('lui-leftNavToggle')
+          burgerTooltip = document.body.classList.contains("lui-leftNavToggle")
             ? collapseNavTooltip
             : expandNavTooltip;
         }
       }
-    } else if (responsiveNavSetting === 'simpleMobileOnly') {
-      document.body.classList.add('lui-simpleSlideInNav', 'lui-mobileOnly');
+    } else if (responsiveNavSetting === "simpleMobileOnly") {
+      document.body.classList.add("lui-simpleSlideInNav", "lui-mobileOnly");
       simpleSlideInNav = true;
-    } else if (responsiveNavSetting === 'semiCollapsible' || 'Fiori3') {
+    } else if (responsiveNavSetting === "semiCollapsible" || "Fiori3") {
       if (NavigationHelpers.getBurgerTooltipConfig()) {
         const [
           collapseNavTooltip,
@@ -1523,25 +1523,25 @@
             : expandNavTooltip;
         }
       }
-      document.body.classList.add('lui-semiCollapsible');
+      document.body.classList.add("lui-semiCollapsible");
     }
     thirdPartyCookiesCheck = LuigiConfig.getConfigValue(
-      'settings.thirdPartyCookieCheck'
+      "settings.thirdPartyCookieCheck"
     );
     if (
       thirdPartyCookiesCheck &&
       thirdPartyCookiesCheck.thirdPartyCookieScriptLocation
     ) {
       setTimeout(() => {
-        let thirdPartyCookieCheckIframe = document.createElement('iframe');
-        thirdPartyCookieCheckIframe.width = '0px';
-        thirdPartyCookieCheckIframe.height = '0px';
+        let thirdPartyCookieCheckIframe = document.createElement("iframe");
+        thirdPartyCookieCheckIframe.width = "0px";
+        thirdPartyCookieCheckIframe.height = "0px";
         thirdPartyCookieCheckIframe.src =
           thirdPartyCookiesCheck.thirdPartyCookieScriptLocation;
         document.body.appendChild(thirdPartyCookieCheckIframe);
         thirdPartyCookieCheckIframe.onload = function() {
           setTimeout(() => {
-            if (thirdPartyCookiesStatus() === 'disabled') {
+            if (thirdPartyCookiesStatus() === "disabled") {
               tpcErrorHandling(thirdPartyCookiesCheck);
             }
           });
@@ -1555,9 +1555,9 @@
 </script>
 
 <style type="text/scss">
-  @import 'styles/fonts';
-  @import 'styles/mixins';
-  @import 'styles/variables';
+  @import "styles/fonts";
+  @import "styles/mixins";
+  @import "styles/variables";
 
   /* needed to apply custom width of left side nav, by default 15rem as per FD Styles*/
   :root {
@@ -1585,7 +1585,7 @@
     box-sizing: inherit;
   }
   div :global(div) {
-    font-family: '72', sans-serif;
+    font-family: "72", sans-serif;
   }
 
   :global(a) {
@@ -1934,7 +1934,7 @@
       &:first-child {
         :global(.fd-menu__item) {
           &:first-child {
-            @include luigi-menu__link--border-radius('top');
+            @include luigi-menu__link--border-radius("top");
           }
         }
       }
@@ -1942,7 +1942,7 @@
       &:last-child {
         :global(.fd-menu__item) {
           &:last-child {
-            @include luigi-menu__link--border-radius('bottom');
+            @include luigi-menu__link--border-radius("bottom");
           }
         }
       }
diff --git a/core/src/Authorization.html b/core/src/Authorization.html
index c27caa4206..8102ab4115 100644
--- a/core/src/Authorization.html
+++ b/core/src/Authorization.html
@@ -1,4 +1,3 @@
-
 {#if !isHidden}
 <nav class="fd-menu">
   <ul class="fd-menu__list fd-menu__list--no-shadow">
@@ -9,10 +8,10 @@
         id="username"
         class="lui-username fd-has-type-1"
         data-testid="luigi-topnav-profile-username"
-      >{userInfo.name ? userInfo.name : userInfo.email}</span>
+        >{userInfo.name ? userInfo.name : userInfo.email}</span
+      >
     </li>
-    {/if}
-    {#each profileNav.items as profileItem}
+    {/if} {#each profileNav.items as profileItem}
     <li
       class="fd-menu__item"
       on:click="{() => onActionClick(profileItem)}"
@@ -24,26 +23,19 @@
         href="{getRouteLink(profileItem)}"
         on:click|preventDefault="{() => {}}"
       >
-        {#if profileItem.icon}
-        {#if hasOpenUIicon(profileItem)}
-        <span
-          class="fd-top-nav__icon sap-icon--{profileItem.icon}"
-        ></span>
+        {#if profileItem.icon} {#if hasOpenUIicon(profileItem)}
+        <span class="fd-top-nav__icon sap-icon--{profileItem.icon}"></span>
         {:else}
         <img
           class="fd-top-nav__icon nav-icon"
           src="{profileItem.icon}"
           alt="{profileItem.altText ? profileItem.altText : ''}"
-        >
-        {/if}
-        {/if}
-        <span
-          class="fd-menu__title"
-        >{$getTranslation(profileItem.label)}</span>
+        />
+        {/if} {/if}
+        <span class="fd-menu__title">{$getTranslation(profileItem.label)}</span>
       </a>
     </li>
-    {/each}
-    {#if hasUserSettings}
+    {/each} {#if hasUserSettings}
     <li
       class="fd-menu__item"
       on:click="{onUserSettingsClick}"
@@ -54,76 +46,65 @@
         class="fd-menu__link"
         data-testid="settings-link"
       >
-        {#if profileNav.settings.icon}
-        {#if hasOpenUIicon(profileNav.settings)}
-        <i
-          class="fd-top-nav__icon sap-icon--{profileNav.settings.icon}"
-        ></i>
+        {#if profileNav.settings.icon} {#if hasOpenUIicon(profileNav.settings)}
+        <i class="fd-top-nav__icon sap-icon--{profileNav.settings.icon}"></i>
         {:else}
         <img
           class="fd-top-nav__icon nav-icon"
           src="{profileNav.settings.icon}"
           alt="{profileNav.settings.altText ? profileNav.settings.altText : ''}"
+        />
+        {/if} {/if}
+        <span class="fd-menu__title"
+          >{$getTranslation(profileNav.settings.label)}</span
         >
-        {/if}
-        {/if}
-        <span
-          class="fd-menu__title"
-        >{$getTranslation(profileNav.settings.label)}</span>
       </a>
     </li>
-    {/if}
-    {#if isAuthorizationEnabled || isProfileLogoutItem}
-    {#if isLoggedIn || !isAuthorizationEnabled && isProfileLogoutItem}
+    {/if} {#if isAuthorizationEnabled || isProfileLogoutItem} {#if isLoggedIn ||
+    !isAuthorizationEnabled && isProfileLogoutItem}
     <li
       class="fd-menu__item"
       on:click="{onLogoutClick}"
       data-testid="{getTestId(profileNav.logout)}"
     >
       <a aria-label="Logout" class="fd-menu__link" data-testid="logout-link">
-        {#if profileNav.logout.icon}
-        {#if hasOpenUIicon(profileNav.logout)}
-        <i
-          class="fd-top-nav__icon sap-icon--{profileNav.logout.icon}"
-        ></i>
+        {#if profileNav.logout.icon} {#if hasOpenUIicon(profileNav.logout)}
+        <i class="fd-top-nav__icon sap-icon--{profileNav.logout.icon}"></i>
         {:else}
         <img
           class="fd-top-nav__icon nav-icon"
           src="{profileNav.logout.icon}"
           alt="{profileNav.logout.altText ? profileNav.logout.altText : ''}"
+        />
+        {/if} {/if}
+        <span class="fd-menu__title"
+          >{$getTranslation(profileNav.logout.label)}</span
         >
-        {/if}
-        {/if}
-        <span
-          class="fd-menu__title"
-        >{$getTranslation(profileNav.logout.label)}</span>
       </a>
     </li>
-    {/if}
-    {#if isAuthorizationEnabled && !isLoggedIn}
+    {/if} {#if isAuthorizationEnabled && !isLoggedIn}
     <li class="fd-menu__item" on:click="{startAuthorization}">
       <a aria-label="Login" class="fd-menu__link" data-testid="login-link">
         <span class="fd-menu__title">Login</span>
       </a>
     </li>
-    {/if}
-    {/if}
+    {/if} {/if}
   </ul>
 </nav>
 {/if}
 <script>
-  import { AuthLayerSvc } from './services';
-  import { createEventDispatcher, onMount, getContext } from 'svelte';
-  import { LuigiAuth, LuigiConfig, LuigiUX } from './core-api';
+  import { AuthLayerSvc } from "./services";
+  import { createEventDispatcher, onMount, getContext } from "svelte";
+  import { LuigiAuth, LuigiConfig, LuigiUX } from "./core-api";
   import {
     AuthHelpers,
     GenericHelpers,
     NavigationHelpers,
     StateHelpers,
     RoutingHelpers
-  } from './utilities/helpers';
-  import { AuthStoreSvc, Routing } from './services';
-  import { TOP_NAV_DEFAULTS } from './utilities/luigi-config-defaults';
+  } from "./utilities/helpers";
+  import { AuthStoreSvc, Routing } from "./services";
+  import { TOP_NAV_DEFAULTS } from "./utilities/luigi-config-defaults";
 
   const dispatch = createEventDispatcher();
 
@@ -138,12 +119,12 @@
   let hasUserSettings;
   let navProfileListenerInstalled;
   let profileLogoutFnDefined;
-  let store = getContext('store');
-  let getTranslation = getContext('getTranslation');
+  let store = getContext("store");
+  let getTranslation = getContext("getTranslation");
   let getUnsavedChangesModalPromise = getContext(
-    'getUnsavedChangesModalPromise'
+    "getUnsavedChangesModalPromise"
   );
-  let openViewInModal = getContext('openViewInModal');
+  let openViewInModal = getContext("openViewInModal");
 
   onMount(async () => {
     if (!LuigiAuth.isAuthorizationEnabled()) {
@@ -159,7 +140,7 @@
     });
     AuthLayerSvc.getUserInfoStore().subscribe(uInfo => {
       userInfo = uInfo;
-      dispatch('userInfoUpdated', userInfo);
+      dispatch("userInfoUpdated", userInfo);
     });
   });
 
@@ -188,32 +169,32 @@
         store,
         async () => {
           const logoutItem = await LuigiConfig.getConfigValueAsync(
-            'navigation.profile.logout'
+            "navigation.profile.logout"
           );
           //check if the User Settings schema exist
           const userSettingsConfig = await LuigiConfig.getConfigValueAsync(
-            'userSettings'
+            "userSettings"
           );
           const userSettings = userSettingsConfig
             ? userSettingsConfig
-            : await LuigiConfig.getConfigValueAsync('settings.userSettings');
+            : await LuigiConfig.getConfigValueAsync("settings.userSettings");
           hasUserSettings = Boolean(userSettings);
           //check if Settings dropdown is enabled for navigation in Shellbar
           const profileNavData = {
             items:
               (await LuigiConfig.getConfigValueAsync(
-                'navigation.profile.items'
+                "navigation.profile.items"
               )) || []
           };
           if (hasUserSettings) {
             const userSettingsProfileMenuEntry =
               userSettings.userSettingsProfileMenuEntry;
-            profileNavData['settings'] = {
+            profileNavData["settings"] = {
               ...TOP_NAV_DEFAULTS.userSettingsProfileMenuEntry,
               ...userSettingsProfileMenuEntry
             };
           }
-          profileNavData['logout'] = {
+          profileNavData["logout"] = {
             ...TOP_NAV_DEFAULTS.logout,
             ...logoutItem
           };
@@ -231,7 +212,7 @@
           }
           profileNav = profileNavData;
         },
-        ['navigation.profile']
+        ["navigation.profile"]
       );
       navProfileListenerInstalled = true;
     }
@@ -239,12 +220,12 @@
 
   export async function setProfileUserData() {
     const uInfo = await LuigiConfig.getConfigValueAsync(
-      'navigation.profile.staticUserInfoFn'
+      "navigation.profile.staticUserInfoFn"
     );
     if (uInfo) {
       AuthLayerSvc.setUserInfo(userInfo);
       userInfo = uInfo;
-      dispatch('userInfoUpdated', userInfo);
+      dispatch("userInfoUpdated", userInfo);
     }
   }
 
@@ -260,7 +241,7 @@
         Routing.navigateToLink(item);
       }
     });
-    dispatch('toggleDropdownState');
+    dispatch("toggleDropdownState");
   }
 
   export function onLogoutClick() {
@@ -272,14 +253,14 @@
         // TODO: PROFNAVLOGOUT: three smiliar implementations. profilen
         profileNav.logout.customLogoutFn();
       } else {
-        console.error('No IDP provider or profile.customLogoutFn is defined.');
+        console.error("No IDP provider or profile.customLogoutFn is defined.");
       }
     });
   }
 
   export function onUserSettingsClick() {
     LuigiUX.openUserSettings();
-    dispatch('toggleDropdownState');
+    dispatch("toggleDropdownState");
   }
 
   export function logout() {
diff --git a/core/src/Backdrop.html b/core/src/Backdrop.html
index 461e490d60..39e409ef81 100644
--- a/core/src/Backdrop.html
+++ b/core/src/Backdrop.html
@@ -1,15 +1,19 @@
-<div class="{backdropClass}" aria-hidden="false" style="{area === 'main' ? 'z-index: 0;' : ''}">
+<div
+  class="{backdropClass}"
+  aria-hidden="false"
+  style="{area === 'main' ? 'z-index: 0;' : ''}"
+>
   <slot></slot>
 </div>
 
 <script>
-  import { beforeUpdate, onMount, createEventDispatcher } from 'svelte';
-  import { LuigiConfig } from './core-api';
-  import { IframeHelpers, EventListenerHelpers } from './utilities/helpers';
+  import { beforeUpdate, onMount, createEventDispatcher } from "svelte";
+  import { LuigiConfig } from "./core-api";
+  import { IframeHelpers, EventListenerHelpers } from "./utilities/helpers";
 
   const dispatch = createEventDispatcher();
 
-  export let backdropClass = '';
+  export let backdropClass = "";
   export let backdropActive = false;
   let wasBackdropActive = false;
   let options = {};
@@ -17,13 +21,13 @@
   export let disable;
 
   const setBackdropClass = () => {
-    const baseClasses = 'lui-backdrop ';
+    const baseClasses = "lui-backdrop ";
     if (!backdropActive) {
-      backdropClass = '';
+      backdropClass = "";
     } else if (options.data && options.data.heightCssClass) {
       backdropClass = baseClasses + options.data.heightCssClass;
     } else {
-      backdropClass = baseClasses + 'height-auto';
+      backdropClass = baseClasses + "height-auto";
     }
   };
 
@@ -46,24 +50,24 @@
 
   onMount(() => {
     const backdropDisabled = LuigiConfig.getConfigValue(
-      'settings.backdropDisabled'
+      "settings.backdropDisabled"
     );
     if (!backdropDisabled) {
       setBackdropClass();
-      EventListenerHelpers.addEventListener('message', e => {
+      EventListenerHelpers.addEventListener("message", e => {
         if (!IframeHelpers.getValidMessageSource(e)) return;
         if (disable !== true) {
-          if ('luigi.add-backdrop' === e.data.msg) {
+          if ("luigi.add-backdrop" === e.data.msg) {
             if (isValidForArea(e)) {
               backdropActive = true;
             } else {
               backdropActive = false;
             }
-            dispatch('stateChanged', { backdropActive: true });
+            dispatch("stateChanged", { backdropActive: true });
           }
-          if ('luigi.remove-backdrop' === e.data.msg) {
+          if ("luigi.remove-backdrop" === e.data.msg) {
             backdropActive = false;
-            dispatch('stateChanged', { backdropActive: false });
+            dispatch("stateChanged", { backdropActive: false });
           }
         }
       });
@@ -91,4 +95,4 @@
     right: 0;
     z-index: 2;
   }
-</style>
\ No newline at end of file
+</style>
diff --git a/core/src/ConfirmationModal.html b/core/src/ConfirmationModal.html
index 575e61602c..cd88e0907e 100644
--- a/core/src/ConfirmationModal.html
+++ b/core/src/ConfirmationModal.html
@@ -1,4 +1,4 @@
-<svelte:window on:keydown="{handleKeydown}"/>
+<svelte:window on:keydown="{handleKeydown}" />
 <div
   class="fd-message-box-docs-static fd-message-box fd-message-box--{settings.type} fd-message-box--active"
   data-testid="luigi-confirmation-modal"
@@ -23,7 +23,9 @@ <h2 class="fd-title fd-title--h5">{settings.header}</h2>
             on:click="{() => dispatch('modalConfirm')}"
             data-testid="luigi-modal-confirm"
             class="fd-button fd-button--emphasized fd-button--compact fd-message-box__decisive-button confirm-button"
-          >{settings.buttonConfirm}</button>
+          >
+            {settings.buttonConfirm}
+          </button>
         </div>
         {/if}
         <div class="fd-bar__element">
@@ -31,7 +33,9 @@ <h2 class="fd-title fd-title--h5">{settings.header}</h2>
             on:click="{() => dispatch('modalDismiss')}"
             data-testid="luigi-modal-dismiss"
             class="fd-button {settings.buttonConfirm === false ? 'fd-button--emphasized' : 'fd-button--transparent'} fd-button--compact fd-message-box__decisive-button dismiss-button"
-          >{settings.buttonDismiss}</button>
+          >
+            {settings.buttonDismiss}
+          </button>
         </div>
       </div>
     </footer>
@@ -39,29 +43,29 @@ <h2 class="fd-title fd-title--h5">{settings.header}</h2>
 </div>
 
 <script>
-  import { createEventDispatcher, onMount } from 'svelte';
-  import { LuigiI18N } from './core-api';
-  import { KEYCODE_ESC } from './utilities/keycode.js';
-  import { EscapingHelpers } from './utilities/helpers';
+  import { createEventDispatcher, onMount } from "svelte";
+  import { LuigiI18N } from "./core-api";
+  import { KEYCODE_ESC } from "./utilities/keycode.js";
+  import { EscapingHelpers } from "./utilities/helpers";
 
   const dispatch = createEventDispatcher();
 
   export let settings;
   const iconMapping = {
-    confirmation: 'question-mark',
-    information: 'message-information',
-    warning: 'message-warning',
-    error: 'message-error',
-    success: 'message-success'
+    confirmation: "question-mark",
+    information: "message-information",
+    warning: "message-warning",
+    error: "message-error",
+    success: "message-success"
   };
 
   onMount(() => {
     const defaultSettings = {
       icon: iconMapping[settings.type],
-      header: LuigiI18N.getTranslation('luigi.confirmationModal.header'),
-      body: LuigiI18N.getTranslation('luigi.confirmationModal.body'),
-      buttonDismiss: LuigiI18N.getTranslation('luigi.button.dismiss'),
-      buttonConfirm: LuigiI18N.getTranslation('luigi.button.confirm')
+      header: LuigiI18N.getTranslation("luigi.confirmationModal.header"),
+      body: LuigiI18N.getTranslation("luigi.confirmationModal.body"),
+      buttonDismiss: LuigiI18N.getTranslation("luigi.button.dismiss"),
+      buttonConfirm: LuigiI18N.getTranslation("luigi.button.confirm")
     };
     settings = {
       ...settings,
@@ -70,8 +74,8 @@ <h2 class="fd-title fd-title--h5">{settings.header}</h2>
     settings = Object.assign(defaultSettings, settings);
 
     const focusedButton = settings.buttonConfirm
-      ? 'confirm-button'
-      : 'dismiss-button';
+      ? "confirm-button"
+      : "dismiss-button";
 
     try {
       document.querySelector(`.${focusedButton}`).focus();
@@ -84,13 +88,13 @@ <h2 class="fd-title fd-title--h5">{settings.header}</h2>
   // review these functions and remove unnecessary 'export' keywords
   export function handleKeydown(event) {
     if (event.keyCode === KEYCODE_ESC) {
-      dispatch('modalDismiss');
+      dispatch("modalDismiss");
     }
   }
 </script>
 
 <style type="text/scss">
-  @import 'styles/variables';
+  @import "styles/variables";
 
   .fd-message-box {
     &__body {
diff --git a/core/src/Modal.html b/core/src/Modal.html
index 663b9414b3..083e4c3259 100644
--- a/core/src/Modal.html
+++ b/core/src/Modal.html
@@ -1,4 +1,4 @@
-<svelte:window on:keydown="{handleKeydown}"/>
+<svelte:window on:keydown="{handleKeydown}" />
 <div
   class="{(isModal || (isDrawer && settings.backdrop))?'fd-dialog fd-dialog--active':'drawer-dialog'}"
   style="{isModal?'z-index:1001':''}"
@@ -60,26 +60,26 @@ <h3 class="fd-dialog__title">{settings.title}</h3>
 </div>
 
 <script>
-  import Backdrop from './Backdrop.html';
+  import Backdrop from "./Backdrop.html";
   import {
     afterUpdate,
     createEventDispatcher,
     onMount,
     onDestroy
-  } from 'svelte';
-  import { fade } from 'svelte/transition';
+  } from "svelte";
+  import { fade } from "svelte/transition";
   const dispatch = createEventDispatcher();
 
-  import { Navigation } from './navigation/services/navigation';
+  import { Navigation } from "./navigation/services/navigation";
   import {
     EventListenerHelpers,
     GenericHelpers,
     IframeHelpers,
     RoutingHelpers
-  } from './utilities/helpers';
-  import { LuigiConfig } from './core-api';
-  import { KEYCODE_ESC } from './utilities/keycode.js';
-  import { WebComponentService } from './services/web-components';
+  } from "./utilities/helpers";
+  import { LuigiConfig } from "./core-api";
+  import { KEYCODE_ESC } from "./utilities/keycode.js";
+  import { WebComponentService } from "./services/web-components";
 
   export let settings;
   export let isDataPrepared = false;
@@ -95,12 +95,12 @@ <h3 class="fd-dialog__title">{settings.title}</h3>
 
   const prepareNodeData = async path => {
     const pathUrlRaw =
-      path && path.length ? GenericHelpers.getPathWithoutHash(path) : '';
-    const params = RoutingHelpers.parseParams(pathUrlRaw.split('?')[1]);
+      path && path.length ? GenericHelpers.getPathWithoutHash(path) : "";
+    const params = RoutingHelpers.parseParams(pathUrlRaw.split("?")[1]);
     nodeParams = RoutingHelpers.getNodeParams(params);
     const dataFromPath = await Navigation.extractDataFromPath(path);
     nodeObject = dataFromPath.nodeObject;
-    isDrawer = settings.isDrawer || typeof nodeObject.drawer === 'object';
+    isDrawer = settings.isDrawer || typeof nodeObject.drawer === "object";
     if (isDrawer) {
       isModal = false;
       if (settings.header === undefined) {
@@ -111,10 +111,10 @@ <h3 class="fd-dialog__title">{settings.title}</h3>
       }
       if (settings.backdrop === undefined || !settings.backdrop) {
         settings.backdrop = false;
-        dispatch('drawerState', { activeDrawer: true });
+        dispatch("drawerState", { activeDrawer: true });
       }
       if (!settings.size) {
-        settings.size = 's';
+        settings.size = "s";
       }
     } else {
       if (!settings.title) {
@@ -137,12 +137,12 @@ <h3 class="fd-dialog__title">{settings.title}</h3>
         await setModalSize();
         WebComponentService.renderWebComponent(
           nodeObject.viewUrl,
-          document.querySelector('.iframeModalCtn'),
+          document.querySelector(".iframeModalCtn"),
           pathData.context,
           nodeObject
         );
-        dispatch('wcCreated', {
-          modalWC: document.querySelector('.iframeModalCtn'),
+        dispatch("wcCreated", {
+          modalWC: document.querySelector(".iframeModalCtn"),
           modalWCData: { ...pathData, nodeParams }
         });
         wcCreated = true;
@@ -155,7 +155,7 @@ <h3 class="fd-dialog__title">{settings.title}</h3>
           pathParams: pathData.pathParams,
           nodeParams
         });
-        dispatch('iframeCreated', {
+        dispatch("iframeCreated", {
           modalIframe: iframe,
           modalIframeData: { ...pathData, nodeParams }
         });
@@ -167,18 +167,18 @@ <h3 class="fd-dialog__title">{settings.title}</h3>
   };
 
   const setModalSize = async () => {
-    const elem = document.getElementsByClassName('lui-modal-mf');
-    let modalSize = '80%';
+    const elem = document.getElementsByClassName("lui-modal-mf");
+    let modalSize = "80%";
     if (settings.size) {
-      if (settings.size === 'l') {
-        modalSize = '80%';
-      } else if (settings.size === 'm') {
-        modalSize = '60%';
-      } else if (settings.size === 's') {
-        modalSize = '40%';
+      if (settings.size === "l") {
+        modalSize = "80%";
+      } else if (settings.size === "m") {
+        modalSize = "60%";
+      } else if (settings.size === "s") {
+        modalSize = "40%";
       }
     }
-    elem[0].setAttribute('style', `width:${modalSize};height:${modalSize}`);
+    elem[0].setAttribute("style", `width:${modalSize};height:${modalSize}`);
   };
 
   const createIframeModal = async (viewUrl, componentData) => {
@@ -195,34 +195,34 @@ <h3 class="fd-dialog__title">{settings.title}</h3>
       viewUrl,
       undefined,
       nodeObject,
-      'modal'
+      "modal"
     );
 
-    const iframeCtn = document.querySelector('.iframeModalCtn');
+    const iframeCtn = document.querySelector(".iframeModalCtn");
     iframeCtn.appendChild(iframe);
     return iframe;
   };
 
   async function setDrawerSize(elem) {
-    let styleSettings = '';
-    const elemDrawer = document.getElementsByClassName('drawer');
-    const drawerDialog = document.getElementsByClassName('drawer-dialog');
+    let styleSettings = "";
+    const elemDrawer = document.getElementsByClassName("drawer");
+    const drawerDialog = document.getElementsByClassName("drawer-dialog");
     if (settings.size) {
-      if (settings.size === 'l') {
+      if (settings.size === "l") {
         styleSettings = `width:75%;`;
-      } else if (settings.size === 'm') {
+      } else if (settings.size === "m") {
         styleSettings = `width:50%;`;
-      } else if (settings.size === 's') {
+      } else if (settings.size === "s") {
         styleSettings = `width:25%;`;
-      } else if (settings.size === 'xs') {
+      } else if (settings.size === "xs") {
         styleSettings = `width:15.5%;`;
       }
     }
     if (settings.backdrop) {
-      elemDrawer[0].setAttribute('style', styleSettings);
+      elemDrawer[0].setAttribute("style", styleSettings);
     } else {
-      drawerDialog[0].setAttribute('style', styleSettings);
-      elemDrawer[0].setAttribute('style', 'width:100%');
+      drawerDialog[0].setAttribute("style", styleSettings);
+      elemDrawer[0].setAttribute("style", "width:100%");
     }
   }
 
@@ -234,15 +234,15 @@ <h3 class="fd-dialog__title">{settings.title}</h3>
   });
 
   const onMessage = async e => {
-    if ('luigi.show-loading-indicator' === e.data.msg) {
+    if ("luigi.show-loading-indicator" === e.data.msg) {
       showLoadingIndicator = true;
     }
 
-    if ('luigi.hide-loading-indicator' === e.data.msg) {
+    if ("luigi.hide-loading-indicator" === e.data.msg) {
       showLoadingIndicator = false;
     }
 
-    if ('luigi.get-context' === e.data.msg) {
+    if ("luigi.get-context" === e.data.msg) {
       const loadingIndicatorAutoHideEnabled =
         !nodeObject ||
         !nodeObject.loadingIndicator ||
@@ -252,8 +252,8 @@ <h3 class="fd-dialog__title">{settings.title}</h3>
       }
     }
 
-    if ('luigi.close-modal' === e.data.msg) {
-      dispatch('close', { type: 'modal' });
+    if ("luigi.close-modal" === e.data.msg) {
+      dispatch("close", { type: "modal" });
     }
   };
 
@@ -269,24 +269,24 @@ <h3 class="fd-dialog__title">{settings.title}</h3>
   };
 
   onMount(() => {
-    EventListenerHelpers.addEventListener('message', onMessage);
+    EventListenerHelpers.addEventListener("message", onMessage);
   });
 
   onDestroy(() => {
-    EventListenerHelpers.removeEventListener('message', onMessage);
+    EventListenerHelpers.removeEventListener("message", onMessage);
   });
 
   // [svelte-upgrade suggestion]
   // review these functions and remove unnecessary 'export' keywords
   export function handleKeydown(event) {
     if (event.keyCode === KEYCODE_ESC) {
-      dispatch('close');
+      dispatch("close");
     }
   }
 </script>
 
 <style type="text/scss">
-  @import 'styles/variables';
+  @import "styles/variables";
   .drawer-dialog {
     position: absolute;
     top: $topNavHeight;
diff --git a/core/src/SplitView.html b/core/src/SplitView.html
index 94ed6f9b5a..796884422a 100644
--- a/core/src/SplitView.html
+++ b/core/src/SplitView.html
@@ -1,4 +1,4 @@
-<svelte:window on:resize="{updateSizes}"/>
+<svelte:window on:resize="{updateSizes}" />
 <div
   id="splitViewContainer"
   class="splitViewContainer {collapsed?'lui-collapsed':''}"
@@ -37,21 +37,21 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
 </div>
 {/if}
 <script>
-  import Backdrop from './Backdrop.html';
+  import Backdrop from "./Backdrop.html";
   import {
     afterUpdate,
     onDestroy,
     onMount,
     createEventDispatcher,
     getContext
-  } from 'svelte';
-  import { LuigiElements } from './core-api';
-  import { SplitViewSvc } from './services';
+  } from "svelte";
+  import { LuigiElements } from "./core-api";
+  import { SplitViewSvc } from "./services";
   import {
     EventListenerHelpers,
     GenericHelpers,
     IframeHelpers
-  } from './utilities/helpers';
+  } from "./utilities/helpers";
 
   const dispatch = createEventDispatcher();
 
@@ -76,7 +76,7 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
   export let disableBackdrop;
   let wasDataPrepared = false;
   let getUnsavedChangesModalPromise = getContext(
-    'getUnsavedChangesModalPromise'
+    "getUnsavedChangesModalPromise"
   );
 
   //TODO refactor
@@ -100,27 +100,27 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
       set: obj => {
         if (obj) {
           Object.getOwnPropertyNames(obj).forEach(prop => {
-            if (prop === 'splitViewSettings') {
+            if (prop === "splitViewSettings") {
               splitViewSettings = obj.splitViewSettings;
-            } else if (prop === 'lastNode') {
+            } else if (prop === "lastNode") {
               lastNode = obj.lastNode;
-            } else if (prop === 'pathData') {
+            } else if (prop === "pathData") {
               pathData = obj.pathData;
-            } else if (prop === 'nodeParams') {
+            } else if (prop === "nodeParams") {
               nodeParams = obj.nodeParams;
-            } else if (prop === 'collapsed') {
+            } else if (prop === "collapsed") {
               collapsed = obj.collapsed;
-            } else if (prop === 'isDataPrepared') {
+            } else if (prop === "isDataPrepared") {
               isDataPrepared = obj.isDataPrepared;
-            } else if (prop === 'currentNode') {
+            } else if (prop === "currentNode") {
               currentNode = obj.currentNode;
-            } else if (prop === 'splitViewIframe') {
+            } else if (prop === "splitViewIframe") {
               splitViewIframe = obj.splitViewIframe;
-            } else if (prop === 'splitViewIframeData') {
+            } else if (prop === "splitViewIframeData") {
               splitViewIframeData = obj.splitViewIframeData;
-            } else if (prop === 'splitViewWC') {
+            } else if (prop === "splitViewWC") {
               splitViewWC = obj.splitViewWC;
-            } else if (prop === 'splitViewWCData') {
+            } else if (prop === "splitViewWCData") {
               splitViewWCData = obj.splitViewWCData;
             }
           });
@@ -150,7 +150,7 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
   const setSplitViewSize = () => {
     const draggerBackdrop = SplitViewSvc.getDraggerBackdrop();
     if (draggerBackdrop) {
-      draggerBackdrop.style.display = 'none';
+      draggerBackdrop.style.display = "none";
     }
 
     updateElementSelectors();
@@ -169,16 +169,16 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
     // actions, like collapse, expand, setSize as well as register
     // event handlers: onCollapse, onExpand, onResize
 
-    if ('luigi.navigation.splitview.close' === e.data.msg) {
+    if ("luigi.navigation.splitview.close" === e.data.msg) {
       SplitViewSvc.close(getComponentWrapper());
     }
-    if ('luigi.navigation.splitview.collapse' === e.data.msg) {
+    if ("luigi.navigation.splitview.collapse" === e.data.msg) {
       collapse();
     }
-    if ('luigi.navigation.splitview.expand' === e.data.msg) {
+    if ("luigi.navigation.splitview.expand" === e.data.msg) {
       expand();
     }
-    if ('luigi.navigation.splitview.resize' === e.data.msg) {
+    if ("luigi.navigation.splitview.resize" === e.data.msg) {
       const percentBottom = parseInt(e.data.data);
       SplitViewSvc.calculateAndSetSplitViewValues(
         percentBottom,
@@ -191,7 +191,7 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
       }
       setSplitViewSize();
       SplitViewSvc.sendMessageToClients(
-        'resize.ok',
+        "resize.ok",
         SplitViewSvc.splitViewValues.percent
       );
     }
@@ -202,7 +202,7 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
     // bind(this) changes the signature, required to
     // be assigned to var in order to removeEventListener
     messageHandler = _messageHandler.bind(this);
-    EventListenerHelpers.addEventListener('message', messageHandler);
+    EventListenerHelpers.addEventListener("message", messageHandler);
   });
 
   // [svelte-upgrade warning]
@@ -217,7 +217,7 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
   });
 
   onDestroy(() => {
-    window.removeEventListener('message', messageHandler);
+    window.removeEventListener("message", messageHandler);
   });
 
   // [svelte-upgrade suggestion]
@@ -229,7 +229,7 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
   export async function expand() {
     await SplitViewSvc.expand(getComponentWrapper());
     if (elements.draggerBackdrop) {
-      elements.draggerBackdrop.style.display = 'none';
+      elements.draggerBackdrop.style.display = "none";
     }
   }
   export function updateSizes() {
@@ -255,7 +255,7 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
     const resize = function resize(re) {
       const diff = m_pos - re.y;
 
-      const dragTop = parseInt(getComputedStyle(elements.draggable, '').top);
+      const dragTop = parseInt(getComputedStyle(elements.draggable, "").top);
 
       if (isNaN(dragTop) || diff === 0) {
         // happens in collapsed state on mouse over draggable
@@ -284,7 +284,7 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
         !newValues.bottom ||
         newValues.top == SplitViewSvc.internalValues.m_pos_prev
       ) {
-        SplitViewSvc.getDraggerBackdrop().style.display = 'none';
+        SplitViewSvc.getDraggerBackdrop().style.display = "none";
         return;
       }
       SplitViewSvc.internalValues.m_pos_prev = newValues.top;
@@ -292,29 +292,29 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
 
       setSplitViewSize();
 
-      SplitViewSvc.sendMessageToClients('resize.ok', newValues.percent);
+      SplitViewSvc.sendMessageToClients("resize.ok", newValues.percent);
     };
 
     const clearListeners = function clearListeners() {
-      document.removeEventListener('mouseup', onMouseUp);
-      document.removeEventListener('mousemove', resize);
+      document.removeEventListener("mouseup", onMouseUp);
+      document.removeEventListener("mousemove", resize);
     };
     const addListeners = function resetListeners() {
-      document.addEventListener('mouseup', onMouseUp);
-      document.addEventListener('mousemove', resize);
+      document.addEventListener("mouseup", onMouseUp);
+      document.addEventListener("mousemove", resize);
     };
 
     updateElementSelectors();
     clearListeners();
     addListeners();
-    SplitViewSvc.getDraggerBackdrop().style.display = 'block';
+    SplitViewSvc.getDraggerBackdrop().style.display = "block";
   }
 
   const setDraggerVisibility = visible => {
     let dragger = SplitViewSvc.getDraggerButton();
-    if (dragger) dragger.style.display = visible ? 'block' : 'none';
+    if (dragger) dragger.style.display = visible ? "block" : "none";
     dragger = SplitViewSvc.getCollapsedDraggerButton();
-    if (dragger) dragger.style.display = visible ? 'block' : 'none';
+    if (dragger) dragger.style.display = visible ? "block" : "none";
   };
 
   const backdropStateChanged = event => {
@@ -323,7 +323,7 @@ <h1 class="fd-splitView__title">{splitViewSettings.title}</h1>
 </script>
 
 <style type="text/scss">
-  @import 'styles/variables';
+  @import "styles/variables";
 
   $collapsedSplitviewHeight: 38px;
   $colorNeutral4: #89919a;
diff --git a/core/src/TopNavDropDown.html b/core/src/TopNavDropDown.html
index 51c43f634b..4f1bbf1232 100644
--- a/core/src/TopNavDropDown.html
+++ b/core/src/TopNavDropDown.html
@@ -1,9 +1,8 @@
-<svelte:window on:resize="{setViewportHeightVariable}"/>
+<svelte:window on:resize="{setViewportHeightVariable}" />
 {#if !isMobile}
 <nav class="fd-menu">
   <ul class="fd-menu__list fd-menu__list--top fd-menu__list--no-shadow">
-    {#if children}
-    {#each children as node}
+    {#if children} {#each children as node}
     <li
       class="fd-menu__item"
       on:click="{() => onActionClick(node)}"
@@ -18,22 +17,17 @@
           class="fd-top-nav__icon {node.icon && hasOpenUIicon(node) ? 'sap-icon--' + node.icon : '' }"
         >
           {#if !hasOpenUIicon(node)}
-          <img
-            src="{node.icon}"
-            alt="{node.altText ? node.altText: ''}"
-          >
+          <img src="{node.icon}" alt="{node.altText ? node.altText: ''}" />
           {/if}
-          <BadgeCounter {node}/>
+          <BadgeCounter {node} />
         </span>
         <span class="fd-menu__title">{getNodeLabel(node)}</span>
       </a>
     </li>
-    {/each}
-    {/if}
+    {/each} {/if}
   </ul>
 </nav>
-{/if}
-{#if isMobile}
+{/if} {#if isMobile}
 <MobileTopNav
   on:click="{closeSubNav}"
   on:listClick="{onActionClickExternal}"
@@ -47,19 +41,19 @@
 />
 {/if}
 <script>
-  import BadgeCounter from './navigation/BadgeCounter.html';
-  import MobileTopNav from './navigation/MobileTopNavDropDown.html';
+  import BadgeCounter from "./navigation/BadgeCounter.html";
+  import MobileTopNav from "./navigation/MobileTopNavDropDown.html";
   import {
     beforeUpdate,
     createEventDispatcher,
     onMount,
     getContext
-  } from 'svelte';
-  import { Routing } from './services/routing';
-  import { Navigation } from './navigation/services/navigation';
-  import { NavigationHelpers } from './utilities/helpers';
-  import { RoutingHelpers } from './utilities/helpers';
-  import { LuigiI18N } from './core-api';
+  } from "svelte";
+  import { Routing } from "./services/routing";
+  import { Navigation } from "./navigation/services/navigation";
+  import { NavigationHelpers } from "./utilities/helpers";
+  import { RoutingHelpers } from "./utilities/helpers";
+  import { LuigiI18N } from "./core-api";
 
   const dispatch = createEventDispatcher();
 
@@ -68,9 +62,9 @@
   export let node;
   let pathParams;
   let getUnsavedChangesModalPromise = getContext(
-    'getUnsavedChangesModalPromise'
+    "getUnsavedChangesModalPromise"
   );
-  let openViewInModal = getContext('openViewInModal');
+  let openViewInModal = getContext("openViewInModal");
   const getNodeSubtitle = () => {};
 
   //TODO refactor
@@ -122,14 +116,14 @@
   }
 
   export function closeSubNav() {
-    dispatch('close');
+    dispatch("close");
   }
 
   export function setViewportHeightVariable() {
     // get the viewport height and multiple it by 1% to get a value for a vh unit
     let vh = window.innerHeight * 0.01;
     // set the value in the --vh custom property to the root of the document
-    document.documentElement.style.setProperty('--vh', `${vh}px`);
+    document.documentElement.style.setProperty("--vh", `${vh}px`);
   }
 
   function hasOpenUIicon(node) {
diff --git a/core/src/UserSettingsDialog.html b/core/src/UserSettingsDialog.html
index 3e3cdd5dd8..ac9cdc0982 100644
--- a/core/src/UserSettingsDialog.html
+++ b/core/src/UserSettingsDialog.html
@@ -5,21 +5,21 @@
     onDestroy,
     beforeUpdate,
     getContext
-  } from 'svelte';
+  } from "svelte";
   import {
     NavigationHelpers,
     GenericHelpers,
     EventListenerHelpers,
     IframeHelpers,
     UserSettingsHelper
-  } from './utilities/helpers';
-  import { MessagesListeners } from './services/messages-listeners';
-  import { ViewUrlDecorator } from './services/viewurl-decorator';
-  import UserSettingsEditor from './UserSettingsEditor.html';
-  import { CSS_BREAKPOINTS } from './utilities/constants';
-  import { LuigiConfig } from './core-api';
-  import { TOP_NAV_DEFAULTS } from './utilities/luigi-config-defaults';
-  import { KEYCODE_ESC } from './utilities/keycode.js';
+  } from "./utilities/helpers";
+  import { MessagesListeners } from "./services/messages-listeners";
+  import { ViewUrlDecorator } from "./services/viewurl-decorator";
+  import UserSettingsEditor from "./UserSettingsEditor.html";
+  import { CSS_BREAKPOINTS } from "./utilities/constants";
+  import { LuigiConfig } from "./core-api";
+  import { TOP_NAV_DEFAULTS } from "./utilities/luigi-config-defaults";
+  import { KEYCODE_ESC } from "./utilities/keycode.js";
   export let schemaObj;
   export let userSettingGroups;
 
@@ -29,7 +29,7 @@
   let userSettingsGroupKey;
   let displayEditor = false;
   let previousUserSettings = {};
-  let getTranslation = getContext('getTranslation');
+  let getTranslation = getContext("getTranslation");
   let dialogHeader = TOP_NAV_DEFAULTS.userSettingsDialog.dialogHeader;
   let saveBtn = TOP_NAV_DEFAULTS.userSettingsDialog.saveBtn;
   let dismissBtn = TOP_NAV_DEFAULTS.userSettingsDialog.dismissBtn;
@@ -40,11 +40,11 @@
 
   onMount(() => {
     const usLocalizationConfig = LuigiConfig.getConfigValue(
-      'userSettings.userSettingsDialog'
+      "userSettings.userSettingsDialog"
     );
     const usLocalization = usLocalizationConfig
       ? usLocalizationConfig
-      : LuigiConfig.getConfigValue('settings.userSettings.userSettingsDialog');
+      : LuigiConfig.getConfigValue("settings.userSettings.userSettingsDialog");
     if (usLocalization) {
       dialogHeader = usLocalization.dialogHeader
         ? usLocalization.dialogHeader
@@ -60,27 +60,27 @@
         ? Object.keys(userSettingGroups[0])[0]
         : undefined;
 
-    EventListenerHelpers.addEventListener('message', e => {
+    EventListenerHelpers.addEventListener("message", e => {
       const iframe = IframeHelpers.getValidMessageSource(e);
-      if (!iframe || 'custom' !== e.data.msg) return;
+      if (!iframe || "custom" !== e.data.msg) return;
       iframe._ready = true;
 
       const message = MessagesListeners.convertCustomMessageInternalToUser(
         e.data
       );
-      const userSettingsCMKey = 'luigi.updateUserSettings';
+      const userSettingsCMKey = "luigi.updateUserSettings";
       if (message.id === userSettingsCMKey) {
         const iframe = UserSettingsHelper.findActiveCustomUserSettingsIframe(
           e.source
         );
         if (iframe) {
-          let userSettingsGroupKey = iframe.getAttribute('userSettingsGroup');
+          let userSettingsGroupKey = iframe.getAttribute("userSettingsGroup");
           storedUserSettings[userSettingsGroupKey] = message.data;
         }
       }
 
       if (
-        message.id === 'luigi.navBackMobile' &&
+        message.id === "luigi.navBackMobile" &&
         window.window.innerWidth !== 0 &&
         window.innerWidth < CSS_BREAKPOINTS.desktopMinWidth
       ) {
@@ -111,7 +111,7 @@
           console.error(error.message);
         }
         if (error && error.closeDialog) {
-          dispatch('close');
+          dispatch("close");
         }
       });
   });
@@ -121,7 +121,7 @@
     userSettingGroups.forEach(userSettingGroup => {
       for (let key in userSettingGroup) {
         for (let i in userSettingGroup[key].settings) {
-          userSettingGroup[key].settings[i] = '';
+          userSettingGroup[key].settings[i] = "";
         }
         userSettingsObject[key] = {
           ...userSettingGroup[key].settings,
@@ -135,13 +135,13 @@
   function errorHandling(selectedUserSettingGroupData) {
     userSettingsGroupTitle = selectedUserSettingGroupData.title
       ? selectedUserSettingGroupData.title
-      : '';
+      : "";
     if (!GenericHelpers.isObject(selectedUserSettingGroupData.settings)) {
       return;
     }
     for (let key in selectedUserSettingGroupData.settings) {
       let property = selectedUserSettingGroupData.settings[key];
-      if (property.type === 'enum') {
+      if (property.type === "enum") {
         if (!Array.isArray(property.options)) {
           console.error(
             `There is no options array for '${key}' defined in the Luigi userSettings config.`
@@ -162,19 +162,19 @@
     errorHandling(selectedUserSettingGroupData);
     if (event) {
       document
-        .querySelectorAll('.lui-us-list .fd-nested-list__link')
+        .querySelectorAll(".lui-us-list .fd-nested-list__link")
         .forEach(elem => {
-          elem.classList.remove('is-selected');
+          elem.classList.remove("is-selected");
         });
-      const link = closest(event.target, '.fd-nested-list__link', 20);
-      link.classList.add('is-selected');
+      const link = closest(event.target, ".fd-nested-list__link", 20);
+      link.classList.add("is-selected");
       if (window.innerWidth < CSS_BREAKPOINTS.desktopMinWidth) {
         closeNavOnCategoryClickMobile();
       }
     } else {
       document
-        .querySelectorAll('.lui-us-list .fd-nested-list__link')[0]
-        .classList.add('is-selected');
+        .querySelectorAll(".lui-us-list .fd-nested-list__link")[0]
+        .classList.add("is-selected");
       if (
         window.innerWidth !== 0 &&
         window.innerWidth < CSS_BREAKPOINTS.desktopMinWidth
@@ -187,7 +187,7 @@
       if (customIframes.hasOwnProperty(selectedUserSettingGroupKey)) {
         UserSettingsHelper.getUserSettingsIframesInDom().forEach(iframe => {
           if (iframe.userSettingsGroup === selectedUserSettingGroupKey) {
-            iframe.style.display = 'block';
+            iframe.style.display = "block";
           }
         });
       } else {
@@ -210,13 +210,13 @@
   }
 
   function displayCustomEditor() {
-    document.querySelector('.iframeUserSettingsCtn').style.display = 'block';
-    document.querySelector('.usersettingseditor').style.display = 'none';
+    document.querySelector(".iframeUserSettingsCtn").style.display = "block";
+    document.querySelector(".usersettingseditor").style.display = "none";
   }
 
   function diplayUserSettingsEditor() {
-    document.querySelector('.iframeUserSettingsCtn').style.display = 'none';
-    document.querySelector('.usersettingseditor').style.display = 'block';
+    document.querySelector(".iframeUserSettingsCtn").style.display = "none";
+    document.querySelector(".usersettingseditor").style.display = "block";
   }
 
   const updateSettingsObject = event => {
@@ -226,14 +226,14 @@
   function storeUserSettings() {
     LuigiConfig.storeUserSettings(storedUserSettings, previousUserSettings)
       .then(() => {
-        dispatch('close');
+        dispatch("close");
       })
       .catch(error => {
         if (error && error.message) {
           console.error(error.message);
         }
         if (error && error.closeDialog) {
-          dispatch('close');
+          dispatch("close");
         }
       });
   }
@@ -259,17 +259,17 @@
   }
 
   function handleSaveBtnVisibility() {
-    if (document.querySelector('.usersettings-leftNavVisible')) {
-      document.querySelector('.confirm-button').style.display = 'block';
+    if (document.querySelector(".usersettings-leftNavVisible")) {
+      document.querySelector(".confirm-button").style.display = "block";
     } else {
-      document.querySelector('.confirm-button').style.display = 'none';
+      document.querySelector(".confirm-button").style.display = "none";
     }
   }
 
   function toggleNavMobile() {
     document
-      .querySelector('.lui-usersettings-dialog')
-      .classList.toggle('usersettings-leftNavVisible');
+      .querySelector(".lui-usersettings-dialog")
+      .classList.toggle("usersettings-leftNavVisible");
     if (
       window.innerWidth !== 0 &&
       window.innerWidth < CSS_BREAKPOINTS.desktopMinWidth
@@ -291,23 +291,23 @@
       previousWindowWidth >= CSS_BREAKPOINTS.desktopMinWidth;
     if (isDesktopToMobile) {
       document
-        .querySelector('.lui-usersettings-dialog')
-        .classList.toggle('usersettings-leftNavVisible');
-      if (!document.querySelector('.usersettings-leftNavVisible')) {
-        document.querySelector('.confirm-button').style.display = 'none';
+        .querySelector(".lui-usersettings-dialog")
+        .classList.toggle("usersettings-leftNavVisible");
+      if (!document.querySelector(".usersettings-leftNavVisible")) {
+        document.querySelector(".confirm-button").style.display = "none";
       } else {
-        document.querySelector('.confirm-button').style.display = 'block';
+        document.querySelector(".confirm-button").style.display = "block";
       }
     }
     if (isMobileToDesktop) {
-      document.querySelector('.confirm-button').style.display = 'block';
+      document.querySelector(".confirm-button").style.display = "block";
     }
 
     if (!previousWindowWidth) {
-      let confirmbtn = document.querySelector('.confirm-button');
+      let confirmbtn = document.querySelector(".confirm-button");
       window.innerWidth < CSS_BREAKPOINTS.desktopMinWidth
-        ? (confirmbtn.style.display = 'none')
-        : (confirmbtn.style.display = 'block');
+        ? (confirmbtn.style.display = "none")
+        : (confirmbtn.style.display = "block");
     }
 
     previousWindowWidth = window.innerWidth;
@@ -315,7 +315,7 @@
 
   export function handleKeydown(event) {
     if (event.keyCode === KEYCODE_ESC) {
-      dispatch('close');
+      dispatch("close");
     }
   }
 </script>
@@ -553,60 +553,57 @@
     }
   }
 </style>
-<svelte:window on:keydown="{handleKeydown}" on:resize="{onResize}"/>
+<svelte:window on:keydown="{handleKeydown}" on:resize="{onResize}" />
 <div class="fd-dialog fd-dialog--active lui-usersettings-dialog">
   <div class="fd-dialog__content lui-usersettings-dialog-size">
     <div class="fd-dialog__body lui-usersettings-body">
       <div class="lui-usersettings-left-nav">
         <div class="fd-side-nav">
           <div class="fd-side-nav__group-header">
-            <h2 class="fd-title fd-title--h5">{$getTranslation(dialogHeader)}</h2>
+            <h2 class="fd-title fd-title--h5">
+              {$getTranslation(dialogHeader)}
+            </h2>
           </div>
           <div
             class="fd-side-nav__main-navigation lui-fd-side-nav__main-navigation"
           >
             <ul class="fd-nested-list lui-us-list">
-              {#each Object.entries(userSettingGroups) as [key, userSettingGroup], index}
-              {#each Object.entries(userSettingGroup) as userSettingsGroupProperty}
+              {#each Object.entries(userSettingGroups) as [key,
+              userSettingGroup], index} {#each Object.entries(userSettingGroup)
+              as userSettingsGroupProperty}
               <li class="fd-nested-list__item">
                 <a
                   class="fd-nested-list__link"
                   on:click|preventDefault="{() => openEditor(userSettingsGroupProperty, event)}"
                 >
                   <div class="lui-usersettings-list-item__info-container">
-                    {#if userSettingsGroupProperty[1].icon}
-                    {#if hasOpenUIicon(userSettingsGroupProperty[1])}
+                    {#if userSettingsGroupProperty[1].icon} {#if
+                    hasOpenUIicon(userSettingsGroupProperty[1])}
                     <i
                       class="fd-nested-list__icon sap-icon sap-icon--{userSettingsGroupProperty[1].icon}"
                     ></i>
                     {:else}
-                    <span
-                      class="fd-nested-list__icon sap-icon"
-                    >
+                    <span class="fd-nested-list__icon sap-icon">
                       <img
                         src="{userSettingsGroupProperty[1].icon}"
                         alt="{userSettingsGroupProperty[1].altText ? userSettingsGroupProperty[1].altText : ''}"
-                      >
+                      />
                     </span>
-                    {/if}
-                    {:else}
-                    <i
-                      class="fd-nested-list__icon sap-icon"
-                    ></i>
+                    {/if} {:else}
+                    <i class="fd-nested-list__icon sap-icon"></i>
                     {/if}
                     <div class="lui-usersettings-list-item__title-container">
-                      <span
-                        class="lui-usersettings-list-item__title"
-                      >{$getTranslation(userSettingsGroupProperty[1].label?userSettingsGroupProperty[1].label:'')}</span>
-                      <span
-                        class="lui-usersettings-list-item__subtitle"
-                      >{$getTranslation(userSettingsGroupProperty[1].sublabel?userSettingsGroupProperty[1].sublabel:'')}</span>
+                      <span class="lui-usersettings-list-item__title"
+                        >{$getTranslation(userSettingsGroupProperty[1].label?userSettingsGroupProperty[1].label:'')}</span
+                      >
+                      <span class="lui-usersettings-list-item__subtitle"
+                        >{$getTranslation(userSettingsGroupProperty[1].sublabel?userSettingsGroupProperty[1].sublabel:'')}</span
+                      >
                     </div>
                   </div>
                 </a>
               </li>
-              {/each}
-              {/each}
+              {/each} {/each}
             </ul>
           </div>
         </div>
@@ -618,9 +615,9 @@ <h2 class="fd-title fd-title--h5">{$getTranslation(dialogHeader)}</h2>
         >
           <i class="sap-icon--navigation-left-arrow"></i>
         </button>
-        <h2
-          class="fd-title fd-title--h5"
-        >{$getTranslation(userSettingsGroupTitle)}</h2>
+        <h2 class="fd-title fd-title--h5">
+          {$getTranslation(userSettingsGroupTitle)}
+        </h2>
       </div>
 
       <div class="lui-usersettings-content">
@@ -643,14 +640,18 @@ <h2 class="fd-title fd-title--h5">{$getTranslation(dialogHeader)}</h2>
             on:click="{() => storeUserSettings()}"
             data-testid="lui-us-saveBtn"
             class="fd-dialog__decisive-button fd-button fd-button--emphasized fd-button--compact confirm-button"
-          >{$getTranslation(saveBtn)}</button>
+          >
+            {$getTranslation(saveBtn)}
+          </button>
         </div>
         <div class="fd-bar__element">
           <button
             on:click="{() => dispatch('close')}"
             data-testid="lui-us-dismissBtn"
             class="fd-dialog__decisive-button fd-button fd-button--transparent fd-button--compact"
-          >{$getTranslation(dismissBtn)}</button>
+          >
+            {$getTranslation(dismissBtn)}
+          </button>
         </div>
       </div>
     </footer>
diff --git a/core/src/UserSettingsEditor.html b/core/src/UserSettingsEditor.html
index f7d0f1e3c5..8e0eab44be 100644
--- a/core/src/UserSettingsEditor.html
+++ b/core/src/UserSettingsEditor.html
@@ -1,4 +1,7 @@
-<svelte:window on:click="{closeAllCombos}" on:blur="{closeAllCombos}"></svelte:window>
+<svelte:window
+  on:click="{closeAllCombos}"
+  on:blur="{closeAllCombos}"
+></svelte:window>
 <script>
   import {
     onMount,
@@ -6,23 +9,23 @@
     beforeUpdate,
     createEventDispatcher,
     getContext
-  } from 'svelte';
-  import { GenericHelpers } from './utilities/helpers';
+  } from "svelte";
+  import { GenericHelpers } from "./utilities/helpers";
   export let userSettingGroup;
   export let userSettingsGroupKey;
   export let storedUserSettingData;
   const dispatch = createEventDispatcher();
   let settingsSchema;
   let displayOptions;
-  let getTranslation = getContext('getTranslation');
+  let getTranslation = getContext("getTranslation");
 
   export function updateSettingsObject() {
-    dispatch('updateSettingsObject', { storedUserSettingData });
+    dispatch("updateSettingsObject", { storedUserSettingData });
   }
 
   function closeAllCombos(self) {
     document
-      .querySelectorAll('.lui-usersettings-content .fd-popover__control')
+      .querySelectorAll(".lui-usersettings-content .fd-popover__control")
       .forEach(elem => {
         setExpandedState(elem, false);
       });
@@ -46,19 +49,19 @@
 
   function toggleOptions(event, editable) {
     if (editable || editable === undefined) {
-      const self = closest(event.target, '.fd-popover__control', 20);
+      const self = closest(event.target, ".fd-popover__control", 20);
       closeAllCombos(self);
-      const currentState = self.getAttribute('aria-expanded') === 'true';
+      const currentState = self.getAttribute("aria-expanded") === "true";
       setExpandedState(self, !currentState);
     }
   }
 
   function setExpandedState(self, value) {
-    const indicatorBtn = self.querySelector('.fd-input-group__button');
-    const optionsPopOver = self.parentNode.querySelector('.fd-popover__body');
-    self.setAttribute('aria-expanded', value);
-    optionsPopOver.setAttribute('aria-hidden', !value);
-    indicatorBtn.setAttribute('aria-expanded', value);
+    const indicatorBtn = self.querySelector(".fd-input-group__button");
+    const optionsPopOver = self.parentNode.querySelector(".fd-popover__body");
+    self.setAttribute("aria-expanded", value);
+    optionsPopOver.setAttribute("aria-hidden", !value);
+    indicatorBtn.setAttribute("aria-expanded", value);
   }
 
   function updateComboBox(key, option) {
@@ -67,13 +70,13 @@
 
   function updateEnumButton(key, option) {
     document
-      .querySelectorAll('.enum-buttons-container-' + key + ' button')
+      .querySelectorAll(".enum-buttons-container-" + key + " button")
       .forEach(button => {
-        const buttonId = button.getAttribute('id');
+        const buttonId = button.getAttribute("id");
         const optionId = `lui-us-enum_button_${key}_option`;
         buttonId === optionId
-          ? button.classList.add('fd-button--emphasized')
-          : button.classList.remove('fd-button--emphasized');
+          ? button.classList.add("fd-button--emphasized")
+          : button.classList.remove("fd-button--emphasized");
       });
 
     storedUserSettingData[userSettingGroup[0]][key] = option;
@@ -94,7 +97,7 @@
     position: relative;
   }
 
-  .lui-value-container > input[type='checkbox'] {
+  .lui-value-container > input[type="checkbox"] {
     margin-top: 13px;
   }
 
@@ -127,8 +130,8 @@
     line-height: var(--sapContent_LineHeight, 1.4);
     font-family: var(
       --sapFontFamily,
-      '72',
-      '72full',
+      "72",
+      "72full",
       Arial,
       Helvetica,
       sans-serif
@@ -155,20 +158,23 @@
 <div class="lui-usersettings-content">
   {#if userSettingGroup && userSettingGroup[0] && userSettingGroup[1]}
   <div class="lui-us-content-header-container">
-    <h1
-      class="lui-title lui-title--h2"
-    >{userSettingGroup[1].title?$getTranslation(userSettingGroup[1].title):''}</h1>
+    <h1 class="lui-title lui-title--h2">
+      {userSettingGroup[1].title?$getTranslation(userSettingGroup[1].title):''}
+    </h1>
   </div>
   {#if userSettingGroup[1].settings}
   <div class="fd-page__content">
     <div class="fd-container lui-form-grid">
-      {#each Object.entries(userSettingGroup[1].settings) as [key, schemaItem], i}
+      {#each Object.entries(userSettingGroup[1].settings) as [key, schemaItem],
+      i}
       <div class="lui-form-label">
-        <label class="fd-form-label">{$getTranslation(schemaItem.label)}:</label>
+        <label class="fd-form-label"
+          >{$getTranslation(schemaItem.label)}:</label
+        >
       </div>
       <div class="lui-value-container">
-        {#if schemaItem.type==='string'}
-        {#if schemaItem.isEditable || schemaItem.isEditable === undefined}
+        {#if schemaItem.type==='string'} {#if schemaItem.isEditable ||
+        schemaItem.isEditable === undefined}
         <input
           class="fd-input"
           type="text"
@@ -177,15 +183,13 @@
           data-testid="lui-us-input{i}"
           bind:value="{storedUserSettingData[userSettingGroup[0]][key]}"
           disabled="{schemaItem.isEditable===undefined || schemaItem.isEditable?false:true}"
-        >
+        />
         {:else}
-        <label
-          class="lui-form-text"
-          data-testid="lui-us-input{i}"
-        >{storedUserSettingData[userSettingGroup[0]][key]}</label>
-        {/if}
-        {/if}
-        {#if schemaItem.type==='enum' && (schemaItem.style === undefined || schemaItem.style === 'list')}
+        <label class="lui-form-text" data-testid="lui-us-input{i}"
+          >{storedUserSettingData[userSettingGroup[0]][key]}</label
+        >
+        {/if} {/if} {#if schemaItem.type==='enum' && (schemaItem.style ===
+        undefined || schemaItem.style === 'list')}
         <div>
           <div class="fd-form-item">
             <div class="fd-popover">
@@ -202,7 +206,7 @@
                     placeholder="{$getTranslation(storedUserSettingData[userSettingGroup[0]][key])}"
                     data-testid="lui-us-input{i}"
                     disabled="{schemaItem.isEditable===undefined || schemaItem.isEditable?false:true}"
-                  >
+                  />
                   <span
                     class="fd-input-group__addon fd-input-group__addon--button"
                   >
@@ -234,7 +238,9 @@
                       on:click="{() => updateComboBox(key,option)}"
                     >
                       <span class="fd-list__title">
-                        <span class="fd-list__bold">{$getTranslation(option)}</span>
+                        <span class="fd-list__bold"
+                          >{$getTranslation(option)}</span
+                        >
                       </span>
                     </li>
                     {/each}
@@ -245,8 +251,8 @@
             </div>
           </div>
         </div>
-        {/if}
-        {#if schemaItem.type==='enum' && schemaItem.style === 'button' && Array.isArray(schemaItem.options)}
+        {/if} {#if schemaItem.type==='enum' && schemaItem.style === 'button' &&
+        Array.isArray(schemaItem.options)}
         <div>
           <div class="fd-form-item">
             <div
@@ -261,13 +267,15 @@
                 id="lui-us-enum_button_{key}_{option}"
                 data-testid="lui-us-enum_button_{key}_{option}"
                 disabled="{schemaItem.isEditable===undefined || schemaItem.isEditable?false:true}"
-              >{$getTranslation(option)}</button>
+              >
+                {$getTranslation(option)}
+              </button>
               {/each}
             </div>
           </div>
         </div>
-        {/if}
-        {#if schemaItem.type==='boolean' && (!schemaItem.style || schemaItem.style === 'switch')}
+        {/if} {#if schemaItem.type==='boolean' && (!schemaItem.style ||
+        schemaItem.style === 'switch')}
         <label
           class="fd-switch fd-switch--compact"
           data-testid="lui-us-label-switch_{key}"
@@ -280,7 +288,7 @@
               data-testid="lui-us-checkbox-switch_{key}"
               disabled="{schemaItem.isEditable===undefined || schemaItem.isEditable?false:true}"
               bind:checked="{storedUserSettingData[userSettingGroup[0]][key]}"
-            >
+            />
             <div class="fd-switch__slider">
               <div class="fd-switch__track">
                 <span class="fd-switch__handle" role="presentation"></span>
@@ -288,19 +296,18 @@
             </div>
           </span>
         </label>
-        {/if}
-        {#if schemaItem.type==='boolean' && schemaItem.style === 'checkbox'}
+        {/if} {#if schemaItem.type==='boolean' && schemaItem.style ===
+        'checkbox'}
         <input
           type="checkbox"
           class="fd-checkbox"
           disabled="{schemaItem.isEditable===undefined || schemaItem.isEditable?false:true}"
           bind:checked="{storedUserSettingData[userSettingGroup[0]][key]}"
-        >
+        />
         {/if}
       </div>
       {/each}
     </div>
   </div>
-  {/if}
-  {/if}
+  {/if} {/if}
 </div>
diff --git a/core/src/core-api/auth.js b/core/src/core-api/auth.js
index dd81ac26d8..a848e25ec0 100644
--- a/core/src/core-api/auth.js
+++ b/core/src/core-api/auth.js
@@ -60,12 +60,7 @@ class LuigiAuth {
    * @param {AuthData} data
    * @param {string} redirectUrl
    */
-  async handleAuthEvent(
-    eventName,
-    providerInstanceSettings,
-    data,
-    redirectUrl
-  ) {
+  async handleAuthEvent(eventName, providerInstanceSettings, data, redirectUrl) {
     const result = await LuigiConfig.executeConfigFnAsync(
       'auth.events.' + eventName,
       false,
diff --git a/core/src/core-api/config.js b/core/src/core-api/config.js
index 79338c246f..3c1d192afd 100644
--- a/core/src/core-api/config.js
+++ b/core/src/core-api/config.js
@@ -1,9 +1,4 @@
-import {
-  AsyncHelpers,
-  EventListenerHelpers,
-  GenericHelpers,
-  StateHelpers
-} from '../utilities/helpers';
+import { AsyncHelpers, EventListenerHelpers, GenericHelpers, StateHelpers } from '../utilities/helpers';
 import { LuigiAuth, LuigiElements } from '.';
 import { AuthLayerSvc, LifecycleHooks } from '../services';
 /**
@@ -121,10 +116,7 @@ class LuigiConfig {
 
     var errorDiv = document.createElement('div');
     errorDiv.setAttribute('class', 'fd-message-strip fd-message-strip--error');
-    errorDiv.setAttribute(
-      'style',
-      'max-width: 800px; display: inline-block; margin-top: 40px;'
-    );
+    errorDiv.setAttribute('style', 'max-width: 800px; display: inline-block; margin-top: 40px;');
     errorDiv.appendChild(errorTextNode);
 
     fd_ui.appendChild(errorDiv);
@@ -152,10 +144,7 @@ class LuigiConfig {
    * Luigi.getConfigBooleanValue('settings.hideNavigation')
    */
   getConfigBooleanValue(property) {
-    const configuredValue = GenericHelpers.getConfigValueFromObject(
-      this.getConfig(),
-      property
-    );
+    const configuredValue = GenericHelpers.getConfigValueFromObject(this.getConfig(), property);
     if (configuredValue === true || configuredValue === 'true') {
       return true;
     }
@@ -175,11 +164,7 @@ class LuigiConfig {
    * Luigi.getConfigValueAsync('navigation.contextSwitcher.options')
    */
   getConfigValueAsync(property, ...parameters) {
-    return AsyncHelpers.getConfigValueFromObjectAsync(
-      this.getConfig(),
-      property,
-      parameters
-    );
+    return AsyncHelpers.getConfigValueFromObjectAsync(this.getConfig(), property, parameters);
   }
 
   /**
@@ -249,10 +234,7 @@ class LuigiConfig {
     const userSettings = userSettingsConfig
       ? userSettingsConfig
       : await this.getConfigValueAsync('settings.userSettings');
-    if (
-      userSettings &&
-      GenericHelpers.isFunction(userSettings.readUserSettings)
-    ) {
+    if (userSettings && GenericHelpers.isFunction(userSettings.readUserSettings)) {
       return userSettings.readUserSettings();
     }
     const localStorageValue = localStorage.getItem(this.USER_SETTINGS_KEY);
@@ -277,19 +259,10 @@ class LuigiConfig {
     const userSettings = userSettingsConfig
       ? userSettingsConfig
       : await this.getConfigValueAsync('settings.userSettings');
-    if (
-      userSettings &&
-      GenericHelpers.isFunction(userSettings.storeUserSettings)
-    ) {
-      return userSettings.storeUserSettings(
-        userSettingsObj,
-        previousUserSettingsObj
-      );
+    if (userSettings && GenericHelpers.isFunction(userSettings.storeUserSettings)) {
+      return userSettings.storeUserSettings(userSettingsObj, previousUserSettingsObj);
     } else {
-      localStorage.setItem(
-        this.USER_SETTINGS_KEY,
-        JSON.stringify(userSettingsObj)
-      );
+      localStorage.setItem(this.USER_SETTINGS_KEY, JSON.stringify(userSettingsObj));
     }
     this.configChanged();
   }
diff --git a/core/src/core-api/custom-messages.js b/core/src/core-api/custom-messages.js
index 6d47e3a883..ca4908d689 100644
--- a/core/src/core-api/custom-messages.js
+++ b/core/src/core-api/custom-messages.js
@@ -21,14 +21,10 @@ class CustomMessagesManager {
    * @since 0.6.2
    */
   sendToAll(message) {
-    const internalMessage = MessagesListeners.convertCustomMessageUserToInternal(
-      message
-    );
+    const internalMessage = MessagesListeners.convertCustomMessageUserToInternal(message);
     IframeHelpers.getMicrofrontendsInDom()
       .map(microfrontendObj => microfrontendObj.container)
-      .map(mfContainer =>
-        IframeHelpers.sendMessageToIframe(mfContainer, internalMessage)
-      );
+      .map(mfContainer => IframeHelpers.sendMessageToIframe(mfContainer, internalMessage));
   }
 
   /**
@@ -48,15 +44,11 @@ class CustomMessagesManager {
    * @since 0.6.2
    */
   send(microfrontendId, message) {
-    const internalMessage = MessagesListeners.convertCustomMessageUserToInternal(
-      message
-    );
+    const internalMessage = MessagesListeners.convertCustomMessageUserToInternal(message);
     IframeHelpers.getMicrofrontendsInDom()
       .filter(microfrontendObj => microfrontendObj.id === microfrontendId)
       .map(microfrontendObj => microfrontendObj.container)
-      .map(mfContainer =>
-        IframeHelpers.sendMessageToIframe(mfContainer, internalMessage)
-      );
+      .map(mfContainer => IframeHelpers.sendMessageToIframe(mfContainer, internalMessage));
   }
 }
 
diff --git a/core/src/core-api/i18n.js b/core/src/core-api/i18n.js
index efb598eb71..e5e73865b2 100644
--- a/core/src/core-api/i18n.js
+++ b/core/src/core-api/i18n.js
@@ -1,9 +1,5 @@
 import { config } from './config';
-import {
-  GenericHelpers,
-  StateHelpers,
-  EscapingHelpers
-} from '../utilities/helpers';
+import { GenericHelpers, StateHelpers, EscapingHelpers } from '../utilities/helpers';
 import { defaultLuigiTranslationTable } from '../utilities/defaultLuigiTranslationTable';
 
 /**
@@ -35,9 +31,7 @@ class LuigiI18NManager {
    * @memberof LuigiI18N
    */
   getCurrentLocale() {
-    return (
-      sessionStorage.getItem(this.currentLocaleStorageKey) || this.defaultLocale
-    );
+    return sessionStorage.getItem(this.currentLocaleStorageKey) || this.defaultLocale;
   }
 
   /**
@@ -80,9 +74,7 @@ class LuigiI18NManager {
     if (listenerId && this.listeners[listenerId]) {
       delete this.listeners[listenerId];
     } else {
-      console.error(
-        'Unable to remove locale change listener - no listener registered for given ID.'
-      );
+      console.error('Unable to remove locale change listener - no listener registered for given ID.');
     }
   }
 
@@ -102,9 +94,7 @@ class LuigiI18NManager {
    * @memberof LuigiI18N
    */
   _initCustomImplementation() {
-    this.translationImpl = config.getConfigValue(
-      'settings.customTranslationImplementation'
-    );
+    this.translationImpl = config.getConfigValue('settings.customTranslationImplementation');
     if (GenericHelpers.isFunction(this.translationImpl)) {
       this.translationImpl = this.translationImpl();
     }
@@ -127,20 +117,12 @@ class LuigiI18NManager {
   getTranslation(key, interpolations = undefined, locale = undefined) {
     if (!key) return '';
     if (this.translationImpl) {
-      const result = this.translationImpl.getTranslation(
-        key,
-        interpolations,
-        locale
-      );
+      const result = this.translationImpl.getTranslation(key, interpolations, locale);
       if (result !== key) {
         return result;
       }
     }
-    const findTranslation = this.findTranslation(
-      key,
-      this.translationTable,
-      interpolations
-    );
+    const findTranslation = this.findTranslation(key, this.translationTable, interpolations);
     return findTranslation ? findTranslation : key;
   }
 
@@ -158,8 +140,7 @@ class LuigiI18NManager {
       if (obj.hasOwnProperty(key) && typeof obj[key] === 'object') {
         obj = obj[key];
       } else {
-        if (interpolations)
-          return this.findInterpolations(obj[key], interpolations);
+        if (interpolations) return this.findInterpolations(obj[key], interpolations);
         return obj[key];
       }
     }
diff --git a/core/src/core-api/navigation.js b/core/src/core-api/navigation.js
index abfd8e5c26..951b729b86 100644
--- a/core/src/core-api/navigation.js
+++ b/core/src/core-api/navigation.js
@@ -39,20 +39,8 @@ class LuigiNavigationManager {
    * Luigi.navigation().navigate('users/groups/stakeholders')
    * Luigi.navigation().navigate('/settings', null, true) // preserve view
    */
-  navigate(
-    path,
-    preserveView,
-    modalSettings,
-    splitViewSettings,
-    drawerSettings
-  ) {
-    return new linkManager().navigate(
-      path,
-      preserveView,
-      modalSettings,
-      splitViewSettings,
-      drawerSettings
-    );
+  navigate(path, preserveView, modalSettings, splitViewSettings, drawerSettings) {
+    return new linkManager().navigate(path, preserveView, modalSettings, splitViewSettings, drawerSettings);
   }
 
   /**
diff --git a/core/src/core-api/theming.js b/core/src/core-api/theming.js
index ffb6f487b0..0ee1a60614 100644
--- a/core/src/core-api/theming.js
+++ b/core/src/core-api/theming.js
@@ -106,19 +106,14 @@ class LuigiTheming {
        * @private
        */
       const theming = LuigiConfig.getConfigValue('settings.theming');
-      if (
-        theming &&
-        theming.nodeViewURLDecorator &&
-        theming.nodeViewURLDecorator.queryStringParameter
-      ) {
+      if (theming && theming.nodeViewURLDecorator && theming.nodeViewURLDecorator.queryStringParameter) {
         ViewUrlDecorator.add({
           type: 'queryString',
           uid: 'theming',
           key: theming.nodeViewURLDecorator.queryStringParameter.keyName,
           valueFn: () => {
             const value = this.getCurrentTheme();
-            const configValueFn =
-              theming.nodeViewURLDecorator.queryStringParameter.value;
+            const configValueFn = theming.nodeViewURLDecorator.queryStringParameter.value;
             return configValueFn ? configValueFn(value) : value;
           }
         });
diff --git a/core/src/core-api/ux.js b/core/src/core-api/ux.js
index b85ee805ad..6b90452723 100644
--- a/core/src/core-api/ux.js
+++ b/core/src/core-api/ux.js
@@ -16,14 +16,11 @@ class LuigiUX {
    * @since 0.6.4
    */
   hideAppLoadingIndicator() {
-    const appLoadingIndicator = document.querySelector(
-      APP_LOADING_INDICATOR.cssSelector
-    );
+    const appLoadingIndicator = document.querySelector(APP_LOADING_INDICATOR.cssSelector);
     if (appLoadingIndicator) {
       appLoadingIndicator.classList.add('hidden');
       setTimeout(() => {
-        appLoadingIndicator.parentNode &&
-          appLoadingIndicator.parentNode.removeChild(appLoadingIndicator);
+        appLoadingIndicator.parentNode && appLoadingIndicator.parentNode.removeChild(appLoadingIndicator);
       }, 500);
     }
   }
diff --git a/core/src/main.js b/core/src/main.js
index 7125435b88..867929d616 100644
--- a/core/src/main.js
+++ b/core/src/main.js
@@ -45,9 +45,7 @@ const configReadyCallback = () => {
         let app;
 
         if (LuigiElements.isCustomLuigiContainer()) {
-          document
-            .getElementsByTagName('html')[0]
-            .classList.add('luigi-app-in-custom-container');
+          document.getElementsByTagName('html')[0].classList.add('luigi-app-in-custom-container');
         }
 
         app = new App({
@@ -94,8 +92,7 @@ const configReadyCallback = () => {
         };
 
         Luigi.splitView = {
-          openAsSplitView: (path, settings) =>
-            app.$$.ctx.openSplitView(path, settings),
+          openAsSplitView: (path, settings) => app.$$.ctx.openSplitView(path, settings),
           splitViewHandle: {
             close: () => app.$$.ctx.closeSplitView(),
             collapse: () => app.$$.ctx.collapseSplitView(),
@@ -120,7 +117,7 @@ const configReadyCallback = () => {
 
         Luigi.closeUserSettings = () => {
           app.$$.ctx.closeUserSettings();
-        }
+        };
 
         resolve();
       });
diff --git a/core/src/navigation/BadgeCounter.html b/core/src/navigation/BadgeCounter.html
index c3a5e57ea0..202a8e90f8 100644
--- a/core/src/navigation/BadgeCounter.html
+++ b/core/src/navigation/BadgeCounter.html
@@ -1,16 +1,11 @@
-
-{#if node && node.badgeCounter}
-{#await node.badgeCounter.count()}
-{:then count}
+{#if node && node.badgeCounter} {#await node.badgeCounter.count()} {:then count}
 {#if count > 0}
 <span
   class="fd-counter fd-counter--notification"
   aria-label="{node.badgeCounter.label}"
->{count}</span>
-{/if}
-{:catch error}
-{/await}
-{/if}
+  >{count}</span
+>
+{/if} {:catch error} {/await} {/if}
 <script>
   export let node;
 </script>
diff --git a/core/src/navigation/ContextSwitcher.html b/core/src/navigation/ContextSwitcher.html
index c7a2cc2880..09b0086f28 100644
--- a/core/src/navigation/ContextSwitcher.html
+++ b/core/src/navigation/ContextSwitcher.html
@@ -1,4 +1,3 @@
-
 {#if contextSwitcherEnabled}
 <!-- DESKTOP VERSION (popover): -->
 {#if !isMobile}
@@ -14,14 +13,11 @@
         aria-disabled="{!renderAsDropdown}"
         data-testid="luigi-contextswitcher-button"
       >
-        {#if selectedOption && customSelectedOptionRenderer }
-        {@html customSelectedOptionRenderer(selectedOption)}
-        {:else}
-        {#if !selectedLabel}{$getTranslation(config.defaultLabel)}
+        {#if selectedOption && customSelectedOptionRenderer } {@html
+        customSelectedOptionRenderer(selectedOption)} {:else} {#if
+        !selectedLabel}{$getTranslation(config.defaultLabel)}
         {:else}{selectedLabel}{/if}
-        <i
-          class="sap-icon--megamenu fd-shellbar__button--icon"
-        ></i>
+        <i class="sap-icon--megamenu fd-shellbar__button--icon"></i>
         {/if}
       </button>
     </div>
@@ -58,11 +54,8 @@
       <div class="fd-bar__left">
         <div class="fd-bar__element">
           <h3 class="fd-dialog__title">
-            {#if !selectedLabel}
-            {$getTranslation(config.defaultLabel)}
-            {/if} {#if selectedLabel}
-            {selectedLabel}
-            {/if}
+            {#if !selectedLabel} {$getTranslation(config.defaultLabel)} {/if}
+            {#if selectedLabel} {selectedLabel} {/if}
           </h3>
         </div>
       </div>
@@ -91,25 +84,26 @@ <h3 class="fd-dialog__title">
             class="fd-button fd-button--light fd-dialog__decisive-button"
             on:click="{toggleDropdownState}"
             data-testid="mobile-topnav-close"
-          >Cancel</button>
+          >
+            Cancel
+          </button>
         </div>
       </div>
     </footer>
   </div>
 </div>
-{/if}
-{/if}
+{/if} {/if}
 <script>
   import {
     createEventDispatcher,
     onMount,
     getContext,
     beforeUpdate
-  } from 'svelte';
-  import { ContextSwitcherHelpers } from './services/context-switcher';
-  import ContextSwitcherNav from './ContextSwitcherNav.html';
-  import { LuigiConfig } from '../core-api';
-  import { Routing } from '../services/routing';
+  } from "svelte";
+  import { ContextSwitcherHelpers } from "./services/context-switcher";
+  import ContextSwitcherNav from "./ContextSwitcherNav.html";
+  import { LuigiConfig } from "../core-api";
+  import { Routing } from "../services/routing";
   import {
     IframeHelpers,
     RoutingHelpers,
@@ -117,7 +111,7 @@ <h3 class="fd-dialog__title">
     NavigationHelpers,
     GenericHelpers,
     EventListenerHelpers
-  } from '../utilities/helpers';
+  } from "../utilities/helpers";
 
   const dispatch = createEventDispatcher();
 
@@ -143,10 +137,10 @@ <h3 class="fd-dialog__title">
   export let defaultLabel;
   let preserveSubPathOnSwitch;
   let getUnsavedChangesModalPromise = getContext(
-    'getUnsavedChangesModalPromise'
+    "getUnsavedChangesModalPromise"
   );
-  let store = getContext('store');
-  let getTranslation = getContext('getTranslation');
+  let store = getContext("store");
+  let getTranslation = getContext("getTranslation");
   let prevContextSwitcherToggle = false;
 
   onMount(async () => {
@@ -154,7 +148,7 @@ <h3 class="fd-dialog__title">
       store,
       async () => {
         const contextSwitcherConfig = LuigiConfig.getConfigValue(
-          'navigation.contextSwitcher'
+          "navigation.contextSwitcher"
         );
         contextSwitcherEnabled = !!contextSwitcherConfig;
         if (!contextSwitcherEnabled) {
@@ -178,7 +172,7 @@ <h3 class="fd-dialog__title">
           alwaysShowDropdown =
             contextSwitcherConfig.alwaysShowDropdown !== false; // default is true
           actions = await LuigiConfig.getConfigValueAsync(
-            'navigation.contextSwitcher.actions'
+            "navigation.contextSwitcher.actions"
           );
           const currentPath = Routing.getCurrentPath();
 
@@ -200,14 +194,14 @@ <h3 class="fd-dialog__title">
           }
         }
       },
-      ['navigation.contextSwitcher']
+      ["navigation.contextSwitcher"]
     );
 
     RoutingHelpers.addRouteChangeListener(path => setSelectedContext(path));
 
-    EventListenerHelpers.addEventListener('message', e => {
+    EventListenerHelpers.addEventListener("message", e => {
       if (!IframeHelpers.getValidMessageSource(e)) return;
-      if (e.data && e.data.msg === 'luigi.refresh-context-switcher') {
+      if (e.data && e.data.msg === "luigi.refresh-context-switcher") {
         options = null;
         fetchOptions();
       }
@@ -293,7 +287,7 @@ <h3 class="fd-dialog__title">
     });
 
     if (isMobile) {
-      dispatch('toggleDropdownState');
+      dispatch("toggleDropdownState");
     }
   }
 
@@ -318,15 +312,15 @@ <h3 class="fd-dialog__title">
         Routing.navigateTo(option.link);
       }
       if (isMobile) {
-        dispatch('toggleDropdownState');
+        dispatch("toggleDropdownState");
       }
     });
   }
 
   export function toggleDropdownState() {
-    dispatch('toggleDropdownState');
+    dispatch("toggleDropdownState");
     const ddStates = dropDownStates || {};
-    const isOpened = JSON.parse(ddStates['contextSwitcherPopover']);
+    const isOpened = JSON.parse(ddStates["contextSwitcherPopover"]);
     if (isOpened) {
       fetchOptions();
     }
@@ -348,7 +342,7 @@ <h3 class="fd-dialog__title">
   }
 
   .lui-ctx-switch-menu {
-    &.fd-button[aria-disabled='true'] {
+    &.fd-button[aria-disabled="true"] {
       opacity: 1;
       cursor: default;
       background-color: transparent;
@@ -356,7 +350,7 @@ <h3 class="fd-dialog__title">
       padding-right: calc(0.625rem - var(--sapButton_BorderWidth, 0.0625rem));
       &:after {
         display: none;
-        content: '';
+        content: "";
       }
     }
   }
diff --git a/core/src/navigation/ContextSwitcherNav.html b/core/src/navigation/ContextSwitcherNav.html
index 2413df9afa..642ff82eb7 100644
--- a/core/src/navigation/ContextSwitcherNav.html
+++ b/core/src/navigation/ContextSwitcherNav.html
@@ -28,17 +28,16 @@
         <div class="fd-busy-indicator--circle-2"></div>
       </div>
     </li>
-    {/if} {#if options && options.length} {#each options as node}
-    {#await getNodeName(node.label, config.fallbackLabelResolver,
-    node.id)} {:then label}
+    {/if} {#if options && options.length} {#each options as node} {#await
+    getNodeName(node.label, config.fallbackLabelResolver, node.id)} {:then
+    label}
     <li
       class="fd-menu__item"
       on:click="{()=> goToOption(node, selectedOption)}"
       data-testid="{getTestId(node)}"
     >
-      {#if customOptionsRenderer}
-      {@html customOptionsRenderer(node, label === selectedLabel)}
-      {:else}
+      {#if customOptionsRenderer} {@html customOptionsRenderer(node, label ===
+      selectedLabel)} {:else}
       <a
         href="{getRouteLink(node)}"
         on:click|preventDefault="{()=> {}}"
@@ -72,7 +71,7 @@
   {/if}
 </nav>
 <script>
-  import { createEventDispatcher } from 'svelte';
+  import { createEventDispatcher } from "svelte";
   const dispatch = createEventDispatcher();
 
   export let actions = [];
@@ -89,11 +88,11 @@
   export let getTranslation;
 
   export function onActionClick(node) {
-    dispatch('onActionClick', { node });
+    dispatch("onActionClick", { node });
   }
 
   export function goToOption(option, selectedOption) {
-    dispatch('goToOption', { option, selectedOption });
+    dispatch("goToOption", { option, selectedOption });
   }
 </script>
 
diff --git a/core/src/navigation/GlobalNav.html b/core/src/navigation/GlobalNav.html
index af2216dd4a..520478a9a0 100644
--- a/core/src/navigation/GlobalNav.html
+++ b/core/src/navigation/GlobalNav.html
@@ -1,13 +1,9 @@
-<svelte:window on:click="{closeAllDropdowns}" on:blur="{closeAllDropdowns}"/>
+<svelte:window on:click="{closeAllDropdowns}" on:blur="{closeAllDropdowns}" />
 {#if showGlobalNav}
 <div class="fd-shellbar__group fd-shellbar__group--actions lui-globalnav">
-  {#if children && pathData.length > 0}
-  {#each children as node, i}
-  {#if node.globalNav === true}
-  {#if node.separator}
-  <span
-    class="fd-toolbar__separator"
-  ></span>
+  {#if children && pathData.length > 0} {#each children as node, i} {#if
+  node.globalNav === true} {#if node.separator}
+  <span class="fd-toolbar__separator"></span>
   {:else}
   <div class="fd-shellbar__action fd-shellbar__action--hide">
     <button
@@ -18,17 +14,14 @@
       on:click="{() => handleClick(node)}"
       data-testid="{getTestId(node)}"
     >
-      {#if node.icon}
-      {#if hasOpenUIicon(node)}
-      <span
-        class="fd-top-nav__icon sap-icon--{node.icon}"
-      ></span>
+      {#if node.icon} {#if hasOpenUIicon(node)}
+      <span class="fd-top-nav__icon sap-icon--{node.icon}"></span>
       {:else}
       <img
         class="fd-top-nav__icon nav-icon"
         src="{node.icon}"
         alt="{node.altText ? node.altText : ''}"
-      >
+      />
       {/if}
       <!-- end hasOpenUIicon-->
       {/if}
@@ -38,16 +31,11 @@
       {/if}
     </button>
   </div>
-  {/if}
-  {/if}
-  {/each}
+  {/if} {/if} {/each}
   <div class="lui-global-nav__bottom-section">
-    {#each children as node, i}
-    {#if node.globalNav === 'bottom'}
-    {#if node.separator}
-    <span
-      class="fd-toolbar__separator"
-    ></span>
+    {#each children as node, i} {#if node.globalNav === 'bottom'} {#if
+    node.separator}
+    <span class="fd-toolbar__separator"></span>
     {:else}
     <div class="fd-shellbar__action fd-shellbar__action--hide">
       <button
@@ -58,17 +46,14 @@
         on:click="{() => handleClick(node)}"
         data-testid="{getTestId(node)}"
       >
-        {#if node.icon}
-        {#if hasOpenUIicon(node)}
-        <span
-          class="fd-top-nav__icon sap-icon--{node.icon}"
-        ></span>
+        {#if node.icon} {#if hasOpenUIicon(node)}
+        <span class="fd-top-nav__icon sap-icon--{node.icon}"></span>
         {:else}
         <img
           class="fd-top-nav__icon nav-icon"
           src="{node.icon}"
           alt="{node.altText ? node.altText : ''}"
-        >
+        />
         {/if}
         <!-- end hasOpenUIicon-->
         {/if}
@@ -78,9 +63,7 @@
         {/if}
       </button>
     </div>
-    {/if}
-    {/if}
-    {/each}
+    {/if} {/if} {/each}
   </div>
   {/if}
 </div>
@@ -91,15 +74,15 @@
     createEventDispatcher,
     onMount,
     getContext
-  } from 'svelte';
-  import { LuigiAuth, LuigiConfig, LuigiI18N } from '../core-api';
+  } from "svelte";
+  import { LuigiAuth, LuigiConfig, LuigiI18N } from "../core-api";
   import {
     NavigationHelpers,
     RoutingHelpers,
     StateHelpers,
     EventListenerHelpers,
     GenericHelpers
-  } from '../utilities/helpers';
+  } from "../utilities/helpers";
 
   const dispatch = createEventDispatcher();
 
@@ -109,9 +92,9 @@
   export let children;
   export let selectedNode;
 
-  let store = getContext('store');
+  let store = getContext("store");
   let contextSwitcherConfig = LuigiConfig.getConfigValue(
-    'navigation.contextSwitcher'
+    "navigation.contextSwitcher"
   );
 
   export let showGlobalNav;
@@ -132,17 +115,17 @@
       store,
       () => {
         hideNavComponent = LuigiConfig.getConfigBooleanValue(
-          'settings.hideNavigation'
+          "settings.hideNavigation"
         );
         responsiveNavSetting = LuigiConfig.getConfigValue(
-          'settings.responsiveNavigation'
+          "settings.responsiveNavigation"
         );
         showGlobalNav =
-          LuigiConfig.getConfigBooleanValue('settings.globalSideNavigation') &&
-          GenericHelpers.requestExperimentalFeature('globalNav', true);
-        document.body.classList.toggle('lui-global-nav-visible', showGlobalNav);
+          LuigiConfig.getConfigBooleanValue("settings.globalSideNavigation") &&
+          GenericHelpers.requestExperimentalFeature("globalNav", true);
+        document.body.classList.toggle("lui-global-nav-visible", showGlobalNav);
       },
-      ['navigation']
+      ["navigation"]
     );
   });
 
@@ -171,7 +154,7 @@
   }
 
   export function handleClick(node) {
-    dispatch('handleClick', { node });
+    dispatch("handleClick", { node });
   }
 
   export function handleClickExternal(event) {
@@ -191,7 +174,7 @@
 </script>
 
 <style type="text/scss">
-  @import 'styles/variables';
+  @import "styles/variables";
   .lui-globalnav {
     position: fixed;
     height: 100%;
diff --git a/core/src/navigation/GlobalSearch.html b/core/src/navigation/GlobalSearch.html
index ff5fc11c44..a46031ec6e 100644
--- a/core/src/navigation/GlobalSearch.html
+++ b/core/src/navigation/GlobalSearch.html
@@ -1,4 +1,4 @@
-<svelte:window on:click="{closeSearchResult}" on:blur="{closeSearchResult}"/>
+<svelte:window on:click="{closeSearchResult}" on:blur="{closeSearchResult}" />
 <div
   class="fd-shellbar__action {isSearchFieldVisible ? 'luigi-search-shell__mobile':''}"
 >
@@ -16,7 +16,7 @@
           class="fd-input fd-input-group__input fd-shellbar__input-group__input luigi-search__input"
           data-testid="luigi-search-input__no-handlers"
           autofocus
-        >
+        />
         {:else}
         <input
           type="text"
@@ -25,7 +25,7 @@
           data-testid="luigi-search-input"
           autofocus
           bind:this="{inputElem}"
-        >
+        />
         {/if}
       </div>
       {#if !isCustomSearchRenderer}
@@ -47,18 +47,17 @@
               tabindex="0"
             >
               {#if !isCustomSearchResultItemRenderer}
-              <a
-                class="fd-menu__link"
-                on:click|preventDefault="{() => {}}"
-              >
+              <a class="fd-menu__link" on:click|preventDefault="{() => {}}">
                 <div class="fd-product-switch__text">
                   <div class="fd-product-switch__title">{result.label}</div>
-                  <div class="fd-product-switch__subtitle">{result.description}</div>
+                  <div class="fd-product-switch__subtitle">
+                    {result.description}
+                  </div>
                 </div>
               </a>
-              {:else}
-              {@html renderCustomSearchItem(result,luigiCustomSearchItemRenderer__slotContainer, index)}
-              {/if}
+              {:else} {@html
+              renderCustomSearchItem(result,luigiCustomSearchItemRenderer__slotContainer,
+              index)} {/if}
             </li>
             {/each}
           </ul>
@@ -85,16 +84,16 @@
   </div>
 </div>
 <script>
-  import { beforeUpdate, createEventDispatcher, onMount } from 'svelte';
-  import { LuigiAuth, LuigiConfig, LuigiI18N } from '../core-api';
-  import { GenericHelpers } from '../utilities/helpers';
-  import { Routing } from '../services/routing';
+  import { beforeUpdate, createEventDispatcher, onMount } from "svelte";
+  import { LuigiAuth, LuigiConfig, LuigiI18N } from "../core-api";
+  import { GenericHelpers } from "../utilities/helpers";
+  import { Routing } from "../services/routing";
   import {
     KEYCODE_ARROW_UP,
     KEYCODE_ARROW_DOWN,
     KEYCODE_ENTER,
     KEYCODE_ESC
-  } from '../utilities/keycode.js';
+  } from "../utilities/keycode.js";
   export let isSearchFieldVisible;
   export let searchResult = [];
   export let displaySearchResult;
@@ -114,7 +113,7 @@
   let isCustomSearchRenderer;
   let isCustomSearchResultItemRenderer;
   onMount(async () => {
-    search = await LuigiConfig.getConfigValueAsync('globalSearch');
+    search = await LuigiConfig.getConfigValueAsync("globalSearch");
     let inputElement = inputElem;
     const placeHolder = getSearchPlaceholder(search.searchProvider);
     if (placeHolder) {
@@ -136,7 +135,7 @@
     if (GenericHelpers.isFunction(searchProvider.inputPlaceholder)) {
       return searchProvider.inputPlaceholder();
     }
-    if (typeof searchProvider.inputPlaceholder === 'string') {
+    if (typeof searchProvider.inputPlaceholder === "string") {
       const translated = LuigiI18N.getTranslation(
         searchProvider.inputPlaceholder
       );
@@ -145,7 +144,7 @@
       }
       return searchProvider.inputPlaceholder;
     }
-    if (typeof searchProvider.inputPlaceholder === 'object') {
+    if (typeof searchProvider.inputPlaceholder === "object") {
       return searchProvider.inputPlaceholder[currentLocale];
     }
   }
@@ -158,11 +157,11 @@
         searchApiObj
       );
     });
-    return '';
+    return "";
   }
 
   function closeSearchResult() {
-    dispatch('closeSearchResult');
+    dispatch("closeSearchResult");
   }
 
   function onKeyUp({ keyCode }) {
@@ -180,15 +179,15 @@
       } else if (keyCode === KEYCODE_ARROW_DOWN) {
         if (displaySearchResult) {
           document
-            .querySelector('.luigi-search-result-item__0')
-            .childNodes[0].setAttribute('aria-selected', 'true');
-          document.querySelector('.luigi-search-result-item__0').focus();
+            .querySelector(".luigi-search-result-item__0")
+            .childNodes[0].setAttribute("aria-selected", "true");
+          document.querySelector(".luigi-search-result-item__0").focus();
         }
       } else if (GenericHelpers.isFunction(search.searchProvider.onInput)) {
         search.searchProvider.onInput();
       }
     } else {
-      console.warn('GlobalSearch is not available.');
+      console.warn("GlobalSearch is not available.");
     }
   }
 
@@ -203,7 +202,7 @@
           previousSibling
         } = renderedSearchResultItems[index];
         let nodeSibling;
-        if (childNodes[0].getAttribute('aria-selected') === 'true') {
+        if (childNodes[0].getAttribute("aria-selected") === "true") {
           if (direction === KEYCODE_ARROW_DOWN) {
             nodeSibling =
               nextSibling !== null ? nextSibling : renderedSearchResultItems[0];
@@ -216,8 +215,8 @@
                     renderedSearchResultItems.length - 1
                   ];
           }
-          childNodes[0].setAttribute('aria-selected', 'false');
-          nodeSibling.childNodes[0].setAttribute('aria-selected', 'true');
+          childNodes[0].setAttribute("aria-selected", "false");
+          nodeSibling.childNodes[0].setAttribute("aria-selected", "true");
           nodeSibling.focus();
           break;
         }
@@ -231,8 +230,8 @@
     if (renderedSearchResultItems) {
       for (let index = 0; index < renderedSearchResultItems.length; index++) {
         let element = renderedSearchResultItems[index];
-        if (element.childNodes[0].getAttribute('aria-selected') === 'true') {
-          element.childNodes[0].setAttribute('aria-selected', 'false');
+        if (element.childNodes[0].getAttribute("aria-selected") === "true") {
+          element.childNodes[0].setAttribute("aria-selected", "false");
         }
       }
     }
@@ -277,7 +276,7 @@
     if (node.externalLink) {
       Routing.navigateToLink(node);
     } else {
-      dispatch('handleSearchNavigation', { node });
+      dispatch("handleSearchNavigation", { node });
     }
   }
 
@@ -295,7 +294,7 @@
     else {
       displaySearchResult = false;
     }
-    dispatch('toggleSearch', {
+    dispatch("toggleSearch", {
       isSearchFieldVisible,
       inputElem,
       luigiCustomSearchRenderer__slot
@@ -311,12 +310,12 @@
 <style type="text/scss">
   //remove default browser outline on focus for search results
   .luigi-search-popover__body {
-    li[class*='luigi-search-result']:focus {
+    li[class*="luigi-search-result"]:focus {
       outline: none;
     }
   }
   .luigi-search {
-    &[aria-hidden='true'] {
+    &[aria-hidden="true"] {
       visibility: hidden;
       width: 0;
     }
diff --git a/core/src/navigation/LeftNav.html b/core/src/navigation/LeftNav.html
index 8faebbff78..65ebc3baaf 100644
--- a/core/src/navigation/LeftNav.html
+++ b/core/src/navigation/LeftNav.html
@@ -15,76 +15,122 @@
     <div class="fd-side-nav__main-navigation">
       <div class="lui-fd-side-nav-wrapper">
         <ul class="fd-nested-list {sideNavClass}">
-          {#each sortedChildrenEntries as [key, nodes],index}
-          {#if key === 'undefined' || key.startsWith(virtualGroupPrefix)}
+          {#each sortedChildrenEntries as [key, nodes],index} {#if key ===
+          'undefined' || key.startsWith(virtualGroupPrefix)}
           <!-- Single nodes -->
           {#each nodes as node} {#if !node.hideFromNav} {#if node.label}
           <li class="fd-nested-list__item">
-            <a href="{getRouteLink(node)}" title="{$getTranslation(node.label)}"
+            <a
+              href="{getRouteLink(node)}"
+              title="{$getTranslation(node.label)}"
               class="fd-nested-list__link {node === selectedNode ? 'is-selected' : ''}"
-              on:click|preventDefault="{() => handleClick(node)}" data-testid="{getTestId(node)}">
+              on:click|preventDefault="{() => handleClick(node)}"
+              data-testid="{getTestId(node)}"
+            >
               {#if node.icon} {#if isOpenUIiconName(node.icon)}
-              <i class="fd-nested-list__icon sap-icon sap-icon--{node.icon}" role="presentation"></i>
+              <i
+                class="fd-nested-list__icon sap-icon sap-icon--{node.icon}"
+                role="presentation"
+              ></i>
               {:else}
               <span class="fd-nested-list__icon sap-icon">
-                <img src="{node.icon}" alt="{node.altText ? node.altText : ''}">
+                <img
+                  src="{node.icon}"
+                  alt="{node.altText ? node.altText : ''}"
+                />
               </span>
+              {/if} {:else}
+              <i
+                class="fd-nested-list__icon sap-icon {isSemiCollapsed ? 'sap-icon--rhombus-milestone-2' : ''}"
+                role="presentation"
+              ></i>
               {/if}
-              {:else}
-              <i class="fd-nested-list__icon sap-icon {isSemiCollapsed ? 'sap-icon--rhombus-milestone-2' : ''}"
-                role="presentation"></i>
-              {/if}
-              <span class="fd-nested-list__title">{$getTranslation(node.label)}</span>
+              <span class="fd-nested-list__title"
+                >{$getTranslation(node.label)}</span
+              >
               {#if node.externalLink && node.externalLink.url}
-              <i class="fd-nested-list__icon sap-icon sap-icon--action" role="presentation"></i>
-              {/if}
-              {#if node.badgeCounter}
+              <i
+                class="fd-nested-list__icon sap-icon sap-icon--action"
+                role="presentation"
+              ></i>
+              {/if} {#if node.badgeCounter}
               <BadgeCounter {node} />
               {/if}
             </a>
           </li>
-          {/if} {/if} {/each}
-          {:else}
+          {/if} {/if} {/each} {:else}
           <!-- Collapsible nodes -->
           {#if nodes.metaInfo.collapsible}
-          <li class="fd-nested-list__item lui-collapsible-item"
+          <li
+            class="fd-nested-list__item lui-collapsible-item"
             on:click|stopPropagation="{() => handleIconClick(nodes, event.currentTarget)}"
-            data-testid="{getTestIdForCat(nodes.metaInfo, key)}">
+            data-testid="{getTestIdForCat(nodes.metaInfo, key)}"
+          >
             <div class="fd-nested-list__content has-child" tabindex="0">
-              <a href="javascript:void(null)" title="{$getTranslation(key)}"
-                class="fd-nested-list__link {isExpanded(nodes, expandedCategories) ? 'is-expanded' : ''}" tabindex="-1"
-                id="collapsible_listnode_{index}" aria-haspopup="true"
+              <a
+                href="javascript:void(null)"
+                title="{$getTranslation(key)}"
+                class="fd-nested-list__link {isExpanded(nodes, expandedCategories) ? 'is-expanded' : ''}"
+                tabindex="-1"
+                id="collapsible_listnode_{index}"
+                aria-haspopup="true"
                 aria-expanded="{isExpanded(nodes, expandedCategories)}"
-                on:click|preventDefault="{() => setExpandedState(nodes, !isExpanded(nodes, expandedCategories), this)}">
+                on:click|preventDefault="{() => setExpandedState(nodes, !isExpanded(nodes, expandedCategories), this)}"
+              >
                 {#if isOpenUIiconName(nodes.metaInfo.icon)}
-                <i class="fd-nested-list__icon sap-icon {'sap-icon--' + nodes.metaInfo.icon} {isSemiCollapsed && !nodes.metaInfo.icon ? 'sap-icon--rhombus-milestone-2' : ''}"
-                  role="presentation"></i>
+                <i
+                  class="fd-nested-list__icon sap-icon {'sap-icon--' + nodes.metaInfo.icon} {isSemiCollapsed && !nodes.metaInfo.icon ? 'sap-icon--rhombus-milestone-2' : ''}"
+                  role="presentation"
+                ></i>
                 {:else}
                 <span class="fd-nested-list__icon sap-icon">
-                  <img src="{nodes.metaInfo.icon}" alt="{nodes.metaInfo.altText ? nodes.metaInfo.altText : ''}">
+                  <img
+                    src="{nodes.metaInfo.icon}"
+                    alt="{nodes.metaInfo.altText ? nodes.metaInfo.altText : ''}"
+                  />
                 </span>
                 {/if}
-                <span class="fd-nested-list__title">{$getTranslation(key)}</span>
+                <span class="fd-nested-list__title"
+                  >{$getTranslation(key)}</span
+                >
               </a>
-              <button class="fd-button fd-nested-list__button" href="#" tabindex="-1" aria-label="Expand categories"
-                aria-haspopup="true" aria-expanded="{isExpanded(nodes, expandedCategories)}"
-                on:click|preventDefault="{() => setExpandedState(nodes, !isExpanded(nodes, expandedCategories), this)}">
-                <i class="{isExpanded(nodes, expandedCategories) ? 'sap-icon--navigation-down-arrow' : 'sap-icon--navigation-right-arrow'}"
-                  role="presentation"></i>
+              <button
+                class="fd-button fd-nested-list__button"
+                href="#"
+                tabindex="-1"
+                aria-label="Expand categories"
+                aria-haspopup="true"
+                aria-expanded="{isExpanded(nodes, expandedCategories)}"
+                on:click|preventDefault="{() => setExpandedState(nodes, !isExpanded(nodes, expandedCategories), this)}"
+              >
+                <i
+                  class="{isExpanded(nodes, expandedCategories) ? 'sap-icon--navigation-down-arrow' : 'sap-icon--navigation-right-arrow'}"
+                  role="presentation"
+                ></i>
               </button>
             </div>
-            <ul class="fd-nested-list fd-nested-list--text-only level-2"
-              aria-hidden="{!isExpanded(nodes, expandedCategories)}">
+            <ul
+              class="fd-nested-list fd-nested-list--text-only level-2"
+              aria-hidden="{!isExpanded(nodes, expandedCategories)}"
+            >
               {#each nodes as node} {#if !node.hideFromNav} {#if node.label}
-              <li class="fd-nested-list__item" aria-labelledby="collapsible_listnode_{index}">
-                <a href="{getRouteLink(node)}" class="fd-nested-list__link {node === selectedNode ? 'is-selected' : ''}"
-                  on:click|preventDefault="{() => handleClick(node)}" data-testid="{getTestId(node)}"
-                  title="{$getTranslation(node.label)}">
-                  <span class="fd-nested-list__title">{$getTranslation(node.label)}</span>
+              <li
+                class="fd-nested-list__item"
+                aria-labelledby="collapsible_listnode_{index}"
+              >
+                <a
+                  href="{getRouteLink(node)}"
+                  class="fd-nested-list__link {node === selectedNode ? 'is-selected' : ''}"
+                  on:click|preventDefault="{() => handleClick(node)}"
+                  data-testid="{getTestId(node)}"
+                  title="{$getTranslation(node.label)}"
+                >
+                  <span class="fd-nested-list__title"
+                    >{$getTranslation(node.label)}</span
+                  >
                   {#if node.externalLink && node.externalLink.url}
                   <i class="sap-icon--action"></i>
-                  {/if}
-                  {#if node.badgeCounter}
+                  {/if} {#if node.badgeCounter}
                   <BadgeCounter {node} />
                   {/if}
                 </a>
@@ -95,20 +141,27 @@
             {#if nodes.metaInfo && nodes.metaInfo.label === selectedCategory}
             <div class="lui-flyout-sublist">
               <div class="lui-flyout-sublist__wrapper">
-                <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$getTranslation(key)}
+                <h5
+                  class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4"
+                >
+                  {$getTranslation(key)}
                 </h5>
                 <ul class="fd-nested-list fd-nested-list--text-only">
                   {#each nodes as node} {#if !node.hideFromNav} {#if node.label}
                   <li class="fd-nested-list__item">
-                    <a href="{getRouteLink(node)}"
+                    <a
+                      href="{getRouteLink(node)}"
                       class="fd-nested-list__link {node === selectedNode ? 'is-selected' : ''}"
-                      on:click|preventDefault="{() => handleClick(node)}" data-testid="{getTestId(node)}"
-                      title="{$getTranslation(node.label)}">
-                      <span class="fd-nested-list__title">{$getTranslation(node.label)}</span>
+                      on:click|preventDefault="{() => handleClick(node)}"
+                      data-testid="{getTestId(node)}"
+                      title="{$getTranslation(node.label)}"
+                    >
+                      <span class="fd-nested-list__title"
+                        >{$getTranslation(node.label)}</span
+                      >
                       {#if node.externalLink && node.externalLink.url}
                       <i class="sap-icon--action"></i>
-                      {/if}
-                      {#if node.badgeCounter}
+                      {/if} {#if node.badgeCounter}
                       <BadgeCounter {node} />
                       {/if}
                     </a>
@@ -121,60 +174,85 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
           </li>
           {:else}
           <!-- Category nodes -->
-          <li class="fd-nested-list__group-header lui-category" title="{$getTranslation(key)}"
-            data-testid="{getTestIdForCat(nodes.metaInfo, key)}" id="category_list_level1_{index}">
-            {#if hasCategoriesWithIcon && nodes.metaInfo.icon}
-            {#if isOpenUIiconName(nodes.metaInfo.icon)}
-            <i class="fd-nested-list__icon sap-icon {nodes.metaInfo.icon ? 'sap-icon--' + nodes.metaInfo.icon : ''}"
-              role="presentation"></i>
+          <li
+            class="fd-nested-list__group-header lui-category"
+            title="{$getTranslation(key)}"
+            data-testid="{getTestIdForCat(nodes.metaInfo, key)}"
+            id="category_list_level1_{index}"
+          >
+            {#if hasCategoriesWithIcon && nodes.metaInfo.icon} {#if
+            isOpenUIiconName(nodes.metaInfo.icon)}
+            <i
+              class="fd-nested-list__icon sap-icon {nodes.metaInfo.icon ? 'sap-icon--' + nodes.metaInfo.icon : ''}"
+              role="presentation"
+            ></i>
             {:else}
             <span class="fd-nested-list__icon sap-icon">
-              <img src="{nodes.metaInfo.icon}" alt="{nodes.metaInfo.altText ? nodes.metaInfo.altText : ''}">
+              <img
+                src="{nodes.metaInfo.icon}"
+                alt="{nodes.metaInfo.altText ? nodes.metaInfo.altText : ''}"
+              />
             </span>
-            {/if}
-            {/if}
-            {$getTranslation(key)}
+            {/if} {/if} {$getTranslation(key)}
           </li>
           {#each nodes as node} {#if !node.hideFromNav} {#if node.label}
-          <li class="fd-nested-list__item" title="{$getTranslation(node.label)}"
-            aria-labelledby="category_list_level1_{index}">
-            <a href="{getRouteLink(node)}" class="fd-nested-list__link {node === selectedNode ? 'is-selected' : ''}"
-              on:click|preventDefault="{() => handleClick(node)}" data-testid="{getTestId(node)}">
+          <li
+            class="fd-nested-list__item"
+            title="{$getTranslation(node.label)}"
+            aria-labelledby="category_list_level1_{index}"
+          >
+            <a
+              href="{getRouteLink(node)}"
+              class="fd-nested-list__link {node === selectedNode ? 'is-selected' : ''}"
+              on:click|preventDefault="{() => handleClick(node)}"
+              data-testid="{getTestId(node)}"
+            >
               {#if node.icon} {#if isOpenUIiconName(node.icon)}
-              <i class="fd-nested-list__icon sap-icon sap-icon--{node.icon}"></i>
+              <i
+                class="fd-nested-list__icon sap-icon sap-icon--{node.icon}"
+              ></i>
               {:else}
               <span class="fd-nested-list__icon sap-icon">
-                <img src="{node.icon}" alt="{node.altText ? node.altText : ''}">
+                <img
+                  src="{node.icon}"
+                  alt="{node.altText ? node.altText : ''}"
+                />
               </span>
+              {/if} {:else}
+              <i
+                class="fd-nested-list__icon sap-icon {isSemiCollapsed ? 'sap-icon--rhombus-milestone-2' : ''}"
+              ></i>
+              <span
+                >{isSemiCollapsed ? 'sap-icon--rhombus-milestone-2' : ''}</span
+              >
               {/if}
-              {:else}
-              <i class="fd-nested-list__icon sap-icon {isSemiCollapsed ? 'sap-icon--rhombus-milestone-2' : ''}"></i>
-              <span>{isSemiCollapsed ? 'sap-icon--rhombus-milestone-2' : ''}</span>
-              {/if}
-              <span class="fd-nested-list__title">{$getTranslation(node.label)}</span>
+              <span class="fd-nested-list__title"
+                >{$getTranslation(node.label)}</span
+              >
               {#if node.externalLink && node.externalLink.url}
               <i class="sap-icon--action"></i>
-              {/if}
-              {#if node.badgeCounter}
+              {/if} {#if node.badgeCounter}
               <BadgeCounter {node} />
               {/if}
             </a>
           </li>
-          {/if} {/if} {/each}
-          {/if}
-          {/if} {/each}
+          {/if} {/if} {/each} {/if} {/if} {/each}
         </ul>
       </div>
     </div>
-    {/if}
-    {#if footerText || semiCollapsibleButton}
+    {/if} {#if footerText || semiCollapsibleButton}
     <div class="fd-side-nav__utility">
       <span class="lui-side-nav__footer">
-        <span class="lui-side-nav__footer--text fd-has-type-minus-1">{footerText ? footerText : ''}</span>
+        <span class="lui-side-nav__footer--text fd-has-type-minus-1"
+          >{footerText ? footerText : ''}</span
+        >
         {#if semiCollapsibleButton}
-        <i class="lui-side-nav__footer--icon {isSemiCollapsed ? 'sap-icon--open-command-field' : 'sap-icon--close-command-field'}"
-          on:click="{() => semiCollapsibleButtonClicked(this)}" data-testid="semiCollapsibleButton"
-          title="{burgerTooltip}"></i>
+        <i
+          class="lui-side-nav__footer--icon {isSemiCollapsed ? 'sap-icon--open-command-field' : 'sap-icon--close-command-field'}"
+          on:click="{() => semiCollapsibleButtonClicked(this)}"
+          data-testid="semiCollapsibleButton"
+          title="{burgerTooltip}"
+        ></i>
         {/if}
       </span>
     </div>
@@ -188,8 +266,8 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
     createEventDispatcher,
     onMount,
     getContext
-  } from 'svelte';
-  import { RoutingHelpers } from '../utilities/helpers';
+  } from "svelte";
+  import { RoutingHelpers } from "../utilities/helpers";
 
   //TODO refactor
   const __this = {
@@ -210,15 +288,15 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
     set: obj => {
       if (obj) {
         Object.getOwnPropertyNames(obj).forEach(prop => {
-          if (prop === 'pathData') {
+          if (prop === "pathData") {
             pathData = obj.pathData;
-          } else if (prop === 'context') {
+          } else if (prop === "context") {
             context = obj.context;
-          } else if (prop === 'children') {
+          } else if (prop === "children") {
             children = obj.children;
-          } else if (prop === 'selectedNode') {
+          } else if (prop === "selectedNode") {
             selectedNode = obj.selectedNode;
-          } else if (prop === 'hasCategoriesWithIcon') {
+          } else if (prop === "hasCategoriesWithIcon") {
             hasCategoriesWithIcon = obj.hasCategoriesWithIcon;
           }
         });
@@ -228,11 +306,11 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
           (selectedNode &&
             selectedNode.parent &&
             selectedNode.parent.sideNavAccordionMode);
-        if (typeof sideNavAccordionModeOverride !== 'undefined') {
+        if (typeof sideNavAccordionModeOverride !== "undefined") {
           sideNavAccordionMode = sideNavAccordionModeOverride;
         } else {
           sideNavAccordionMode = LuigiConfig.getConfigBooleanValue(
-            'navigation.defaults.sideNavAccordionMode'
+            "navigation.defaults.sideNavAccordionMode"
           );
         }
       }
@@ -241,13 +319,13 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
 
   const dispatch = createEventDispatcher();
 
-  import { Navigation } from './services/navigation';
-  import { IframeHelpers, NavigationHelpers } from '../utilities/helpers';
-  import { LuigiConfig, LuigiElements, LuigiI18N } from '../core-api';
-  import { StateHelpers, EventListenerHelpers } from '../utilities/helpers';
-  import { CSS_BREAKPOINTS } from '../utilities/constants';
-  import { SemiCollapsibleNavigation } from './services/semi-collapsed-navigation';
-  import BadgeCounter from './BadgeCounter.html';
+  import { Navigation } from "./services/navigation";
+  import { IframeHelpers, NavigationHelpers } from "../utilities/helpers";
+  import { LuigiConfig, LuigiElements, LuigiI18N } from "../core-api";
+  import { StateHelpers, EventListenerHelpers } from "../utilities/helpers";
+  import { CSS_BREAKPOINTS } from "../utilities/constants";
+  import { SemiCollapsibleNavigation } from "./services/semi-collapsed-navigation";
+  import BadgeCounter from "./BadgeCounter.html";
 
   export let children;
   export let hideNavComponent;
@@ -270,8 +348,8 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
   let previousWindowWidth;
   let responsiveNavSetting;
   let sideNavCompactMode;
-  let store = getContext('store');
-  let getTranslation = getContext('getTranslation');
+  let store = getContext("store");
+  let getTranslation = getContext("getTranslation");
 
   const setLeftNavData = async () => {
     const componentData = __this.get();
@@ -289,29 +367,29 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
 
   onMount(() => {
     semiCollapsibleButton =
-      LuigiConfig.getConfigValue('settings.responsiveNavigation') ===
-      'semiCollapsible';
+      LuigiConfig.getConfigValue("settings.responsiveNavigation") ===
+      "semiCollapsible";
     hideNavComponent = LuigiConfig.getConfigBooleanValue(
-      'settings.hideNavigation'
+      "settings.hideNavigation"
     );
     sideNavCompactMode = LuigiConfig.getConfigBooleanValue(
-      'settings.sideNavCompactMode'
+      "settings.sideNavCompactMode"
     );
     expandedCategories = NavigationHelpers.loadExpandedCategories();
 
     StateHelpers.doOnStoreChange(
       store,
       () => {
-        footerText = LuigiConfig.getConfigValue('settings.sideNavFooterText');
+        footerText = LuigiConfig.getConfigValue("settings.sideNavFooterText");
       },
-      ['settings.footer']
+      ["settings.footer"]
     );
 
     // set compact mode class
     if (Boolean(sideNavCompactMode)) {
-      sideNavClass = 'fd-nested-list fd-nested-list--compact';
+      sideNavClass = "fd-nested-list fd-nested-list--compact";
     } else {
-      sideNavClass = 'fd-nested-list';
+      sideNavClass = "fd-nested-list";
     }
     let stateArr = SemiCollapsibleNavigation.initial();
     isSemiCollapsed = stateArr.isSemiCollapsed;
@@ -320,8 +398,8 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
       isSemiCollapsed = stateArr.isSemiCollapsed;
     });
 
-    EventListenerHelpers.addEventListener('message', e => {
-      if ('luigi.navigation.update-badge-counters' === e.data.msg) {
+    EventListenerHelpers.addEventListener("message", e => {
+      if ("luigi.navigation.update-badge-counters" === e.data.msg) {
         setLeftNavData();
       }
     });
@@ -371,13 +449,13 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
   // [svelte-upgrade suggestion]
   // review these functions and remove unnecessary 'export' keywords
   export function handleClick(node) {
-    dispatch('handleClick', { node });
+    dispatch("handleClick", { node });
   }
 
   export function handleIconClick(nodeOrNodes, el) {
     if (SemiCollapsibleNavigation.getCollapsed()) {
       let selectedCat;
-      let sideBar = document.getElementsByClassName('fd-app__sidebar')[0];
+      let sideBar = document.getElementsByClassName("fd-app__sidebar")[0];
 
       if (nodeOrNodes.metaInfo && nodeOrNodes.metaInfo.label) {
         selectedCat = nodeOrNodes.metaInfo.label;
@@ -387,8 +465,8 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
           nodeOrNodes.category;
       }
 
-      if (!sideBar.classList.contains('isBlocked')) {
-        sideBar.className += ' isBlocked';
+      if (!sideBar.classList.contains("isBlocked")) {
+        sideBar.className += " isBlocked";
       }
 
       // only close if same clicked
@@ -407,7 +485,7 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
 
   export function calculateFlyoutPosition(el) {
     //Calculate top/bottom position for flyout sublist
-    const parent = el.closest('.fd-nested-list__item');
+    const parent = el.closest(".fd-nested-list__item");
     const parentTopPosition = parent.offsetTop;
     const shellbarHeight = LuigiElements.getShellbar().offsetHeight;
     let containerHeight;
@@ -418,9 +496,9 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
     }
     setTimeout(() => {
       const flyoutSublist = parent.getElementsByClassName(
-        'lui-flyout-sublist'
+        "lui-flyout-sublist"
       )[0];
-      const topScroll = el.closest('.lui-fd-side-nav-wrapper').scrollTop;
+      const topScroll = el.closest(".lui-fd-side-nav-wrapper").scrollTop;
       const topPosition = parentTopPosition + shellbarHeight - topScroll;
       const bottomPosition =
         containerHeight -
@@ -430,10 +508,10 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
         shellbarHeight;
 
       if (topPosition + flyoutSublist.offsetHeight >= containerHeight) {
-        flyoutSublist.style.bottom = bottomPosition + 'px';
-        flyoutSublist.className += ' has-bottom-position';
+        flyoutSublist.style.bottom = bottomPosition + "px";
+        flyoutSublist.className += " has-bottom-position";
       } else {
-        flyoutSublist.style.top = topPosition - shellbarHeight + 'px';
+        flyoutSublist.style.top = topPosition - shellbarHeight + "px";
       }
     });
   }
@@ -448,7 +526,7 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
 
   export function handleKey(event) {
     const code = event.code;
-    if (code === 'ArrowRight') {
+    if (code === "ArrowRight") {
       const iframe = IframeHelpers.getCurrentMicrofrontendIframe();
       if (iframe && iframe.contentWindow) {
         iframe.contentWindow.focus();
@@ -476,8 +554,8 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
 
   function semiCollapsibleButtonClicked(el) {
     isSemiCollapsed = SemiCollapsibleNavigation.buttonClicked();
-    if (document.getElementsByClassName('fd-tabs').length > 0) {
-      dispatch('resizeTabNav', {});
+    if (document.getElementsByClassName("fd-tabs").length > 0) {
+      dispatch("resizeTabNav", {});
     }
     setBurgerTooltip();
   }
@@ -486,17 +564,24 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
     if (!NavigationHelpers.getBurgerTooltipConfig()) {
       return;
     }
-    const [collapseNavTooltip, expandNavTooltip] = NavigationHelpers.getBurgerTooltipConfig();
-    const hasSemiCollapsible = document.body.classList.contains('lui-semiCollapsible');
+    const [
+      collapseNavTooltip,
+      expandNavTooltip
+    ] = NavigationHelpers.getBurgerTooltipConfig();
+    const hasSemiCollapsible = document.body.classList.contains(
+      "lui-semiCollapsible"
+    );
     if (collapseNavTooltip && expandNavTooltip && hasSemiCollapsible) {
-      burgerTooltip = document.body.classList.contains('semiCollapsed') ? collapseNavTooltip : expandNavTooltip;
+      burgerTooltip = document.body.classList.contains("semiCollapsed")
+        ? collapseNavTooltip
+        : expandNavTooltip;
     }
   }
 </script>
 
 <style type="text/scss">
-  @import 'styles/mixins';
-  @import 'styles/variables';
+  @import "styles/mixins";
+  @import "styles/variables";
 
   :root {
     /* needed for IE11 support */
@@ -777,7 +862,7 @@ <h5 class="lui-flyout-sublist__title fd-has-type-minus-1 fd-has-color-text-4">{$
         display: block;
         position: absolute;
         top: 13px;
-        content: '';
+        content: "";
         width: 13px;
         border-style: solid;
         border-width: 8px 6.5px;
diff --git a/core/src/navigation/LogoTitle.html b/core/src/navigation/LogoTitle.html
index 6fae9f09b6..ef86c2c913 100644
--- a/core/src/navigation/LogoTitle.html
+++ b/core/src/navigation/LogoTitle.html
@@ -4,20 +4,16 @@
   on:click="{() => goTo('/')}"
 >
   {#if hasLogo}
-  <img
-    data-testid="luigi-topnav-logo"
-    bind:this="{logo}"
-    alt="SAP"
-  >
+  <img data-testid="luigi-topnav-logo" bind:this="{logo}" alt="SAP" />
   {/if}
 </span>
-{#if title}
-{#if !hasApps}
+{#if title} {#if !hasApps}
 <span
   class="fd-shellbar__title lui-shellbar-single-app-title"
   data-testid="luigi-topnav-title"
   on:click="{() => goTo('/')}"
->{$getTranslation(title)}</span>
+  >{$getTranslation(title)}</span
+>
 {:else}
 <div class="fd-popover">
   <div class="fd-popover__control" on:click|stopPropagation="{() => {}}">
@@ -28,10 +24,9 @@
       on:click|stopPropagation="{() => toggleDropdownState('appSwitcherPopover')}"
       data-testid="app-switcher"
     >
-      <span
-        class="fd-shellbar__title"
-        data-testid="luigi-topnav-title"
-      >{$getTranslation(title)}</span>
+      <span class="fd-shellbar__title" data-testid="luigi-topnav-title"
+        >{$getTranslation(title)}</span
+      >
       <i class="sap-icon sap-icon--megamenu fd-shellbar__button--icon"></i>
     </button>
   </div>
@@ -54,10 +49,9 @@
             <span class="fd-menu__title">{$getTranslation(defaultTitle)}</span>
           </a>
         </li>
-        {/if}
-        {#if appSwitcherItems && appSwitcherItems.length > 0}
-        {#each appSwitcherItems as item}
-        {#if item !== selectedItem && hasValidLink(item, pathParams)}
+        {/if} {#if appSwitcherItems && appSwitcherItems.length > 0} {#each
+        appSwitcherItems as item} {#if item !== selectedItem &&
+        hasValidLink(item, pathParams)}
         <li class="fd-menu__item">
           <a
             role="button"
@@ -69,28 +63,24 @@
             <span class="fd-menu__title">{$getTranslation(item.title)}</span>
           </a>
         </li>
-        {/if}
-        {/each}
-        {/if}
+        {/if} {/each} {/if}
       </ul>
     </nav>
   </div>
 </div>
-{/if}
-{#if subTitle}
+{/if} {#if subTitle}
 <div class="fd-shellbar__subtitle">{$getTranslation(subTitle)}</div>
-{/if}
-{/if}
+{/if} {/if}
 <script>
   import {
     beforeUpdate,
     createEventDispatcher,
     onMount,
     getContext
-  } from 'svelte';
-  import * as Header from './services/header';
-  import { Routing } from '../services/routing';
-  import { NavigationHelpers, RoutingHelpers } from '../utilities/helpers';
+  } from "svelte";
+  import * as Header from "./services/header";
+  import { Routing } from "../services/routing";
+  import { NavigationHelpers, RoutingHelpers } from "../utilities/helpers";
 
   const dispatch = createEventDispatcher();
 
@@ -109,10 +99,10 @@
   export let pathData;
   let previousPathData;
   let getUnsavedChangesModalPromise = getContext(
-    'getUnsavedChangesModalPromise'
+    "getUnsavedChangesModalPromise"
   );
-  let getTranslation = getContext('getTranslation');
-  let store = getContext('store');
+  let getTranslation = getContext("getTranslation");
+  let store = getContext("store");
 
   //TODO refactor
   const getComponentWrapper = () => {
@@ -136,29 +126,29 @@
       set: obj => {
         if (obj) {
           Object.getOwnPropertyNames(obj).forEach(prop => {
-            if (prop === 'pathData') {
+            if (prop === "pathData") {
               pathData = obj.pathData;
-            } else if (prop === 'appSwitcherItems') {
+            } else if (prop === "appSwitcherItems") {
               appSwitcherItems = obj.appSwitcherItems;
-            } else if (prop === 'pathParams') {
+            } else if (prop === "pathParams") {
               pathParams = obj.pathParams;
-            } else if (prop === 'selectedItem') {
+            } else if (prop === "selectedItem") {
               selectedItem = obj.selectedItem;
-            } else if (prop === 'title') {
+            } else if (prop === "title") {
               title = obj.title;
-            } else if (prop === 'defaultSubTitle') {
+            } else if (prop === "defaultSubTitle") {
               defaultSubTitle = obj.defaultSubTitle;
-            } else if (prop === 'subTitle') {
+            } else if (prop === "subTitle") {
               subTitle = obj.subTitle;
-            } else if (prop === 'defaultTitle') {
+            } else if (prop === "defaultTitle") {
               defaultTitle = obj.defaultTitle;
-            } else if (prop === 'subTitle') {
+            } else if (prop === "subTitle") {
               subTitle = obj.subTitle;
-            } else if (prop === 'showMainAppEntry') {
+            } else if (prop === "showMainAppEntry") {
               showMainAppEntry = obj.showMainAppEntry;
-            } else if (prop === 'hasApps') {
+            } else if (prop === "hasApps") {
               hasApps = obj.hasApps;
-            } else if (prop === 'hasLogo') {
+            } else if (prop === "hasLogo") {
               hasLogo = obj.hasLogo;
             }
           });
@@ -187,17 +177,17 @@
 
   export function goToRoot() {
     getUnsavedChangesModalPromise().then(() => {
-      Routing.navigateTo('/');
+      Routing.navigateTo("/");
     });
   }
 
   export function handleClick(node) {
-    dispatch('handleClick', { node });
-    toggleDropdownState('appSwitcherPopover');
+    dispatch("handleClick", { node });
+    toggleDropdownState("appSwitcherPopover");
   }
 
   export function toggleDropdownState(name) {
-    dispatch('toggleDropdownState', { name });
+    dispatch("toggleDropdownState", { name });
   }
 
   function getTestId(item) {
@@ -213,8 +203,8 @@
         pathParams
       );
       if (
-        concreteLink.indexOf(':') !== 0 &&
-        concreteLink.indexOf('/:') === -1
+        concreteLink.indexOf(":") !== 0 &&
+        concreteLink.indexOf("/:") === -1
       ) {
         return true;
       }
@@ -228,7 +218,7 @@
 </script>
 
 <style type="text/scss">
-  @import 'styles/variables';
+  @import "styles/variables";
 
   // Force height because of base64 img src
   .lui-customlogo img {
diff --git a/core/src/navigation/MobileTopNavDropDown.html b/core/src/navigation/MobileTopNavDropDown.html
index 7544bf58e4..d506dc4b99 100644
--- a/core/src/navigation/MobileTopNavDropDown.html
+++ b/core/src/navigation/MobileTopNavDropDown.html
@@ -10,8 +10,7 @@ <h3 class="fd-dialog__title">{label}</h3>
     <div class="fd-dialog__body fd-dialog__body--no-vertical-padding">
       <div class="fd-product-switch__body fd-product-switch__body--mobile">
         <ul class="fd-product-switch__list">
-          {#if nodes}
-          {#each nodes as node}
+          {#if nodes} {#each nodes as node}
           <li
             class="fd-product-switch__item {noSubTitle == 'true' ? 'y-has-no-subtitle' : '' } {node.selected?'selected':''}"
             on:click="{() => onActionClick(node)}"
@@ -24,22 +23,20 @@ <h3 class="fd-dialog__title">{label}</h3>
                 class="sap-icon {node.icon && hasOpenUIicon(node) ? 'sap-icon--' + node.icon : '' }"
               ></i>
               {:else}
-              <img
-                src="{node.icon}"
-                alt="{node.altText ? node.altText : ''}"
-              >
+              <img src="{node.icon}" alt="{node.altText ? node.altText : ''}" />
               {/if}
-              <BadgeCounter {node}/>
+              <BadgeCounter {node} />
             </div>
             <div class="fd-product-switch__text">
               <div class="fd-product-switch__title">{getNodeLabel(node)}</div>
               {#if getNodeSubtitle(node)}
-              <div class="fd-product-switch__subtitle">{getNodeSubtitle(node)}</div>
+              <div class="fd-product-switch__subtitle">
+                {getNodeSubtitle(node)}
+              </div>
               {/if}
             </div>
           </li>
-          {/each}
-          {/if}
+          {/each} {/if}
         </ul>
       </div>
     </div>
@@ -50,7 +47,9 @@ <h3 class="fd-dialog__title">{label}</h3>
             class="fd-button fd-button--light fd-dialog__decisive-button"
             on:click
             data-testid="mobile-topnav-close"
-          >Cancel</button>
+          >
+            Cancel
+          </button>
         </div>
       </div>
     </footer>
@@ -58,8 +57,8 @@ <h3 class="fd-dialog__title">{label}</h3>
 </div>
 
 <script>
-  import BadgeCounter from './BadgeCounter.html';
-  import { createEventDispatcher } from 'svelte';
+  import BadgeCounter from "./BadgeCounter.html";
+  import { createEventDispatcher } from "svelte";
 
   const dispatch = createEventDispatcher();
 
@@ -74,7 +73,7 @@ <h3 class="fd-dialog__title">{label}</h3>
   // [svelte-upgrade suggestion]
   // review these functions and remove unnecessary 'export' keywords
   export function onActionClick(value) {
-    dispatch('listClick', value);
+    dispatch("listClick", value);
   }
 </script>
 
diff --git a/core/src/navigation/ProductSwitcher.html b/core/src/navigation/ProductSwitcher.html
index 818593983f..77f3d94ecf 100644
--- a/core/src/navigation/ProductSwitcher.html
+++ b/core/src/navigation/ProductSwitcher.html
@@ -1,4 +1,4 @@
-<svelte:window on:resize="{setViewportHeightVariable}"/>
+<svelte:window on:resize="{setViewportHeightVariable}" />
 {#if productSwitcherItems && productSwitcherItems.length &&
 Object.keys(productSwitcherItems[0]).length }
 <!-- DESKTOP VERSION (popover): -->
@@ -19,14 +19,12 @@
         >
           <div class="lui-product-switch__icon">
             {#if hasOpenUIicon(config)}
-            <i
-              class="sap-icon sap-icon--{config.icon}"
-            ></i>
+            <i class="sap-icon sap-icon--{config.icon}"></i>
             {:else}
             <img
               src="{config.icon}"
               alt="{config.altText ? config.altText : ''}"
-            >
+            />
             {/if}
           </div>
         </button>
@@ -38,8 +36,8 @@
       >
         <div class="{columnsClass}">
           <ul class="fd-product-switch__list">
-            {#each productSwitcherItems as productSwitcherItem}
-            {#if productSwitcherItem.label}
+            {#each productSwitcherItems as productSwitcherItem} {#if
+            productSwitcherItem.label}
             <li
               class="fd-product-switch__item {productSwitcherItem.selected?'selected':''}"
               on:click="{() => onActionClick(productSwitcherItem)}"
@@ -54,22 +52,21 @@
                 <img
                   src="{productSwitcherItem.icon}"
                   alt="{productSwitcherItem.altText ? productSwitcherItem.altText : ''}"
-                >
+                />
                 {/if}
               </div>
               <div class="fd-product-switch__text">
-                <div
-                  class="fd-product-switch__title"
-                >{getNodeLabel(productSwitcherItem)}</div>
+                <div class="fd-product-switch__title">
+                  {getNodeLabel(productSwitcherItem)}
+                </div>
                 {#if getNodeSubtitle(productSwitcherItem)}
-                <div
-                  class="fd-product-switch__subtitle"
-                >{getNodeSubtitle(productSwitcherItem)}</div>
+                <div class="fd-product-switch__subtitle">
+                  {getNodeSubtitle(productSwitcherItem)}
+                </div>
                 {/if}
               </div>
             </li>
-            {/if}
-            {/each}
+            {/if} {/each}
           </ul>
         </div>
       </div>
@@ -89,15 +86,14 @@
   {getNodeSubtitle}
   {getTestId}
 />
-{/if}
-{/if}
+{/if} {/if}
 <script>
-  import MobileTopNav from './MobileTopNavDropDown.html';
-  import { createEventDispatcher, onMount, getContext } from 'svelte';
-  import { LuigiConfig, LuigiI18N } from '../core-api';
-  import { Routing } from '../services/routing';
-  import { StateHelpers } from '../utilities/helpers';
-  import { NavigationHelpers } from '../utilities/helpers';
+  import MobileTopNav from "./MobileTopNavDropDown.html";
+  import { createEventDispatcher, onMount, getContext } from "svelte";
+  import { LuigiConfig, LuigiI18N } from "../core-api";
+  import { Routing } from "../services/routing";
+  import { StateHelpers } from "../utilities/helpers";
+  import { NavigationHelpers } from "../utilities/helpers";
 
   const dispatch = createEventDispatcher();
 
@@ -106,9 +102,9 @@
   export let config;
   export let dropDownStates;
 
-  let store = getContext('store');
+  let store = getContext("store");
   let getUnsavedChangesModalPromise = getContext(
-    'getUnsavedChangesModalPromise'
+    "getUnsavedChangesModalPromise"
   );
   let columnsClass;
 
@@ -119,13 +115,13 @@
         config = NavigationHelpers.getProductSwitcherConfig();
         if (config) {
           productSwitcherItems = await LuigiConfig.getConfigValueAsync(
-            'navigation.productSwitcher.items'
+            "navigation.productSwitcher.items"
           );
           setColumnsClass();
         }
         setViewportHeightVariable();
       },
-      ['navigation.productSwitcher']
+      ["navigation.productSwitcher"]
     );
   });
 
@@ -143,14 +139,14 @@
   }
 
   export function toggleDropdownState() {
-    dispatch('toggleDropdownState');
+    dispatch("toggleDropdownState");
   }
 
   export function setViewportHeightVariable() {
     // get the viewport height and multiple it by 1% to get a value for a vh unit
     let vh = window.innerHeight * 0.01;
     // set the value in the --vh custom property to the root of the document
-    document.documentElement.style.setProperty('--vh', `${vh}px`);
+    document.documentElement.style.setProperty("--vh", `${vh}px`);
   }
 
   function hasOpenUIicon(node) {
@@ -168,9 +164,9 @@
   function setColumnsClass() {
     const columns = NavigationHelpers.getProductSwitcherColumnsNumber();
     if (columns === 3) {
-      columnsClass = 'fd-product-switch__body fd-product-switch__body--col-3';
+      columnsClass = "fd-product-switch__body fd-product-switch__body--col-3";
     } else {
-      columnsClass = 'fd-product-switch__body';
+      columnsClass = "fd-product-switch__body";
     }
   }
 
@@ -186,7 +182,7 @@
     img {
       max-height: 24px;
     }
-    [class*='sap-icon'] {
+    [class*="sap-icon"] {
       color: var(--sapShell_InteractiveTextColor, #d1e8ff);
     }
   }
diff --git a/core/src/navigation/TabNav.html b/core/src/navigation/TabNav.html
index 69cd1507d8..d66ae99371 100644
--- a/core/src/navigation/TabNav.html
+++ b/core/src/navigation/TabNav.html
@@ -12,11 +12,9 @@
 >
   <div class="tabsContainerWrapper">
     <div class="tabsContainer luigi-tabsContainer">
-      {#each Object.entries(children) as [key, nodes], index}
-      {#if key === 'undefined' || key.indexOf(virtualGroupPrefix) === 0}
-      {#each nodes as node, index2}
-      {#if !node.hideFromNav}
-      {#if node.label}
+      {#each Object.entries(children) as [key, nodes], index} {#if key ===
+      'undefined' || key.indexOf(virtualGroupPrefix) === 0} {#each nodes as
+      node, index2} {#if !node.hideFromNav} {#if node.label}
       <span
         class="fd-tabs__item"
         uid="{index}-{index2}"
@@ -32,10 +30,7 @@
           <span class="fd-tabs__tag">{$getTranslation(node.label)}</span>
         </a>
       </span>
-      {/if}
-      {/if}
-      {/each}
-      {:else}
+      {/if} {/if} {/each} {:else}
       <span
         class="fd-tabs__item"
         uid="{index}-0"
@@ -61,9 +56,7 @@
           >
             <nav class="fd-menu">
               <ul class="fd-menu__list fd-menu__list--no-shadow">
-                {#each nodes as node}
-                {#if !node.hideFromNav}
-                {#if node.label}
+                {#each nodes as node} {#if !node.hideFromNav} {#if node.label}
                 <li class="fd-menu__item">
                   <a
                     href="{getRouteLink(node)}"
@@ -71,19 +64,18 @@
                     on:click|preventDefault="{() => handleClick(node)}"
                     aria-selected="{node === selectedNodeForTabNav}"
                   >
-                    <span class="fd-menu__title">{$getTranslation(node.label)}</span>
+                    <span class="fd-menu__title"
+                      >{$getTranslation(node.label)}</span
+                    >
                   </a>
                 </li>
-                {/if}
-                {/if}
-                {/each}
+                {/if} {/if} {/each}
               </ul>
             </nav>
           </div>
         </div>
       </span>
-      {/if}
-      {/each}
+      {/if} {/each}
     </div>
   </div>
 
@@ -106,9 +98,9 @@
           <ul
             class="fd-nested-list fd-nested-list--compact fd-nested-list--text-only"
           >
-            {#each Object.entries(children) as [key, nodes], index}
-            {#if key === 'undefined' || key.indexOf(virtualGroupPrefix) === 0}
-            {#each nodes as node, index2}
+            {#each Object.entries(children) as [key, nodes], index} {#if key ===
+            'undefined' || key.indexOf(virtualGroupPrefix) === 0} {#each nodes
+            as node, index2}
             <li class="fd-nested-list__item" uid="{index}-{index2}">
               <a
                 href="{getRouteLink(node)}"
@@ -116,13 +108,12 @@
                 on:click|preventDefault="{() => handleClick(node)}"
                 aria-selected="{node===selectedNodeForTabNav}"
               >
-                <span
-                  class="fd-nested-list__title"
-                >{$getTranslation(node.label)}</span>
+                <span class="fd-nested-list__title"
+                  >{$getTranslation(node.label)}</span
+                >
               </a>
             </li>
-            {/each}
-            {:else}
+            {/each} {:else}
             <li class="fd-nested-list__item" uid="{index}-0">
               <div class="fd-nested-list__content has-child" tabindex="0">
                 <a
@@ -135,7 +126,9 @@
                   aria-selected="{isSelectedCat(key,selectedNodeForTabNav)}"
                   on:click|preventDefault="{() => toggleDropdownState(key+index)}"
                 >
-                  <span class="fd-nested-list__title">{$getTranslation(key)}</span>
+                  <span class="fd-nested-list__title"
+                    >{$getTranslation(key)}</span
+                  >
                 </a>
                 <button
                   class="fd-button fd-nested-list__button"
@@ -167,16 +160,15 @@
                     on:click|preventDefault="{() => handleClick(node)}"
                     aria-selected="{node===selectedNodeForTabNav}"
                   >
-                    <span
-                      class="fd-nested-list__title"
-                    >{$getTranslation(node.label)}</span>
+                    <span class="fd-nested-list__title"
+                      >{$getTranslation(node.label)}</span
+                    >
                   </a>
                 </li>
                 {/each}
               </ul>
             </li>
-            {/if}
-            {/each}
+            {/if} {/each}
           </ul>
         </div>
       </div>
@@ -190,10 +182,10 @@
     createEventDispatcher,
     onMount,
     getContext
-  } from 'svelte';
-  import { Navigation } from './services/navigation';
-  import { NavigationHelpers, RoutingHelpers } from '../utilities/helpers';
-  import { LuigiConfig, LuigiI18N } from '../core-api';
+  } from "svelte";
+  import { Navigation } from "./services/navigation";
+  import { NavigationHelpers, RoutingHelpers } from "../utilities/helpers";
+  import { LuigiConfig, LuigiI18N } from "../core-api";
 
   export let children;
   export let pathData;
@@ -207,7 +199,7 @@
   export let isMoreBtnExpanded = false;
   export let resizeTabNavToggle;
   let previousResizeTabNavToggle;
-  let getTranslation = getContext('getTranslation');
+  let getTranslation = getContext("getTranslation");
 
   //TODO refactor
   const __this = {
@@ -224,15 +216,15 @@
     set: obj => {
       if (obj) {
         Object.getOwnPropertyNames(obj).forEach(prop => {
-          if (prop === 'pathData') {
+          if (prop === "pathData") {
             pathData = obj.pathData;
-          } else if (prop === 'context') {
+          } else if (prop === "context") {
             context = obj.context;
-          } else if (prop === 'children') {
+          } else if (prop === "children") {
             children = obj.children;
-          } else if (prop === 'selectedNode') {
+          } else if (prop === "selectedNode") {
             selectedNode = obj.selectedNode;
-          } else if (prop === 'selectedNodeForTabNav') {
+          } else if (prop === "selectedNodeForTabNav") {
             selectedNodeForTabNav = obj.selectedNodeForTabNav;
           }
         });
@@ -254,17 +246,17 @@
     }
     __this.set({ ...tabNavData });
     previousPathData = pathData;
-    window['LEFTNAVDATA'] = tabNavData.groupedChildren;
+    window["LEFTNAVDATA"] = tabNavData.groupedChildren;
     setTimeout(calcTabsContainer);
   };
 
   const calcTabsContainer = () => {
     clearTapNav();
     let tabsContainer = document.getElementsByClassName(
-      'luigi-tabsContainer'
+      "luigi-tabsContainer"
     )[0];
-    let morebtn = document.getElementsByClassName('luigi-tabsMoreButton')[0];
-    let moreLink = document.getElementsByClassName('luigi__more')[0];
+    let morebtn = document.getElementsByClassName("luigi-tabsMoreButton")[0];
+    let moreLink = document.getElementsByClassName("luigi__more")[0];
     let moreBtnSelected = false;
     let tabsContainerOffsetWidth;
     let totalTabsSize = 0;
@@ -273,7 +265,7 @@
     let current = componentData.pathData[componentData.pathData.length - 1];
     let style;
     let margin;
-    moreLink && moreLink.setAttribute('aria-selected', 'false');
+    moreLink && moreLink.setAttribute("aria-selected", "false");
     if (tabsContainer) {
       tabsContainerOffsetWidth = tabsContainer.offsetWidth;
       let tabs = [...tabsContainer.children];
@@ -281,44 +273,44 @@
         style = element.currentStyle || window.getComputedStyle(element);
         margin = parseFloat(style.marginLeft) + parseFloat(style.marginRight);
         totalTabsSize += element.offsetWidth + margin;
-        let uid = element.getAttribute('uid');
+        let uid = element.getAttribute("uid");
         if (totalTabsSize >= tabsContainerOffsetWidth) {
-          element.classList.add('hide_element');
-          if (element.getAttribute('isSelected') === 'true') {
-            moreLink.setAttribute('aria-selected', 'true');
+          element.classList.add("hide_element");
+          if (element.getAttribute("isSelected") === "true") {
+            moreLink.setAttribute("aria-selected", "true");
           }
           document
             .querySelector('li[uid="' + uid + '"]')
-            .classList.remove('hide_element');
+            .classList.remove("hide_element");
           hasMoreBtnElements = true;
         } else {
           document
             .querySelector('li[uid="' + uid + '"]')
-            .classList.add('hide_element');
+            .classList.add("hide_element");
         }
       });
       !hasMoreBtnElements
-        ? morebtn.classList.add('hide_element')
-        : morebtn.classList.remove('hide_element');
+        ? morebtn.classList.add("hide_element")
+        : morebtn.classList.remove("hide_element");
     }
   };
 
   const clearTapNav = () => {
     let tabsContainer = document.getElementsByClassName(
-      'luigi-tabsContainer'
+      "luigi-tabsContainer"
     )[0];
-    let moreLink = document.getElementsByClassName('luigi__more')[0];
+    let moreLink = document.getElementsByClassName("luigi__more")[0];
     if (tabsContainer !== undefined) {
       const tabs = [...tabsContainer.children];
       tabs.forEach(element => {
-        element.classList.remove('hide_element');
+        element.classList.remove("hide_element");
       });
     }
   };
 
   onMount(() => {
     hideNavComponent = LuigiConfig.getConfigBooleanValue(
-      'settings.hideNavigation'
+      "settings.hideNavigation"
     );
   });
 
@@ -365,7 +357,7 @@
   // review these functions and remove unnecessary 'export' keywords
   export function handleClick(node) {
     closeAllDropdowns();
-    dispatch('handleClick', { node });
+    dispatch("handleClick", { node });
   }
 
   export function toggleDropdownState(name) {
@@ -391,8 +383,8 @@
 </script>
 
 <style type="text/scss">
-  @import 'styles/mixins';
-  @import 'styles/variables';
+  @import "styles/mixins";
+  @import "styles/variables";
 
   .tabsContainer {
     width: 100%;
diff --git a/core/src/navigation/TopNav.html b/core/src/navigation/TopNav.html
index 9c202668e6..9583f732e7 100644
--- a/core/src/navigation/TopNav.html
+++ b/core/src/navigation/TopNav.html
@@ -1,11 +1,12 @@
-<svelte:window on:click="{closeAllDropdowns}" on:blur="{closeAllDropdowns}"/>
+<svelte:window on:click="{closeAllDropdowns}" on:blur="{closeAllDropdowns}" />
 {#if showTopNav}
 <div
   class="fd-shellbar {hideNavComponent ? 'hideNavComponent' : ''}"
   tabindex="0"
 >
   <div class="fd-shellbar__group fd-shellbar__group--product">
-    {#if responsiveNavSetting==="simple" || responsiveNavSetting==="simpleMobileOnly" ||
+    {#if responsiveNavSetting==="simple" ||
+    responsiveNavSetting==="simpleMobileOnly" ||
     responsiveNavSetting==="Fiori3"}
     <button
       class="fd-shellbar__button fd-button lui-burger"
@@ -25,8 +26,7 @@
     />
   </div>
   <div class="fd-shellbar__group fd-shellbar__group--actions">
-    {#if !authorizationEnabled || isLoggedIn}
-    {#if isGlobalSearchAvailable}
+    {#if !authorizationEnabled || isLoggedIn} {#if isGlobalSearchAvailable}
     <GlobalSearch
       bind:isSearchFieldVisible
       on:toggleSearch
@@ -44,11 +44,8 @@
       on:toggleDropdownState="{() => toggleDropdownState('contextSwitcherPopover')}"
       isMobile="{false}"
     />
-    {/if}
-    {#if children && pathData.length > 0}
-    {#each children as node, i}
-    {#if !(node.hideFromNav || (showGlobalNav && node.globalNav))}
-    {#if node.isCat}
+    {/if} {#if children && pathData.length > 0} {#each children as node, i} {#if
+    !(node.hideFromNav || (showGlobalNav && node.globalNav))} {#if node.isCat}
     <div
       class="fd-shellbar__action fd-shellbar__action--hide fd-shellbar__action--desktop"
     >
@@ -63,8 +60,7 @@
             on:click="{() => toggleDropdownState(`dropDownPopover-${i}`)}"
             data-testid="{getTestId(node)}"
           >
-            {#if node.icon}
-            {#if hasOpenUIicon(node)}
+            {#if node.icon} {#if hasOpenUIicon(node)}
             <span
               class="sap-icon sap-icon--{node.icon} fd-top-nav__icon"
             ></span>
@@ -73,7 +69,7 @@
               class="fd-top-nav__icon nav-icon"
               src="{node.icon}"
               alt="{node.altText ? node.altText : ''}"
-            >
+            />
             {/if}
             <!-- end hasOpenUIicon-->
             {/if}
@@ -81,7 +77,7 @@
             {#if !node.icon || node.showLabel}
             <span>{getNodeLabel(node)}</span>
             {/if}
-            <BadgeCounter {node}/>
+            <BadgeCounter {node} />
           </button>
         </div>
         <div
@@ -109,17 +105,14 @@
         on:click="{() => handleClick(node)}"
         data-testid="{getTestId(node)}"
       >
-        {#if node.icon}
-        {#if hasOpenUIicon(node)}
-        <span
-          class="fd-top-nav__icon sap-icon sap-icon--{node.icon}"
-        ></span>
+        {#if node.icon} {#if hasOpenUIicon(node)}
+        <span class="fd-top-nav__icon sap-icon sap-icon--{node.icon}"></span>
         {:else}
         <img
           class="fd-top-nav__icon nav-icon"
           src="{node.icon}"
           alt="{node.altText ? node.altText : ''}"
-        >
+        />
         {/if}
         <!-- end hasOpenUIicon-->
         {/if}
@@ -127,12 +120,10 @@
         {#if !node.icon || node.showLabel}
         <span>{getNodeLabel(node)}</span>
         {/if}
-        <BadgeCounter {node}/>
+        <BadgeCounter {node} />
       </button>
     </div>
-    {/if}
-    {/if}
-    {/each}
+    {/if} {/if} {/each}
     <!-- Sample Markup for Notifications
             <div class="fd-shellbar__action fd-shellbar__action--desktop">
               <button class="fd-shellbar__button fd-button sap-icon--bell" aria-label="Notifications">
@@ -142,7 +133,8 @@
     -->
 
     <!-- dropdown for top nav nodes on smaller screens -->
-    {#if (visibleNodeCount - globalNavNodeCount > 0) || isProductSwitcherAvailable || contextSwitcherConfig}
+    {#if (visibleNodeCount - globalNavNodeCount > 0) ||
+    isProductSwitcherAvailable || contextSwitcherConfig}
     <div class="fd-shellbar__action fd-shellbar__action--mobile">
       <div class="fd-shellbar-collapse">
         <div class="fd-popover fd-popover--right">
@@ -166,7 +158,7 @@
                 data-testid="mobile-menu"
               >
                 <i class="sap-icon sap-icon--overflow"></i>
-                <BadgeCounter node="{totalBadgeNode}" special="true"/>
+                <BadgeCounter node="{totalBadgeNode}" special="true" />
               </button>
             </div>
           </div>
@@ -188,8 +180,8 @@
                     <span class="fd-menu__title">Search</span>
                   </a>
                 </li>
-                {/if}
-                {#if contextSwitcherConfig && (!authorizationEnabled || isLoggedIn)}
+                {/if} {#if contextSwitcherConfig && (!authorizationEnabled ||
+                isLoggedIn)}
                 <li class="fd-menu__item">
                   <a
                     class="fd-menu__link"
@@ -198,15 +190,14 @@
                     <i
                       class="sap-icon fd-top-nav__icon {contextSwitcherConfig.icon && hasOpenUIicon(contextSwitcherConfig) ? 'sap-icon--' + contextSwitcherConfig.icon : 'sap-icon--switch-views'}"
                     ></i>
-                    <span
-                      class="fd-menu__title"
-                    >{selectedLabel ? selectedLabel : defaultLabelContextSwitcher}</span>
+                    <span class="fd-menu__title"
+                      >{selectedLabel ? selectedLabel :
+                      defaultLabelContextSwitcher}</span
+                    >
                   </a>
                 </li>
-                {/if}
-                {#each children as node,i}
-                {#if !(node.hideFromNav || (showGlobalNav && node.globalNav))}
-                {#if !node.isCat}
+                {/if} {#each children as node,i} {#if !(node.hideFromNav ||
+                (showGlobalNav && node.globalNav))} {#if !node.isCat}
                 <li class="fd-menu__item">
                   <a
                     href="{getRouteLink(node)}"
@@ -221,9 +212,9 @@
                       <img
                         src="{node.icon}"
                         alt="{node.altText ? node.altText : ''}"
-                      >
+                      />
                       {/if}
-                      <BadgeCounter {node}/>
+                      <BadgeCounter {node} />
                     </span>
                     <span class="fd-menu__title">{getNodeLabel(node)}</span>
                   </a>
@@ -246,9 +237,9 @@
                       <img
                         src="{node.icon}"
                         alt="{node.altText ? node.altText : ''}"
-                      >
+                      />
                       {/if}
-                      <BadgeCounter {node}/>
+                      <BadgeCounter {node} />
                     </span>
                     <span class="fd-list__title">{getNodeLabel(node)}</span>
                   </a>
@@ -276,17 +267,15 @@
                   </a>
                 </li>-->
                 <!-- {/if} -->
-                {/if}
-                {/if}
-                {/each}
-                {#if isProductSwitcherAvailable}
+                {/if} {/if} {/each} {#if isProductSwitcherAvailable}
                 <li class="fd-menu__item">
                   <a
                     class="fd-menu__link"
                     on:click|stopPropagation="{openMobileProductSwitcher}"
                     data-testid="mobile-product-switcher"
                   >
-                    {#if hasOpenUIicon(productSwitcherConfig) || !productSwitcherConfig.icon}
+                    {#if hasOpenUIicon(productSwitcherConfig) ||
+                    !productSwitcherConfig.icon}
                     <i
                       class="fd-top-nav__icon sap-icon sap-icon--{productSwitcherConfig.icon || 'grid'}"
                     ></i>
@@ -295,12 +284,12 @@
                       <img
                         src="{productSwitcherConfig.icon}"
                         alt="{productSwitcherConfig.altText ? productSwitcherConfig.altText : ''}"
-                      >
+                      />
                     </span>
                     {/if}
-                    <span
-                      class="fd-menu__title"
-                    >{productSwitcherConfig.label}</span>
+                    <span class="fd-menu__title"
+                      >{productSwitcherConfig.label}</span
+                    >
                   </a>
                 </li>
                 {/if}
@@ -313,16 +302,14 @@
             on:toggleDropdownState="{() => toggleDropdownState('productSwitcherPopover')}"
             isMobile="{true}"
           />
-          {/if}
-          {#if openMobileDropDown}
+          {/if} {#if openMobileDropDown}
           <TopNavDropDown
             node="{nodeForMobile}"
             isMobile="{true}"
             on:close="{closeMobileTopNavDropDown}"
             pathParams="{pathParams}"
           />
-          {/if}
-          {#if !authorizationEnabled || isLoggedIn}
+          {/if} {#if !authorizationEnabled || isLoggedIn}
           <ContextSwitcher
             bind:dropDownStates
             on:toggleDropdownState="{() => toggleDropdownState('contextSwitcherPopover')}"
@@ -335,8 +322,7 @@
         </div>
       </div>
     </div>
-    {/if}
-    {/if}
+    {/if} {/if}
     <!-- closes {#if children && pathData.length > 0} -->
     {#if authorizationEnabled || profileItemsAvailable}
     <div
@@ -387,8 +373,7 @@
         </div>
       </div>
     </div>
-    {/if}
-    {#if isProductSwitcherAvailable}
+    {/if} {#if isProductSwitcherAvailable}
     <ProductSwitcher
       bind:dropDownStates
       on:toggleDropdownState="{() => toggleDropdownState('productSwitcherPopover')}"
@@ -404,20 +389,20 @@
 />
 {/if}
 <script>
-  import LogoTitle from './LogoTitle.html';
-  import BadgeCounter from './BadgeCounter.html';
-  import Authorization from '../Authorization.html';
-  import TopNavDropDown from '../TopNavDropDown.html';
-  import ContextSwitcher from './ContextSwitcher.html';
-  import ProductSwitcher from './ProductSwitcher.html';
-  import GlobalSearch from './GlobalSearch.html';
+  import LogoTitle from "./LogoTitle.html";
+  import BadgeCounter from "./BadgeCounter.html";
+  import Authorization from "../Authorization.html";
+  import TopNavDropDown from "../TopNavDropDown.html";
+  import ContextSwitcher from "./ContextSwitcher.html";
+  import ProductSwitcher from "./ProductSwitcher.html";
+  import GlobalSearch from "./GlobalSearch.html";
   import {
     beforeUpdate,
     createEventDispatcher,
     onMount,
     getContext
-  } from 'svelte';
-  import { LuigiAuth, LuigiConfig, LuigiI18N } from '../core-api';
+  } from "svelte";
+  import { LuigiAuth, LuigiConfig, LuigiI18N } from "../core-api";
   import {
     AuthHelpers,
     NavigationHelpers,
@@ -425,8 +410,8 @@
     StateHelpers,
     EventListenerHelpers,
     GenericHelpers
-  } from '../utilities/helpers';
-  import { SemiCollapsibleNavigation } from './services/semi-collapsed-navigation';
+  } from "../utilities/helpers";
+  import { SemiCollapsibleNavigation } from "./services/semi-collapsed-navigation";
 
   const dispatch = createEventDispatcher();
 
@@ -461,12 +446,12 @@
   export let searchResult;
   export let burgerTooltip;
 
-  let store = getContext('store');
+  let store = getContext("store");
   let contextSwitcherToggle = false;
   let selectedLabel;
   let defaultLabelContextSwitcher;
   let contextSwitcherConfig = LuigiConfig.getConfigValue(
-    'navigation.contextSwitcher'
+    "navigation.contextSwitcher"
   );
   const setTopNavData = async () => {
     if (pathData && 0 < pathData.length) {
@@ -491,31 +476,31 @@
       () => {
         authorizationEnabled = LuigiAuth.isAuthorizationEnabled();
         profileItemsAvailable = LuigiConfig.getConfigValue(
-          'navigation.profile'
+          "navigation.profile"
         );
         autologinEnabled = !Boolean(
-          LuigiConfig.getConfigValue('auth.disableAutoLogin')
+          LuigiConfig.getConfigValue("auth.disableAutoLogin")
         );
         isProductSwitcherAvailable = LuigiConfig.getConfigValue(
-          'navigation.productSwitcher'
+          "navigation.productSwitcher"
         );
         hideNavComponent = LuigiConfig.getConfigBooleanValue(
-          'settings.hideNavigation'
+          "settings.hideNavigation"
         );
         responsiveNavSetting = LuigiConfig.getConfigValue(
-          'settings.responsiveNavigation'
+          "settings.responsiveNavigation"
         );
         productSwitcherConfig = NavigationHelpers.getProductSwitcherConfig();
-        isGlobalSearchAvailable = LuigiConfig.getConfigValue('globalSearch');
+        isGlobalSearchAvailable = LuigiConfig.getConfigValue("globalSearch");
         showGlobalNav =
-          LuigiConfig.getConfigBooleanValue('settings.globalSideNavigation') &&
-          GenericHelpers.requestExperimentalFeature('globalNav', true);
+          LuigiConfig.getConfigBooleanValue("settings.globalSideNavigation") &&
+          GenericHelpers.requestExperimentalFeature("globalNav", true);
       },
-      ['navigation']
+      ["navigation"]
     );
 
-    EventListenerHelpers.addEventListener('message', e => {
-      if ('luigi.navigation.update-badge-counters' === e.data.msg) {
+    EventListenerHelpers.addEventListener("message", e => {
+      if ("luigi.navigation.update-badge-counters" === e.data.msg) {
         setTopNavData();
       }
     });
@@ -552,12 +537,12 @@
   }
 
   export function openMobileProductSwitcher() {
-    toggleDropdownState('productSwitcherPopover');
+    toggleDropdownState("productSwitcherPopover");
   }
 
   export function openMobileContextSwitcher() {
     contextSwitcherToggle = !contextSwitcherToggle;
-    toggleDropdownState('contextSwitcherPopover');
+    toggleDropdownState("contextSwitcherPopover");
   }
 
   export function openMobileTopNavDropDown(node) {
@@ -570,11 +555,11 @@
   }
 
   export function handleClick(node) {
-    dispatch('handleClick', { node });
+    dispatch("handleClick", { node });
   }
 
   export function handleSearchNavigation(node) {
-    dispatch('handleSearchNavigation', { node });
+    dispatch("handleSearchNavigation", { node });
   }
 
   export function handleClickExternal(event) {
@@ -607,7 +592,7 @@
       setTimeout(() => {
         setFocusOnGlobalSearchFieldMobile();
       });
-    dispatch('toggleSearch', {
+    dispatch("toggleSearch", {
       isSearchFieldVisible,
       inputElem,
       luigiCustomSearchRenderer__slot
@@ -627,8 +612,8 @@
 
   function burgerClickHandler() {
     if (
-      responsiveNavSetting === 'simple' ||
-      responsiveNavSetting === 'simpleMobileOnly'
+      responsiveNavSetting === "simple" ||
+      responsiveNavSetting === "simpleMobileOnly"
     ) {
       simpleNav();
     } else {
@@ -646,13 +631,13 @@
       expandNavTooltip
     ] = NavigationHelpers.getBurgerTooltipConfig();
     if (collapseNavTooltip && expandNavTooltip) {
-      if (document.body.classList.contains('lui-simpleSlideInNav')) {
-        burgerTooltip = document.body.classList.contains('lui-leftNavToggle')
+      if (document.body.classList.contains("lui-simpleSlideInNav")) {
+        burgerTooltip = document.body.classList.contains("lui-leftNavToggle")
           ? collapseNavTooltip
           : expandNavTooltip;
       }
-      if (document.body.classList.contains('lui-semiCollapsible')) {
-        burgerTooltip = document.body.classList.contains('semiCollapsed')
+      if (document.body.classList.contains("lui-semiCollapsible")) {
+        burgerTooltip = document.body.classList.contains("semiCollapsed")
           ? collapseNavTooltip
           : expandNavTooltip;
       }
@@ -660,16 +645,16 @@
   }
 
   export function simpleNav() {
-    document.body.classList.toggle('lui-leftNavToggle');
-    if (document.getElementsByClassName('fd-tabs').length > 0) {
-      dispatch('resizeTabNav', {});
+    document.body.classList.toggle("lui-leftNavToggle");
+    if (document.getElementsByClassName("fd-tabs").length > 0) {
+      dispatch("resizeTabNav", {});
     }
   }
 
   export function semicollapsedNav() {
     SemiCollapsibleNavigation.buttonClicked();
-    if (document.getElementsByClassName('fd-tabs').length > 0) {
-      dispatch('resizeTabNav', {});
+    if (document.getElementsByClassName("fd-tabs").length > 0) {
+      dispatch("resizeTabNav", {});
     }
   }
 
@@ -680,7 +665,7 @@
 </script>
 
 <style type="text/scss">
-  @import 'styles/variables';
+  @import "styles/variables";
   //remove default outline of all dropdowns in shellbar
   .fd-shellbar:focus {
     outline: none;
diff --git a/core/src/navigation/services/context-switcher.js b/core/src/navigation/services/context-switcher.js
index e82b52a3e3..b513f88954 100644
--- a/core/src/navigation/services/context-switcher.js
+++ b/core/src/navigation/services/context-switcher.js
@@ -33,17 +33,10 @@ export const ContextSwitcherHelpers = {
   },
 
   getNodePathFromCurrentPath(option, selectedOption) {
-    const currentPath = GenericHelpers.addLeadingSlash(
-      Routing.getCurrentPath()
-    );
+    const currentPath = GenericHelpers.addLeadingSlash(Routing.getCurrentPath());
     const selectedPath = GenericHelpers.addLeadingSlash(selectedOption.link);
     if (currentPath.startsWith(selectedPath)) {
-      return (
-        option.link +
-        GenericHelpers.addLeadingSlash(
-          currentPath.substring(selectedPath.length)
-        )
-      );
+      return option.link + GenericHelpers.addLeadingSlash(currentPath.substring(selectedPath.length));
     } else {
       return option.link;
     }
@@ -60,9 +53,7 @@ export const ContextSwitcherHelpers = {
 
   isContextSwitcherDetailsView(currentPath, parentNodePath) {
     const currentPathNormalized = GenericHelpers.normalizePath(currentPath);
-    const parentNodePathNormalized = GenericHelpers.normalizePath(
-      parentNodePath
-    );
+    const parentNodePathNormalized = GenericHelpers.normalizePath(parentNodePath);
 
     return Boolean(
       parentNodePath &&
@@ -77,9 +68,7 @@ export const ContextSwitcherHelpers = {
       return id;
     }
 
-    const useFallbackLabelCache = LuigiConfig.getConfigBooleanValue(
-      'navigation.contextSwitcher.useFallbackLabelCache'
-    );
+    const useFallbackLabelCache = LuigiConfig.getConfigBooleanValue('navigation.contextSwitcher.useFallbackLabelCache');
     const labelCache = ContextSwitcherHelpers._fallbackLabels;
     if (useFallbackLabelCache) {
       if (labelCache.has(id)) {
@@ -95,12 +84,7 @@ export const ContextSwitcherHelpers = {
   getSelectedId(currentPath, options, parentNodePath) {
     currentPath = GenericHelpers.normalizePath(currentPath);
     parentNodePath = GenericHelpers.normalizePath(parentNodePath);
-    if (
-      !ContextSwitcherHelpers.isContextSwitcherDetailsView(
-        currentPath,
-        parentNodePath
-      )
-    ) {
+    if (!ContextSwitcherHelpers.isContextSwitcherDetailsView(currentPath, parentNodePath)) {
       return undefined;
     }
 
@@ -115,41 +99,23 @@ export const ContextSwitcherHelpers = {
     let selectedOption;
     const selectedId = this.getSelectedId(currentPath, options, parentNodePath);
     if (selectedId && options) {
-      selectedOption = ContextSwitcherHelpers.getOptionById(
-        options,
-        selectedId
-      );
+      selectedOption = ContextSwitcherHelpers.getOptionById(options, selectedId);
     }
     return selectedOption;
   },
 
-  async getSelectedLabel(
-    currentPath,
-    options,
-    parentNodePath,
-    fallbackLabelResolver
-  ) {
+  async getSelectedLabel(currentPath, options, parentNodePath, fallbackLabelResolver) {
     const selectedId = this.getSelectedId(currentPath, options, parentNodePath);
     if (!selectedId) {
       return;
     }
 
-    let selectedOption = await this.getSelectedOption(
-      currentPath,
-      options,
-      parentNodePath
-    );
+    let selectedOption = await this.getSelectedOption(currentPath, options, parentNodePath);
     let selectedLabel = selectedOption ? selectedOption.label : undefined;
 
     // get the label from fallback if selectedId is not
     // in options or options not yet lazy loaded by click
-    return (
-      selectedLabel ||
-      (await ContextSwitcherHelpers.getFallbackLabel(
-        fallbackLabelResolver,
-        selectedId
-      ))
-    );
+    return selectedLabel || (await ContextSwitcherHelpers.getFallbackLabel(fallbackLabelResolver, selectedId));
   },
 
   async fetchOptions(existingOptions = []) {
@@ -157,12 +123,7 @@ export const ContextSwitcherHelpers = {
     if (!config.lazyloadOptions && existingOptions.length) {
       return existingOptions;
     }
-    const contextSwitcherOptions = await LuigiConfig.getConfigValueAsync(
-      'navigation.contextSwitcher.options'
-    );
-    return await ContextSwitcherHelpers.generateSwitcherNav(
-      config,
-      contextSwitcherOptions
-    );
+    const contextSwitcherOptions = await LuigiConfig.getConfigValueAsync('navigation.contextSwitcher.options');
+    return await ContextSwitcherHelpers.generateSwitcherNav(config, contextSwitcherOptions);
   }
 };
diff --git a/core/src/navigation/services/header.js b/core/src/navigation/services/header.js
index 57dddf5146..c34453a0cb 100644
--- a/core/src/navigation/services/header.js
+++ b/core/src/navigation/services/header.js
@@ -13,8 +13,7 @@ export const processHeaderSettings = component => {
       component.set({
         hasApps:
           component.get().showMainAppEntry ||
-          (component.get().appSwitcherItems &&
-            component.get().appSwitcherItems.length > 0)
+          (component.get().appSwitcherItems && component.get().appSwitcherItems.length > 0)
       });
       return LuigiConfig.getConfigValueAsync('settings.header').then(header => {
         if (!header) {
@@ -43,12 +42,9 @@ export const processHeaderSettings = component => {
         // Set Favicon
         if (header.favicon) {
           const isInvalidFaviconFormat =
-            !header.favicon.split('?')[0].endsWith('.ico') &&
-            !header.favicon.startsWith('data:image');
+            !header.favicon.split('?')[0].endsWith('.ico') && !header.favicon.startsWith('data:image');
           if (isInvalidFaviconFormat) {
-            console.warn(
-              'Favicon is not an .ico filetype and might get displayed wrong.'
-            );
+            console.warn('Favicon is not an .ico filetype and might get displayed wrong.');
           }
           const link = Object.assign(document.createElement('link'), {
             type: 'image/x-icon',
@@ -74,11 +70,7 @@ const segmentMatches = (linkSegment, pathSegment, pathParams) => {
   if (linkSegment === pathSegment) {
     return true;
   }
-  if (
-    pathSegment.startsWith(':') &&
-    pathParams &&
-    pathParams[pathSegment.substr(1)] === linkSegment
-  ) {
+  if (pathSegment.startsWith(':') && pathParams && pathParams[pathSegment.substr(1)] === linkSegment) {
     return true;
   }
   return false;
@@ -94,9 +86,7 @@ export const updateTitle = component => {
       .sort((el1, el2) => (el2.link || '').localeCompare(el1.link || ''))
       .some(item => {
         let match = true;
-        GenericHelpers.trimTrailingSlash(
-          GenericHelpers.trimLeadingSlash(item.link)
-        )
+        GenericHelpers.trimTrailingSlash(GenericHelpers.trimLeadingSlash(item.link))
           .split('/')
           .forEach((pathSegment, index) => {
             if (match) {
@@ -104,11 +94,7 @@ export const updateTitle = component => {
                 match = false;
               } else if (
                 !pathData[index + 1].pathSegment ||
-                !segmentMatches(
-                  pathSegment,
-                  pathData[index + 1].pathSegment,
-                  pathParams
-                )
+                !segmentMatches(pathSegment, pathData[index + 1].pathSegment, pathParams)
               ) {
                 match = false;
               }
@@ -121,15 +107,10 @@ export const updateTitle = component => {
       });
   }
   component.set({ selectedItem });
-  const title =
-    selectedItem && selectedItem.title
-      ? selectedItem.title
-      : component.get().defaultTitle;
+  const title = selectedItem && selectedItem.title ? selectedItem.title : component.get().defaultTitle;
   const documentTitle = LuigiUX.getDocumentTitle() || title;
   component.set({ title });
   document.title = LuigiI18N.getTranslation(documentTitle);
-  const subTitle = selectedItem
-    ? selectedItem.subTitle || ''
-    : component.get().defaultSubTitle;
+  const subTitle = selectedItem ? selectedItem.subTitle || '' : component.get().defaultSubTitle;
   component.set({ subTitle });
 };
diff --git a/core/src/navigation/services/navigation.js b/core/src/navigation/services/navigation.js
index bb0898a227..f5d54999ef 100644
--- a/core/src/navigation/services/navigation.js
+++ b/core/src/navigation/services/navigation.js
@@ -29,9 +29,7 @@ class NavigationClass {
           rootNode = topNavNodes;
           if (rootNode.pathSegment) {
             rootNode.pathSegment = '';
-            console.warn(
-              'Root node must have an empty path segment. Provided path segment will be ignored.'
-            );
+            console.warn('Root node must have an empty path segment. Provided path segment will be ignored.');
           }
         } else {
           rootNode = { children: topNavNodes };
@@ -47,20 +45,15 @@ class NavigationClass {
         rootNode.context || {}
       );
 
-      const navPathSegments = navObj.navigationPath
-        .filter(x => x.pathSegment)
-        .map(x => x.pathSegment);
+      const navPathSegments = navObj.navigationPath.filter(x => x.pathSegment).map(x => x.pathSegment);
 
-      navObj.isExistingRoute =
-        !activePath || nodeNamesInCurrentPath.length === navPathSegments.length;
+      navObj.isExistingRoute = !activePath || nodeNamesInCurrentPath.length === navPathSegments.length;
 
       const pathSegments = activePath.split('/');
       navObj.matchedPath = pathSegments
         .filter((segment, index) => {
           return (
-            (navPathSegments[index] &&
-              navPathSegments[index].startsWith(':')) ||
-            navPathSegments[index] === segment
+            (navPathSegments[index] && navPathSegments[index].startsWith(':')) || navPathSegments[index] === segment
           );
         })
         .join('/');
@@ -78,18 +71,12 @@ class NavigationClass {
     let children = [];
     if (!NodeDataManagementStorage.hasChildren(node)) {
       try {
-        children = await AsyncHelpers.getConfigValueFromObjectAsync(
-          node,
-          'children',
-          context || node.context
-        );
+        children = await AsyncHelpers.getConfigValueFromObjectAsync(node, 'children', context || node.context);
         if (children === undefined) {
           children = [];
         }
         children =
-          children
-            .map(n => this.getExpandStructuralPathSegment(n))
-            .map(n => this.bindChildToParent(n, node)) || [];
+          children.map(n => this.getExpandStructuralPathSegment(n)).map(n => this.bindChildToParent(n, node)) || [];
       } catch (err) {
         console.error('Could not lazy-load children for node', err);
       }
@@ -121,11 +108,7 @@ class NavigationClass {
   }
 
   getAccessibleNodes(node, children, context) {
-    return children
-      ? children.filter(child =>
-          NavigationHelpers.isNodeAccessPermitted(child, node, context)
-        )
-      : [];
+    return children ? children.filter(child => NavigationHelpers.isNodeAccessPermitted(child, node, context)) : [];
   }
 
   bindChildToParent(child, node) {
@@ -161,13 +144,7 @@ class NavigationClass {
     return node;
   }
 
-  async buildNode(
-    nodeNamesInCurrentPath,
-    nodesInCurrentPath,
-    childrenOfCurrentNode,
-    context,
-    pathParams = {}
-  ) {
+  async buildNode(nodeNamesInCurrentPath, nodesInCurrentPath, childrenOfCurrentNode, context, pathParams = {}) {
     if (!context.parentNavigationContexts) {
       context.parentNavigationContexts = [];
     }
@@ -176,29 +153,16 @@ class NavigationClass {
       context: context,
       pathParams: pathParams
     };
-    if (
-      nodeNamesInCurrentPath.length > 0 &&
-      childrenOfCurrentNode &&
-      childrenOfCurrentNode.length > 0
-    ) {
+    if (nodeNamesInCurrentPath.length > 0 && childrenOfCurrentNode && childrenOfCurrentNode.length > 0) {
       const urlPathElement = nodeNamesInCurrentPath[0];
       const node = this.findMatchingNode(urlPathElement, childrenOfCurrentNode);
       if (node) {
         nodesInCurrentPath.push(node);
-        let newContext = NavigationHelpers.applyContext(
-          context,
-          node.context,
-          node.navigationContext
-        );
+        let newContext = NavigationHelpers.applyContext(context, node.context, node.navigationContext);
         if (node.pathSegment.startsWith(':')) {
-          pathParams[
-            node.pathSegment.replace(':', '')
-          ] = EscapingHelpers.sanitizeParam(urlPathElement);
+          pathParams[node.pathSegment.replace(':', '')] = EscapingHelpers.sanitizeParam(urlPathElement);
         }
-        newContext = RoutingHelpers.substituteDynamicParamsInObject(
-          newContext,
-          pathParams
-        );
+        newContext = RoutingHelpers.substituteDynamicParamsInObject(newContext, pathParams);
         try {
           /**
            * If its a virtual tree,
@@ -209,13 +173,7 @@ class NavigationClass {
           // STANDARD PROCEDURE
           let children = await this.getChildren(node, newContext);
           const newNodeNamesInCurrentPath = nodeNamesInCurrentPath.slice(1);
-          result = this.buildNode(
-            newNodeNamesInCurrentPath,
-            nodesInCurrentPath,
-            children,
-            newContext,
-            pathParams
-          );
+          result = this.buildNode(newNodeNamesInCurrentPath, nodesInCurrentPath, children, newContext, pathParams);
         } catch (err) {
           console.error('Error getting nodes children', err);
         }
@@ -266,33 +224,20 @@ class NavigationClass {
       }
 
       _virtualPathIndex++;
-      const keysToClean = [
-        '_*',
-        'virtualTree',
-        'parent',
-        'children',
-        'keepSelectedForChildren',
-        'navigationContext'
-      ];
+      const keysToClean = ['_*', 'virtualTree', 'parent', 'children', 'keepSelectedForChildren', 'navigationContext'];
       const newChild = GenericHelpers.removeProperties(node, keysToClean);
       Object.assign(newChild, {
         pathSegment: ':virtualSegment_' + _virtualPathIndex,
         label: ':virtualSegment_' + _virtualPathIndex,
         viewUrl: GenericHelpers.trimTrailingSlash(
-          this.buildVirtualViewUrl(
-            _virtualViewUrl,
-            pathParams,
-            _virtualPathIndex
-          )
+          this.buildVirtualViewUrl(_virtualViewUrl, pathParams, _virtualPathIndex)
         ),
         _virtualTree: true,
         _virtualPathIndex,
         _virtualViewUrl
       });
 
-      const isVirtualChildren = node.children
-        ? node.children[0]._virtualTree
-        : false;
+      const isVirtualChildren = node.children ? node.children[0]._virtualTree : false;
       if (node.children && !isVirtualChildren) {
         console.warn(
           'Found both virtualTree and children nodes defined on a navigation node. \nChildren nodes are redundant and ignored when virtualTree is enabled. \nPlease refer to documentation'
@@ -305,9 +250,7 @@ class NavigationClass {
   findMatchingNode(urlPathElement, nodes) {
     let result = null;
     const segmentsLength = nodes.filter(n => !!n.pathSegment).length;
-    const dynamicSegmentsLength = nodes.filter(
-      n => n.pathSegment && n.pathSegment.startsWith(':')
-    ).length;
+    const dynamicSegmentsLength = nodes.filter(n => n.pathSegment && n.pathSegment.startsWith(':')).length;
     if (segmentsLength > 1) {
       if (dynamicSegmentsLength === 1) {
         console.warn(
@@ -316,9 +259,7 @@ class NavigationClass {
           'Children:',
           nodes
         );
-        nodes = nodes.filter(
-          n => n.pathSegment && n.pathSegment.startsWith(':')
-        );
+        nodes = nodes.filter(n => n.pathSegment && n.pathSegment.startsWith(':'));
       }
       if (dynamicSegmentsLength > 1) {
         console.error(
@@ -344,9 +285,7 @@ class NavigationClass {
   }
 
   onNodeChange(prevNode, nextNode) {
-    const invokedFunction = LuigiConfig.getConfigValue(
-      'navigation.nodeChangeHook'
-    );
+    const invokedFunction = LuigiConfig.getConfigValue('navigation.nodeChangeHook');
     if (typeof invokedFunction === 'function') {
       invokedFunction(prevNode, nextNode);
     } else if (invokedFunction !== undefined) {
@@ -408,9 +347,7 @@ class NavigationClass {
   async getLeftNavData(current, componentData) {
     const updatedCompData = {};
     if (current.pathData && 1 < current.pathData.length) {
-      const pathDataTruncatedChildren = this.getTruncatedChildren(
-        componentData.pathData
-      );
+      const pathDataTruncatedChildren = this.getTruncatedChildren(componentData.pathData);
       let lastElement = [...pathDataTruncatedChildren].pop();
       let selectedNode;
       if (lastElement.keepSelectedForChildren || lastElement.tabNav) {
@@ -418,19 +355,11 @@ class NavigationClass {
         pathDataTruncatedChildren.pop();
         lastElement = [...pathDataTruncatedChildren].pop();
       }
-      const children = await this.getChildren(
-        lastElement,
-        componentData.context
-      );
+      const children = await this.getChildren(lastElement, componentData.context);
       const groupedChildren = this.getGroupedChildren(children, current);
       updatedCompData.hasCategoriesWithIcon = false;
       Object.values(groupedChildren).forEach(value => {
-        if (
-          !updatedCompData.hasCategoriesWithIcon &&
-          value &&
-          value.metaInfo &&
-          value.metaInfo.icon
-        ) {
+        if (!updatedCompData.hasCategoriesWithIcon && value && value.metaInfo && value.metaInfo.icon) {
           updatedCompData.hasCategoriesWithIcon = true;
         }
       });
@@ -462,9 +391,7 @@ class NavigationClass {
   async getTabNavData(current, componentData) {
     const updatedCompData = {};
     if (current.pathData && 1 < current.pathData.length) {
-      const pathDataTruncatedChildren = this.getTruncatedChildrenForTabNav(
-        componentData.pathData
-      );
+      const pathDataTruncatedChildren = this.getTruncatedChildrenForTabNav(componentData.pathData);
       let selectedNode = [...pathDataTruncatedChildren].pop();
       const children = await this.getChildren(
         selectedNode.tabNav ? selectedNode : selectedNode.parent,
@@ -479,20 +406,13 @@ class NavigationClass {
   }
 
   async extractDataFromPath(path) {
-    const pathData = await this.getNavigationPath(
-      LuigiConfig.getConfigValueAsync('navigation.nodes'),
-      path
-    );
+    const pathData = await this.getNavigationPath(LuigiConfig.getConfigValueAsync('navigation.nodes'), path);
     const nodeObject = RoutingHelpers.getLastNodeObject(pathData);
     return { nodeObject, pathData };
   }
 
   async shouldPreventNavigation(node) {
-    if (
-      node &&
-      GenericHelpers.isFunction(node.onNodeActivation) &&
-      (await node.onNodeActivation(node)) === false
-    ) {
+    if (node && GenericHelpers.isFunction(node.onNodeActivation) && (await node.onNodeActivation(node)) === false) {
       return true;
     }
     return false;
diff --git a/core/src/navigation/services/semi-collapsed-navigation.js b/core/src/navigation/services/semi-collapsed-navigation.js
index 396938c264..cb41f4e4bc 100644
--- a/core/src/navigation/services/semi-collapsed-navigation.js
+++ b/core/src/navigation/services/semi-collapsed-navigation.js
@@ -4,40 +4,26 @@ import { CSS_BREAKPOINTS } from '../../utilities/constants';
 
 class SemiCollapsibleNavigationClass {
   initial() {
-    this.responsiveNavSetting = LuigiConfig.getConfigValue(
-      'settings.responsiveNavigation'
-    );
+    this.responsiveNavSetting = LuigiConfig.getConfigValue('settings.responsiveNavigation');
 
     const isResponsiveNavSemiCollapsibleOrFiori3 =
-      this.responsiveNavSetting === 'semiCollapsible' ||
-      this.responsiveNavSetting === 'Fiori3';
+      this.responsiveNavSetting === 'semiCollapsible' || this.responsiveNavSetting === 'Fiori3';
 
     //checking if there was a previous state in LocalStorage before the first load and reload
     if (
-      JSON.parse(localStorage.getItem(NavigationHelpers.COL_NAV_KEY)) !==
-        false &&
+      JSON.parse(localStorage.getItem(NavigationHelpers.COL_NAV_KEY)) !== false &&
       isResponsiveNavSemiCollapsibleOrFiori3
     ) {
       this.isSemiCollapsed = this.getCollapsed();
     }
-    this.semiCollapsible = isResponsiveNavSemiCollapsibleOrFiori3
-      ? true
-      : false;
+    this.semiCollapsible = isResponsiveNavSemiCollapsibleOrFiori3 ? true : false;
 
     // set this.isSemiCollapsed to true for mobile
     let isSemiCollapsedUndefined = this.isSemiCollapsed === undefined;
-    if (
-      this.semiCollapsible &&
-      window.innerWidth !== 0 &&
-      window.innerWidth < CSS_BREAKPOINTS.desktopMinWidth
-    ) {
-      this.isSemiCollapsed = isSemiCollapsedUndefined
-        ? true
-        : this.getCollapsed();
+    if (this.semiCollapsible && window.innerWidth !== 0 && window.innerWidth < CSS_BREAKPOINTS.desktopMinWidth) {
+      this.isSemiCollapsed = isSemiCollapsedUndefined ? true : this.getCollapsed();
     } else {
-      this.isSemiCollapsed = isSemiCollapsedUndefined
-        ? false
-        : this.getCollapsed();
+      this.isSemiCollapsed = isSemiCollapsedUndefined ? false : this.getCollapsed();
     }
 
     this.setCollapsed(this.isSemiCollapsed);
@@ -113,9 +99,7 @@ class SemiCollapsibleNavigationClass {
   closePopupMenu(selectedCategory) {
     if (selectedCategory) {
       selectedCategory = null;
-      document
-        .getElementsByClassName('fd-app__sidebar')[0]
-        .classList.remove('isBlocked');
+      document.getElementsByClassName('fd-app__sidebar')[0].classList.remove('isBlocked');
     }
     return selectedCategory;
   }
@@ -126,13 +110,9 @@ class SemiCollapsibleNavigationClass {
       this.setCollapsed(true);
 
       //Force browser to re-render vertical scrollbar
-      document
-        .getElementsByClassName('lui-fd-side-nav-wrapper')[0]
-        .setAttribute('style', 'overflow-y:hidden;');
+      document.getElementsByClassName('lui-fd-side-nav-wrapper')[0].setAttribute('style', 'overflow-y:hidden;');
       window.setTimeout(function() {
-        document
-          .getElementsByClassName('lui-fd-side-nav-wrapper')[0]
-          .setAttribute('style', 'overflow-y:auto;');
+        document.getElementsByClassName('lui-fd-side-nav-wrapper')[0].setAttribute('style', 'overflow-y:auto;');
       });
     } else {
       this.setCollapsed(false);
diff --git a/core/src/services/auth-layer.js b/core/src/services/auth-layer.js
index 5c351222ff..1a0e185b25 100644
--- a/core/src/services/auth-layer.js
+++ b/core/src/services/auth-layer.js
@@ -35,9 +35,7 @@ class AuthLayerSvcClass {
       // No Authentication active
       return Promise.resolve(true);
     }
-    const idpProviderSettings = LuigiConfig.getConfigValue(
-      `auth.${idpProviderName}`
-    );
+    const idpProviderSettings = LuigiConfig.getConfigValue(`auth.${idpProviderName}`);
 
     /**
      * Prevent IDP Provider initialization, if an error is present
@@ -45,19 +43,12 @@ class AuthLayerSvcClass {
      * errors are represented by `error` and `errorDescription` param.
      */
     const uaError = AuthHelpers.parseUrlAuthErrors() || {};
-    const noError = await AuthHelpers.handleUrlAuthErrors(
-      idpProviderSettings,
-      uaError.error,
-      uaError.errorDescription
-    );
+    const noError = await AuthHelpers.handleUrlAuthErrors(idpProviderSettings, uaError.error, uaError.errorDescription);
     if (!noError) {
       return;
     }
 
-    this.idpProviderInstance = this.getIdpProviderInstance(
-      idpProviderName,
-      idpProviderSettings
-    );
+    this.idpProviderInstance = this.getIdpProviderInstance(idpProviderName, idpProviderSettings);
     if (GenericHelpers.isPromise(this.idpProviderInstance)) {
       return this.idpProviderInstance
         .then(resolved => {
@@ -88,10 +79,7 @@ class AuthLayerSvcClass {
        */
       let startAuth = true;
       if (authData) {
-        startAuth = await LuigiAuth.handleAuthEvent(
-          'onAuthExpired',
-          idpProviderSettings
-        );
+        startAuth = await LuigiAuth.handleAuthEvent('onAuthExpired', idpProviderSettings);
       }
       if (startAuth) {
         return this.startAuthorization();
@@ -99,55 +87,34 @@ class AuthLayerSvcClass {
       return;
     }
 
-    if (
-      this.idpProviderInstance.settings &&
-      GenericHelpers.isFunction(this.idpProviderInstance.settings.userInfoFn)
-    ) {
-      this.idpProviderInstance.settings
-        .userInfoFn(this.idpProviderInstance.settings, authData)
-        .then(userInfo => {
+    if (this.idpProviderInstance.settings && GenericHelpers.isFunction(this.idpProviderInstance.settings.userInfoFn)) {
+      this.idpProviderInstance.settings.userInfoFn(this.idpProviderInstance.settings, authData).then(userInfo => {
+        this.setUserInfo(userInfo);
+        this.setLoggedIn(true);
+      });
+    } else {
+      if (GenericHelpers.isFunction(this.idpProviderInstance.userInfo)) {
+        this.idpProviderInstance.userInfo(idpProviderSettings).then(userInfo => {
           this.setUserInfo(userInfo);
           this.setLoggedIn(true);
         });
-    } else {
-      if (GenericHelpers.isFunction(this.idpProviderInstance.userInfo)) {
-        this.idpProviderInstance
-          .userInfo(idpProviderSettings)
-          .then(userInfo => {
-            this.setUserInfo(userInfo);
-            this.setLoggedIn(true);
-          });
       } else {
         this.setLoggedIn(true);
         this.setUserInfo(get(this._userInfoStore));
       }
     }
 
-    const hasAuthSuccessFulFn = GenericHelpers.isFunction(
-      LuigiConfig.getConfigValue('auth.events.onAuthSuccessful')
-    );
+    const hasAuthSuccessFulFn = GenericHelpers.isFunction(LuigiConfig.getConfigValue('auth.events.onAuthSuccessful'));
 
     if (hasAuthSuccessFulFn && AuthStoreSvc.isNewlyAuthorized()) {
-      await LuigiAuth.handleAuthEvent(
-        'onAuthSuccessful',
-        idpProviderSettings,
-        authData
-      );
+      await LuigiAuth.handleAuthEvent('onAuthSuccessful', idpProviderSettings, authData);
     }
     AuthStoreSvc.removeNewlyAuthorized();
 
-    if (
-      GenericHelpers.isFunction(
-        this.idpProviderInstance.setTokenExpirationAction
-      )
-    ) {
+    if (GenericHelpers.isFunction(this.idpProviderInstance.setTokenExpirationAction)) {
       this.idpProviderInstance.setTokenExpirationAction();
     }
-    if (
-      GenericHelpers.isFunction(
-        this.idpProviderInstance.setTokenExpireSoonAction
-      )
-    ) {
+    if (GenericHelpers.isFunction(this.idpProviderInstance.setTokenExpireSoonAction)) {
       this.idpProviderInstance.setTokenExpireSoonAction();
     }
   }
@@ -169,23 +136,12 @@ class AuthLayerSvcClass {
   logout() {
     const authData = AuthHelpers.getStoredAuthData();
     const logoutCallback = async redirectUrl => {
-      await LuigiAuth.handleAuthEvent(
-        'onLogout',
-        this.idpProviderInstance.settings,
-        undefined,
-        redirectUrl
-      );
+      await LuigiAuth.handleAuthEvent('onLogout', this.idpProviderInstance.settings, undefined, redirectUrl);
       AuthStoreSvc.removeAuthData();
     };
-    const customLogoutFn = LuigiConfig.getConfigValue(
-      `auth.${LuigiConfig.getConfigValue('auth.use')}.logoutFn`
-    );
+    const customLogoutFn = LuigiConfig.getConfigValue(`auth.${LuigiConfig.getConfigValue('auth.use')}.logoutFn`);
     if (GenericHelpers.isFunction(customLogoutFn)) {
-      customLogoutFn(
-        this.idpProviderInstance.settings,
-        authData,
-        logoutCallback
-      );
+      customLogoutFn(this.idpProviderInstance.settings, authData, logoutCallback);
     } else if (GenericHelpers.isFunction(this.idpProviderInstance.logout)) {
       this.idpProviderInstance.logout(authData, logoutCallback);
     } else if (this._profileLogoutFn) {
@@ -203,10 +159,7 @@ class AuthLayerSvcClass {
 
   async getIdpProviderInstance(idpProviderName, idpProviderSettings) {
     // custom provider provided via config:
-    const idpProvider = GenericHelpers.getConfigValueFromObject(
-      idpProviderSettings,
-      'idpProvider'
-    );
+    const idpProvider = GenericHelpers.getConfigValueFromObject(idpProviderSettings, 'idpProvider');
     if (idpProvider) {
       const customIdpInstance = await new idpProvider(idpProviderSettings);
       ['login'].forEach(requiredFnName => {
@@ -221,26 +174,19 @@ class AuthLayerSvcClass {
     }
 
     // handle non-existing providers
-    const onAuthConfigError = GenericHelpers.isFunction(
-      LuigiConfig.getConfigValue('auth.events.onAuthConfigError')
-    );
+    const onAuthConfigError = GenericHelpers.isFunction(LuigiConfig.getConfigValue('auth.events.onAuthConfigError'));
     if (onAuthConfigError) {
       await LuigiAuth.handleAuthEvent('onAuthConfigError', {
         idpProviderName: idpProviderName,
         type: 'IdpProviderException'
       });
     } else {
-      throw this.IdpProviderException(
-        `IDP Provider ${idpProviderName} does not exist.`
-      );
+      throw this.IdpProviderException(`IDP Provider ${idpProviderName} does not exist.`);
     }
   }
 
   unload() {
-    if (
-      this.idpProviderInstance &&
-      GenericHelpers.isFunction(this.idpProviderInstance.unload)
-    ) {
+    if (this.idpProviderInstance && GenericHelpers.isFunction(this.idpProviderInstance.unload)) {
       this.idpProviderInstance.unload();
     }
   }
diff --git a/core/src/services/auth-store.js b/core/src/services/auth-store.js
index 2c81954768..ab41629f37 100644
--- a/core/src/services/auth-store.js
+++ b/core/src/services/auth-store.js
@@ -15,8 +15,7 @@ class AuthStoreSvcClass {
 
   getStorageType() {
     if (!this._storageType) {
-      this._storageType =
-        LuigiConfig.getConfigValue('auth.storage') || this._defaultStorage;
+      this._storageType = LuigiConfig.getConfigValue('auth.storage') || this._defaultStorage;
     }
     return this._storageType;
   }
@@ -79,9 +78,7 @@ class AuthStoreSvcClass {
           console.error(this._invalidStorageMsg);
       }
     } catch (e) {
-      console.warn(
-        'Error parsing authorization data. Auto-logout might not work!'
-      );
+      console.warn('Error parsing authorization data. Auto-logout might not work!');
     }
   }
 }
diff --git a/core/src/services/iframe.js b/core/src/services/iframe.js
index fe40450280..ed591f1230 100644
--- a/core/src/services/iframe.js
+++ b/core/src/services/iframe.js
@@ -1,11 +1,6 @@
 // Methods related to managing the view in the iframe.
 // Please consider adding any new methods to 'iframe-helpers' if they don't require anything from this file.
-import {
-  GenericHelpers,
-  IframeHelpers,
-  RoutingHelpers,
-  NavigationHelpers
-} from '../utilities/helpers';
+import { GenericHelpers, IframeHelpers, RoutingHelpers, NavigationHelpers } from '../utilities/helpers';
 import { LuigiConfig, LuigiI18N } from '../core-api';
 
 class IframeClass {
@@ -16,9 +11,7 @@ class IframeClass {
 
   getActiveIframe(node) {
     const children = [...node.children];
-    return children
-      .filter(child => child.tagName === 'IFRAME')
-      .find(GenericHelpers.isElementVisible);
+    return children.filter(child => child.tagName === 'IFRAME').find(GenericHelpers.isElementVisible);
   }
 
   setActiveIframeToPrevious(node) {
@@ -40,21 +33,14 @@ class IframeClass {
   removeInactiveIframes(node) {
     const children = Array.from(node.children);
     children.forEach(child => {
-      if (
-        !GenericHelpers.isElementVisible(child) &&
-        !child.vg &&
-        child.tagName === 'IFRAME'
-      ) {
+      if (!GenericHelpers.isElementVisible(child) && !child.vg && child.tagName === 'IFRAME') {
         node.removeChild(child);
       }
     });
   }
 
   hasIsolatedView(isolateView, isSameViewGroup, isolateAllViews) {
-    return (
-      isolateView ||
-      (isolateAllViews && !(isolateView === false) && !isSameViewGroup)
-    );
+    return isolateView || (isolateAllViews && !(isolateView === false) && !isSameViewGroup);
   }
 
   getPreservedViewsInDom(iframes) {
@@ -151,9 +137,7 @@ class IframeClass {
         IframeHelpers.removeIframe(config.iframe, node);
         config.iframe = undefined;
         config.isFallbackFrame = true;
-        console.info(
-          'navigate: luigi-client did not respond, using fallback by replacing iframe'
-        );
+        console.info('navigate: luigi-client did not respond, using fallback by replacing iframe');
         await this.navigateIframe(config, component, node);
       }
     }, this.iframeNavFallbackTimeout);
@@ -210,11 +194,7 @@ class IframeClass {
       isSameViewGroup,
       config.isolateAllViews
     );
-    const nextViewIsolated = this.hasIsolatedView(
-      componentData.isolateView,
-      isSameViewGroup,
-      config.isolateAllViews
-    );
+    const nextViewIsolated = this.hasIsolatedView(componentData.isolateView, isSameViewGroup, config.isolateAllViews);
     const canReuseIframe = IframeHelpers.canReuseIframe(config, component);
     let activeIframe = this.getActiveIframe(node);
 
@@ -239,11 +219,7 @@ class IframeClass {
 
       // if next view must be isolated
       if (activeIframe && nextViewIsolated) {
-        activeIframe = this.switchActiveIframe(
-          node,
-          undefined,
-          !activeIframe.vg
-        );
+        activeIframe = this.switchActiveIframe(node, undefined, !activeIframe.vg);
       }
 
       // if next view is not isolated we can pick a iframe with matching viewGroup from the pool
@@ -257,11 +233,7 @@ class IframeClass {
           targetIframe = sameViewGroupIframes[0];
 
           // make the targetIframe the new active iframe
-          activeIframe = this.switchActiveIframe(
-            node,
-            targetIframe,
-            activeIframe && !activeIframe.vg
-          );
+          activeIframe = this.switchActiveIframe(node, targetIframe, activeIframe && !activeIframe.vg);
         }
       }
 
@@ -289,21 +261,13 @@ class IframeClass {
         IframeHelpers.removeElementChildren(node);
       }
       if (componentData.viewUrl) {
-        if (
-          GenericHelpers.getConfigValueFromObject(
-            componentData,
-            'currentNode.loadingIndicator.enabled'
-          ) !== false
-        ) {
+        if (GenericHelpers.getConfigValueFromObject(componentData, 'currentNode.loadingIndicator.enabled') !== false) {
           component.set({ showLoadingIndicator: true });
         } else {
           component.set({ showLoadingIndicator: false });
         }
         config.navigateOk = undefined;
-        const canCache =
-          componentData.viewGroup &&
-          !nextViewIsolated &&
-          this.canCache(componentData.viewGroup);
+        const canCache = componentData.viewGroup && !nextViewIsolated && this.canCache(componentData.viewGroup);
         config.iframe = IframeHelpers.createIframe(
           viewUrl,
           canCache ? componentData.viewGroup : undefined,
@@ -329,13 +293,7 @@ class IframeClass {
         if (pageErrorHandler) {
           this.checkIframe(pageErrorHandler, component, viewUrl, config, node);
         } else if (config.defaultPageErrorHandler) {
-          this.checkIframe(
-            config.defaultPageErrorHandler,
-            component,
-            viewUrl,
-            config,
-            node
-          );
+          this.checkIframe(config.defaultPageErrorHandler, component, viewUrl, config, node);
         }
       }
     } else {
@@ -344,17 +302,13 @@ class IframeClass {
       config.iframe.style.display = 'block';
       config.iframe.luigi.nextViewUrl = viewUrl;
       config.iframe.luigi.nextClientPermissions = component.get().currentNode.clientPermissions;
-      config.iframe['vg'] = this.canCache(componentData.viewGroup)
-        ? componentData.viewGroup
-        : undefined;
+      config.iframe['vg'] = this.canCache(componentData.viewGroup) ? componentData.viewGroup : undefined;
       config.iframe.luigi.currentNode = componentData.currentNode;
       const internalData = await component.prepareInternalData(config);
       const message = {
         msg: 'luigi.navigate',
         viewUrl: viewUrl,
-        context: JSON.stringify(
-          Object.assign({}, componentData.context, { goBackContext })
-        ),
+        context: JSON.stringify(Object.assign({}, componentData.context, { goBackContext })),
         nodeParams: JSON.stringify(Object.assign({}, componentData.nodeParams)),
         pathParams: JSON.stringify(Object.assign({}, componentData.pathParams)),
         internal: JSON.stringify(internalData)
diff --git a/core/src/services/preloading.js b/core/src/services/preloading.js
index 44c54266e7..d24d953eb2 100644
--- a/core/src/services/preloading.js
+++ b/core/src/services/preloading.js
@@ -10,9 +10,7 @@ class ViewGroupPreloadingClass {
   }
 
   preloadViewGroups(batchSize = 3) {
-    const preloadViewGroupsSetting = LuigiConfig.getConfigValue(
-      'navigation.preloadViewGroups'
-    );
+    const preloadViewGroupsSetting = LuigiConfig.getConfigValue('navigation.preloadViewGroups');
     if (preloadViewGroupsSetting === false) {
       return;
     }
@@ -24,10 +22,7 @@ class ViewGroupPreloadingClass {
     const iframes = IframeHelpers.getMainIframes();
     const now = new Date().getTime();
     const preloadingIframes = iframes.filter(
-      iframe =>
-        iframe.luigi &&
-        iframe.luigi.preloading &&
-        now - iframe.luigi.createdAt < 30000
+      iframe => iframe.luigi && iframe.luigi.preloading && now - iframe.luigi.createdAt < 30000
     );
     if (preloadingIframes.length > 0) {
       console.debug('skipping view group preloading (busy)');
@@ -39,15 +34,8 @@ class ViewGroupPreloadingClass {
       .filter(([_, settings]) => settings && settings.preloadUrl)
       .filter((_, index) => index < batchSize)
       .forEach(([name, settings]) => {
-        console.debug(
-          'preloading view group ' + name + ' - ' + settings.preloadUrl
-        );
-        const iframe = IframeHelpers.createIframe(
-          settings.preloadUrl,
-          name,
-          null,
-          'main'
-        );
+        console.debug('preloading view group ' + name + ' - ' + settings.preloadUrl);
+        const iframe = IframeHelpers.createIframe(settings.preloadUrl, name, null, 'main');
         iframe.style.display = 'none';
         iframe.luigi.preloading = true;
         iframeContainer.appendChild(iframe);
diff --git a/core/src/services/routing.js b/core/src/services/routing.js
index 55fd65d6da..1401ff4dca 100644
--- a/core/src/services/routing.js
+++ b/core/src/services/routing.js
@@ -1,12 +1,7 @@
 // Methods related to the routing. They mostly end up changing the iframe view which is handled by `iframe.js` file;
 // Please consider adding any new methods to 'routing-helpers' if they don't require anything from this file.
 import { Navigation } from '../navigation/services/navigation';
-import {
-  GenericHelpers,
-  RoutingHelpers,
-  IframeHelpers,
-  EventListenerHelpers
-} from '../utilities/helpers';
+import { GenericHelpers, RoutingHelpers, IframeHelpers, EventListenerHelpers } from '../utilities/helpers';
 import { LuigiConfig, LuigiI18N, LuigiNavigation } from '../core-api';
 import { Iframe } from './';
 import { NAVIGATION_DEFAULTS } from './../utilities/luigi-config-defaults';
@@ -15,13 +10,7 @@ import { WebComponentService } from './web-components';
 
 class RoutingClass {
   getNodePath(node, params) {
-    return node
-      ? RoutingHelpers.buildRoute(
-          node,
-          node.pathSegment ? '/' + node.pathSegment : '',
-          params
-        )
-      : '';
+    return node ? RoutingHelpers.buildRoute(node, node.pathSegment ? '/' + node.pathSegment : '', params) : '';
   }
 
   normalizePath(path) {
@@ -93,9 +82,7 @@ class RoutingClass {
       event = document.createEvent('Event');
       event.initEvent('popstate', true, true);
     } else {
-      event = navSync
-        ? new CustomEvent('popstate')
-        : new CustomEvent('popstate', { detail: { withoutSync: true } });
+      event = navSync ? new CustomEvent('popstate') : new CustomEvent('popstate', { detail: { withoutSync: true } });
     }
 
     window.dispatchEvent(event);
@@ -112,23 +99,13 @@ class RoutingClass {
     if (node.parent && node.parent.pathSegment) {
       // use only this part of the current path that refers to the parent of the node (remove additional parts refering to the sibiling)
       // remove everything that is after the parents pathSegment 'parent/keepSelectedForChildren/something' -> 'parent'
-      const nodePathSegments = GenericHelpers.trimLeadingSlash(
-        this.getNodePath(node.parent)
-      ).split('/');
-      const windowPathSegments = GenericHelpers.trimLeadingSlash(
-        windowPath
-      ).split('/');
+      const nodePathSegments = GenericHelpers.trimLeadingSlash(this.getNodePath(node.parent)).split('/');
+      const windowPathSegments = GenericHelpers.trimLeadingSlash(windowPath).split('/');
       if (windowPathSegments.length > nodePathSegments.length) {
-        windowPath = windowPathSegments
-          .slice(0, nodePathSegments.length)
-          .join('/');
+        windowPath = windowPathSegments.slice(0, nodePathSegments.length).join('/');
       }
     }
-    return this.normalizePath(
-      GenericHelpers.addLeadingSlash(
-        this.concatenatePath(windowPath, node.link)
-      )
-    );
+    return this.normalizePath(GenericHelpers.addLeadingSlash(this.concatenatePath(windowPath, node.link)));
   }
 
   getHashPath(url = window.location.hash) {
@@ -151,9 +128,7 @@ class RoutingClass {
       const intentPath = RoutingHelpers.getIntentPath(hash);
       return intentPath ? intentPath : '/';
     }
-    const path =
-      (window.history.state && window.history.state.path) ||
-      window.location.pathname;
+    const path = (window.history.state && window.history.state.path) || window.location.pathname;
     return path
       .split('/')
       .slice(1)
@@ -172,18 +147,14 @@ class RoutingClass {
     return LuigiConfig.getConfigValue('routing.useHashRouting')
       ? window.location.hash.replace('#', '') // TODO: GenericHelpers.getPathWithoutHash(window.location.hash) fails in ContextSwitcher
       : window.location.search
-      ? GenericHelpers.trimLeadingSlash(window.location.pathname) +
-        window.location.search
+      ? GenericHelpers.trimLeadingSlash(window.location.pathname) + window.location.search
       : GenericHelpers.trimLeadingSlash(window.location.pathname);
   }
 
   async handleRouteChange(path, component, iframeElement, config, withoutSync) {
     const defaultPattern = [/access_token=/, /id_token=/];
-    const patterns =
-      LuigiConfig.getConfigValue('routing.skipRoutingForUrlPatterns') ||
-      defaultPattern;
-    const hasSkipMatches =
-      patterns.filter(p => window.location.href.match(p)).length !== 0;
+    const patterns = LuigiConfig.getConfigValue('routing.skipRoutingForUrlPatterns') || defaultPattern;
+    const hasSkipMatches = patterns.filter(p => window.location.href.match(p)).length !== 0;
     if (hasSkipMatches) {
       return;
     }
@@ -208,9 +179,7 @@ class RoutingClass {
         return;
       }
 
-      const featureToggleProperty = LuigiConfig.getConfigValue(
-        'settings.featureToggles.queryStringParam'
-      )
+      const featureToggleProperty = LuigiConfig.getConfigValue('settings.featureToggles.queryStringParam')
         ? LuigiConfig.getConfigValue('settings.featureToggles.queryStringParam')
         : undefined;
       if (featureToggleProperty) {
@@ -221,28 +190,19 @@ class RoutingClass {
 
       const previousCompData = component.get();
       this.checkInvalidateCache(previousCompData, path);
-      const pathUrlRaw =
-        path && path.length ? GenericHelpers.getPathWithoutHash(path) : '';
-      const { nodeObject, pathData } = await Navigation.extractDataFromPath(
-        path
-      );
+      const pathUrlRaw = path && path.length ? GenericHelpers.getPathWithoutHash(path) : '';
+      const { nodeObject, pathData } = await Navigation.extractDataFromPath(path);
       const viewUrl = nodeObject.viewUrl || '';
 
       if (!viewUrl && !nodeObject.compound) {
-        const defaultChildNode = await RoutingHelpers.getDefaultChildNode(
-          pathData,
-          async (node, ctx) => {
-            return await Navigation.getChildren(node, ctx);
-          }
-        );
+        const defaultChildNode = await RoutingHelpers.getDefaultChildNode(pathData, async (node, ctx) => {
+          return await Navigation.getChildren(node, ctx);
+        });
 
         if (pathData.isExistingRoute) {
           //normal navigation can be performed
           const trimmedPathUrl = GenericHelpers.getTrimmedUrl(path);
-          this.navigateTo(
-            `${trimmedPathUrl ? `/${trimmedPathUrl}` : ''}/${defaultChildNode}`,
-            false
-          );
+          this.navigateTo(`${trimmedPathUrl ? `/${trimmedPathUrl}` : ''}/${defaultChildNode}`, false);
           // reset comp data
           component.set({ navigationPath: [] });
         } else {
@@ -250,9 +210,7 @@ class RoutingClass {
             //last path segment was invalid but a default node could be in its place
             this.showPageNotFoundError(
               component,
-              GenericHelpers.trimTrailingSlash(pathData.matchedPath) +
-                '/' +
-                defaultChildNode,
+              GenericHelpers.trimTrailingSlash(pathData.matchedPath) + '/' + defaultChildNode,
               pathUrlRaw,
               true
             );
@@ -264,27 +222,18 @@ class RoutingClass {
             LuigiConfig.getConfigValueAsync('navigation.nodes'),
             '/'
           );
-          const rootPath = await RoutingHelpers.getDefaultChildNode(
-            rootPathData
-          );
+          const rootPath = await RoutingHelpers.getDefaultChildNode(rootPathData);
           this.showPageNotFoundError(component, rootPath, pathUrlRaw);
         }
         return;
       }
 
       if (!pathData.isExistingRoute) {
-        this.showPageNotFoundError(
-          component,
-          pathData.matchedPath,
-          pathUrlRaw,
-          true
-        );
+        this.showPageNotFoundError(component, pathData.matchedPath, pathUrlRaw, true);
         return;
       }
 
-      const hideNav = LuigiConfig.getConfigBooleanValue(
-        'settings.hideNavigation'
-      );
+      const hideNav = LuigiConfig.getConfigBooleanValue('settings.hideNavigation');
       const params = RoutingHelpers.parseParams(pathUrlRaw.split('?')[1]);
       const nodeParams = RoutingHelpers.getNodeParams(params);
       const viewGroup = RoutingHelpers.findViewGroup(nodeObject);
@@ -365,41 +314,21 @@ class RoutingClass {
       if (config.iframe !== null) {
         const prevUrl = config.iframe.luigi.viewUrl.split('/').pop();
         if (path !== prevUrl) {
-          const { nodeObject, pathData } = await Navigation.extractDataFromPath(
-            prevUrl
-          );
+          const { nodeObject, pathData } = await Navigation.extractDataFromPath(prevUrl);
           const previousNode = nodeObject;
           Navigation.onNodeChange(previousNode, currentNode);
         }
       }
-      if (
-        nodeObject.compound &&
-        GenericHelpers.requestExperimentalFeature('webcomponents', true)
-      ) {
+      if (nodeObject.compound && GenericHelpers.requestExperimentalFeature('webcomponents', true)) {
         if (iContainer) {
           iContainer.classList.add('lui-webComponent');
         }
-        this.navigateWebComponentCompound(
-          config,
-          component,
-          iframeElement,
-          nodeObject,
-          iContainer
-        );
-      } else if (
-        nodeObject.webcomponent &&
-        GenericHelpers.requestExperimentalFeature('webcomponents', true)
-      ) {
+        this.navigateWebComponentCompound(config, component, iframeElement, nodeObject, iContainer);
+      } else if (nodeObject.webcomponent && GenericHelpers.requestExperimentalFeature('webcomponents', true)) {
         if (iContainer) {
           iContainer.classList.add('lui-webComponent');
         }
-        this.navigateWebComponent(
-          config,
-          component,
-          iframeElement,
-          nodeObject,
-          iContainer
-        );
+        this.navigateWebComponent(config, component, iframeElement, nodeObject, iContainer);
       } else {
         if (iContainer) {
           iContainer.classList.remove('lui-webComponent');
@@ -417,13 +346,8 @@ class RoutingClass {
     const additionalModalPath = RoutingHelpers.getModalPathFromPath();
     if (additionalModalPath) {
       const modalParams = RoutingHelpers.getModalParamsFromPath();
-      const { nodeObject } = await Navigation.extractDataFromPath(
-        additionalModalPath
-      );
-      LuigiNavigation.openAsModal(
-        additionalModalPath,
-        nodeObject.openNodeInModal || modalParams
-      );
+      const { nodeObject } = await Navigation.extractDataFromPath(additionalModalPath);
+      LuigiNavigation.openAsModal(additionalModalPath, nodeObject.openNodeInModal || modalParams);
     }
   }
 
@@ -438,31 +362,21 @@ class RoutingClass {
       */
   checkInvalidateCache(previousCompData, newPath) {
     let newPathArray = newPath.split('/');
-    if (
-      previousCompData.navigationPath &&
-      previousCompData.navigationPath.length > 0
-    ) {
+    if (previousCompData.navigationPath && previousCompData.navigationPath.length > 0) {
       let previousNavPathWithoutRoot = previousCompData.navigationPath.slice(1);
 
       let isSamePath = true;
       for (let i = 0; i < previousNavPathWithoutRoot.length; i++) {
-        let newPathSegment =
-          newPathArray.length > i ? newPathArray[i] : undefined;
+        let newPathSegment = newPathArray.length > i ? newPathArray[i] : undefined;
         let previousPathNode = previousNavPathWithoutRoot[i];
 
         if (newPathSegment !== previousPathNode.pathSegment || !isSamePath) {
           if (RoutingHelpers.isDynamicNode(previousPathNode)) {
             if (
               !isSamePath ||
-              newPathSegment !==
-                RoutingHelpers.getDynamicNodeValue(
-                  previousPathNode,
-                  previousCompData.pathParams
-                )
+              newPathSegment !== RoutingHelpers.getDynamicNodeValue(previousPathNode, previousCompData.pathParams)
             ) {
-              NodeDataManagementStorage.deleteNodesRecursively(
-                previousPathNode
-              );
+              NodeDataManagementStorage.deleteNodesRecursively(previousPathNode);
               break;
             }
           } else {
@@ -485,22 +399,10 @@ class RoutingClass {
       if (windowPath === GenericHelpers.trimLeadingSlash(route)) {
         const iframeContainer = IframeHelpers.getIframeContainer();
         const activeIframe = Iframe.getActiveIframe(iframeContainer);
-        if (
-          activeIframe &&
-          activeIframe.vg &&
-          Iframe.canCache(activeIframe.vg)
-        ) {
-          Iframe.switchActiveIframe(
-            IframeHelpers.getIframeContainer(),
-            undefined,
-            false
-          );
+        if (activeIframe && activeIframe.vg && Iframe.canCache(activeIframe.vg)) {
+          Iframe.switchActiveIframe(IframeHelpers.getIframeContainer(), undefined, false);
           setTimeout(() => {
-            Iframe.switchActiveIframe(
-              IframeHelpers.getIframeContainer(),
-              activeIframe,
-              false
-            );
+            Iframe.switchActiveIframe(IframeHelpers.getIframeContainer(), activeIframe, false);
             window.postMessage({ msg: 'refreshRoute' }, '*');
           });
         } else {
@@ -515,15 +417,8 @@ class RoutingClass {
     }
   }
 
-  async showPageNotFoundError(
-    component,
-    pathToRedirect,
-    notFoundPath,
-    isAnyPathMatched = false
-  ) {
-    const pageNotFoundHandler = LuigiConfig.getConfigValue(
-      'routing.pageNotFoundHandler'
-    );
+  async showPageNotFoundError(component, pathToRedirect, notFoundPath, isAnyPathMatched = false) {
+    const pageNotFoundHandler = LuigiConfig.getConfigValue('routing.pageNotFoundHandler');
 
     if (typeof pageNotFoundHandler === 'function') {
       //custom 404 handler is provided, use it
@@ -535,12 +430,9 @@ class RoutingClass {
     }
 
     const alertSettings = {
-      text: LuigiI18N.getTranslation(
-        isAnyPathMatched
-          ? 'luigi.notExactTargetNode'
-          : 'luigi.requestedRouteNotFound',
-        { route: notFoundPath }
-      ),
+      text: LuigiI18N.getTranslation(isAnyPathMatched ? 'luigi.notExactTargetNode' : 'luigi.requestedRouteNotFound', {
+        route: notFoundPath
+      }),
       type: 'error',
       ttl: 1 //how many redirections the alert will 'survive'.
     };
@@ -561,12 +453,7 @@ class RoutingClass {
       ...NAVIGATION_DEFAULTS.externalLink,
       ...externalLink
     };
-    window
-      .open(
-        updatedExternalLink.url,
-        updatedExternalLink.sameWindow ? '_self' : '_blank'
-      )
-      .focus();
+    window.open(updatedExternalLink.url, updatedExternalLink.sameWindow ? '_self' : '_blank').focus();
   }
 
   navigateWebComponent(config, component, node, navNode, iframeContainer) {
@@ -577,21 +464,10 @@ class RoutingClass {
       wc_container.lastChild.remove();
     }
 
-    WebComponentService.renderWebComponent(
-      componentData.viewUrl,
-      wc_container,
-      componentData.context,
-      navNode
-    );
+    WebComponentService.renderWebComponent(componentData.viewUrl, wc_container, componentData.context, navNode);
   }
 
-  navigateWebComponentCompound(
-    config,
-    component,
-    node,
-    navNode,
-    iframeContainer
-  ) {
+  navigateWebComponentCompound(config, component, node, navNode, iframeContainer) {
     const componentData = component.get();
     const wc_container = document.querySelector('.wcContainer');
 
@@ -599,11 +475,7 @@ class RoutingClass {
       wc_container.lastChild.remove();
     }
 
-    WebComponentService.renderWebComponentCompound(
-      navNode,
-      wc_container,
-      componentData.context
-    );
+    WebComponentService.renderWebComponentCompound(navNode, wc_container, componentData.context);
   }
 
   appendModalDataToUrl(modalPath, modalParams) {
@@ -619,17 +491,13 @@ class RoutingClass {
         params[`${modalParamName}Params`] = JSON.stringify(modalParams);
       }
       const url = new URL(location.href);
-      const hashRoutingActive = LuigiConfig.getConfigBooleanValue(
-        'routing.useHashRouting'
-      );
+      const hashRoutingActive = LuigiConfig.getConfigBooleanValue('routing.useHashRouting');
       if (hashRoutingActive) {
         const queryParamIndex = location.hash.indexOf(queryParamSeparator);
         if (queryParamIndex !== -1) {
           url.hash = url.hash.slice(0, queryParamIndex);
         }
-        url.hash = `${
-          url.hash
-        }${queryParamSeparator}${RoutingHelpers.encodeParams(params)}`;
+        url.hash = `${url.hash}${queryParamSeparator}${RoutingHelpers.encodeParams(params)}`;
       } else {
         url.search = `?${RoutingHelpers.encodeParams(params)}`;
       }
@@ -641,9 +509,7 @@ class RoutingClass {
     const params = RoutingHelpers.getQueryParams();
     const modalParamName = RoutingHelpers.getModalViewParamName();
     let url = new URL(location.href);
-    const hashRoutingActive = LuigiConfig.getConfigBooleanValue(
-      'routing.useHashRouting'
-    );
+    const hashRoutingActive = LuigiConfig.getConfigBooleanValue('routing.useHashRouting');
     if (hashRoutingActive) {
       let modalParamsObj = {};
 
@@ -651,8 +517,7 @@ class RoutingClass {
         modalParamsObj[modalParamName] = params[modalParamName];
       }
       if (params[`${modalParamName}Params`]) {
-        modalParamsObj[`${modalParamName}Params`] =
-          params[`${modalParamName}Params`];
+        modalParamsObj[`${modalParamName}Params`] = params[`${modalParamName}Params`];
       }
       let prevModalPath = RoutingHelpers.encodeParams(modalParamsObj);
       if (url.hash.includes(`?${prevModalPath}`)) {
@@ -666,11 +531,7 @@ class RoutingClass {
       searchParams.delete(`${modalParamName}Params`);
       let finalUrl = '';
       Array.from(searchParams.keys()).forEach(searchParamKey => {
-        finalUrl +=
-          (finalUrl === '' ? '?' : '&') +
-          searchParamKey +
-          '=' +
-          searchParams.get(searchParamKey);
+        finalUrl += (finalUrl === '' ? '?' : '&') + searchParamKey + '=' + searchParams.get(searchParamKey);
       });
       url.search = finalUrl;
     }
diff --git a/core/src/services/split-view.js b/core/src/services/split-view.js
index c6e31e3161..8a2b9fa021 100644
--- a/core/src/services/split-view.js
+++ b/core/src/services/split-view.js
@@ -1,10 +1,6 @@
 import { LuigiConfig, LuigiElements } from '../core-api';
 import { Navigation } from '../navigation/services/navigation';
-import {
-  GenericHelpers,
-  IframeHelpers,
-  RoutingHelpers
-} from '../utilities/helpers';
+import { GenericHelpers, IframeHelpers, RoutingHelpers } from '../utilities/helpers';
 import { WebComponentService } from './web-components';
 
 class SplitViewSvcClass {
@@ -29,9 +25,7 @@ class SplitViewSvcClass {
     return document.querySelector('#splitViewDragger>.lui-collapse-btn');
   }
   getCollapsedDraggerButton() {
-    return document.querySelector(
-      '#splitViewDraggerCollapsed>.lui-collapse-btn'
-    );
+    return document.querySelector('#splitViewDraggerCollapsed>.lui-collapse-btn');
   }
   getDraggerBackdrop() {
     return document.getElementById('splitViewDraggerBackdrop');
@@ -50,24 +44,15 @@ class SplitViewSvcClass {
     if (viewUrl) {
       viewUrl = RoutingHelpers.substituteViewUrl(viewUrl, componentData);
     }
-    const iframe = IframeHelpers.createIframe(
-      viewUrl,
-      undefined,
-      component.get().lastNode,
-      'split-view'
-    );
+    const iframe = IframeHelpers.createIframe(viewUrl, undefined, component.get().lastNode, 'split-view');
     const iframeCtn = document.querySelector('.iframeSplitViewCnt');
     iframeCtn.appendChild(iframe);
     return iframe;
   }
 
   async prepareSplitViewData(component, path) {
-    const pathUrlRaw =
-      path && path.length ? GenericHelpers.getPathWithoutHash(path) : '';
-    const pathData = await Navigation.getNavigationPath(
-      LuigiConfig.getConfigValueAsync('navigation.nodes'),
-      path
-    );
+    const pathUrlRaw = path && path.length ? GenericHelpers.getPathWithoutHash(path) : '';
+    const pathData = await Navigation.getNavigationPath(LuigiConfig.getConfigValueAsync('navigation.nodes'), path);
     const params = RoutingHelpers.parseParams(pathUrlRaw.split('?')[1]);
     const nodeParams = RoutingHelpers.getNodeParams(params);
     const lastNode = RoutingHelpers.getLastNodeObject(pathData);
@@ -133,8 +118,7 @@ class SplitViewSvcClass {
   // required for iOS to force repaint, else scrolling does not work
   /* istanbul ignore next */
   fixIOSscroll() {
-    const iOS =
-      !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);
+    const iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);
     if (!iOS) {
       return;
     }
@@ -152,14 +136,10 @@ class SplitViewSvcClass {
   calculateInitialValues(size, rightContentHeight) {
     if (rightContentHeight) {
       const percentBottom = size || 40;
-      const bottom = parseInt(
-        GenericHelpers.computePxFromPercent(rightContentHeight, percentBottom)
-      );
+      const bottom = parseInt(GenericHelpers.computePxFromPercent(rightContentHeight, percentBottom));
 
       const percentTop = size ? 100 - size : 60;
-      const top = parseInt(
-        GenericHelpers.computePxFromPercent(rightContentHeight, percentTop)
-      );
+      const top = parseInt(GenericHelpers.computePxFromPercent(rightContentHeight, percentTop));
 
       return {
         percent: percentBottom,
@@ -171,18 +151,10 @@ class SplitViewSvcClass {
 
   calculateAndSetSplitViewValues(percentBottom, values) {
     const newBottom =
-      parseInt(
-        GenericHelpers.computePxFromPercent(
-          values.rightContentHeight,
-          100 - percentBottom
-        )
-      ) + LuigiElements.getShellbar().clientHeight;
+      parseInt(GenericHelpers.computePxFromPercent(values.rightContentHeight, 100 - percentBottom)) +
+      LuigiElements.getShellbar().clientHeight;
 
-    this.splitViewValues = this.enforceTresholds(
-      newBottom,
-      values.innerHeight - newBottom,
-      values
-    );
+    this.splitViewValues = this.enforceTresholds(newBottom, values.innerHeight - newBottom, values);
   }
 
   enforceTresholds(top, bottom) {
@@ -198,10 +170,7 @@ class SplitViewSvcClass {
     return {
       top,
       bottom,
-      percent: GenericHelpers.computePercentFromPx(
-        iv.rightContentHeight,
-        bottom
-      )
+      percent: GenericHelpers.computePercentFromPx(iv.rightContentHeight, bottom)
     };
   }
 
@@ -230,9 +199,7 @@ class SplitViewSvcClass {
     if (comp.get().splitViewIframe || comp.get().splitViewWC) {
       comp
         .getUnsavedChangesModalPromise(
-          comp.get().splitViewWC
-            ? comp.get().splitViewWC
-            : comp.get().splitViewIframe.contentWindow
+          comp.get().splitViewWC ? comp.get().splitViewWC : comp.get().splitViewIframe.contentWindow
         )
         .then(() => {
           if (comp.get().mfSplitView) {
@@ -276,9 +243,7 @@ class SplitViewSvcClass {
     if (comp.get().splitViewIframe || comp.get().splitViewWC) {
       comp
         .getUnsavedChangesModalPromise(
-          comp.get().splitViewWC
-            ? comp.get().splitViewWC
-            : comp.get().splitViewIframe.contentWindow
+          comp.get().splitViewWC ? comp.get().splitViewWC : comp.get().splitViewIframe.contentWindow
         )
         .then(() => {
           this.sendMessageToClients('internal', {
diff --git a/core/src/services/viewurl-decorator.js b/core/src/services/viewurl-decorator.js
index e52f75731b..ee240d2f37 100644
--- a/core/src/services/viewurl-decorator.js
+++ b/core/src/services/viewurl-decorator.js
@@ -22,9 +22,7 @@ class ViewUrlDecoratorSvc {
   }
 
   add(decorator) {
-    this.decorators = this.decorators
-      .filter(d => d.uid !== decorator.uid)
-      .concat(decorator);
+    this.decorators = this.decorators.filter(d => d.uid !== decorator.uid).concat(decorator);
   }
 
   applyDecorators(url) {
@@ -33,9 +31,7 @@ class ViewUrlDecoratorSvc {
     }
     const urlObj = new URL(GenericHelpers.prependOrigin(url));
     // apply query params
-    const queryParamDecorators = this.decorators.filter(
-      d => d.type === 'queryString'
-    );
+    const queryParamDecorators = this.decorators.filter(d => d.type === 'queryString');
     for (let i = 0; i < queryParamDecorators.length; i++) {
       const decorator = queryParamDecorators[i];
       if (urlObj.searchParams.has(decorator.key)) {
diff --git a/core/src/services/web-components.js b/core/src/services/web-components.js
index a98aaadca4..886cfc5be9 100644
--- a/core/src/services/web-components.js
+++ b/core/src/services/web-components.js
@@ -139,9 +139,7 @@ class WebComponentSvcClass {
         return true; // same host is okay
       }
 
-      const valids = LuigiConfig.getConfigValue(
-        'navigation.validWebcomponentUrls'
-      );
+      const valids = LuigiConfig.getConfigValue('navigation.validWebcomponentUrls');
       if (valids && valids.length > 0) {
         for (let el of valids) {
           try {
@@ -164,55 +162,25 @@ class WebComponentSvcClass {
    */
   renderWebComponent(viewUrl, wc_container, context, node, nodeId) {
     const wc_id =
-      node.webcomponent && node.webcomponent.tagName
-        ? node.webcomponent.tagName
-        : this.generateWCId(viewUrl);
+      node.webcomponent && node.webcomponent.tagName ? node.webcomponent.tagName : this.generateWCId(viewUrl);
     const wcItemPlaceholder = document.createElement('div');
     wc_container.appendChild(wcItemPlaceholder);
 
     if (window.customElements.get(wc_id)) {
-      this.attachWC(
-        wc_id,
-        wcItemPlaceholder,
-        wc_container,
-        context,
-        viewUrl,
-        nodeId
-      );
+      this.attachWC(wc_id, wcItemPlaceholder, wc_container, context, viewUrl, nodeId);
     } else {
       /** Custom import function, if defined */
       if (window.luigiWCFn) {
         window.luigiWCFn(viewUrl, wc_id, wcItemPlaceholder, () => {
-          this.attachWC(
-            wc_id,
-            wcItemPlaceholder,
-            wc_container,
-            context,
-            viewUrl,
-            nodeId
-          );
+          this.attachWC(wc_id, wcItemPlaceholder, wc_container, context, viewUrl, nodeId);
         });
       } else if (node.webcomponent && node.webcomponent.selfRegistered) {
         this.includeSelfRegisteredWCFromUrl(node, viewUrl, () => {
-          this.attachWC(
-            wc_id,
-            wcItemPlaceholder,
-            wc_container,
-            context,
-            viewUrl,
-            nodeId
-          );
+          this.attachWC(wc_id, wcItemPlaceholder, wc_container, context, viewUrl, nodeId);
         });
       } else {
         this.registerWCFromUrl(viewUrl, wc_id).then(() => {
-          this.attachWC(
-            wc_id,
-            wcItemPlaceholder,
-            wc_container,
-            context,
-            viewUrl,
-            nodeId
-          );
+          this.attachWC(wc_id, wcItemPlaceholder, wc_container, context, viewUrl, nodeId);
         });
       }
     }
@@ -275,16 +243,11 @@ class WebComponentSvcClass {
 
             listeners.forEach(listenerInfo => {
               const target =
-                listenerInfo.wcElement ||
-                compoundCnt.querySelector(
-                  '[nodeId=' + listenerInfo.wcElementId + ']'
-                );
+                listenerInfo.wcElement || compoundCnt.querySelector('[nodeId=' + listenerInfo.wcElementId + ']');
               if (target) {
                 target.dispatchEvent(
                   new CustomEvent(listenerInfo.action, {
-                    detail: listenerInfo.converter
-                      ? listenerInfo.converter(event.detail)
-                      : event.detail
+                    detail: listenerInfo.converter ? listenerInfo.converter(event.detail) : event.detail
                   })
                 );
               } else {
@@ -295,9 +258,7 @@ class WebComponentSvcClass {
         };
         navNode.compound.children.forEach((wc, index) => {
           const ctx = { ...context, ...wc.context };
-          const compoundItemCnt = renderer.createCompoundItemContainer(
-            wc.layoutConfig
-          );
+          const compoundItemCnt = renderer.createCompoundItemContainer(wc.layoutConfig);
           compoundItemCnt.eventBus = compoundCnt.eventBus;
           renderer.attachCompoundItem(compoundCnt, compoundItemCnt);
 
@@ -308,12 +269,7 @@ class WebComponentSvcClass {
         wc_container.appendChild(compoundCnt);
 
         // listener for nesting wc
-        registerEventListeners(
-          ebListeners,
-          navNode.compound,
-          undefined,
-          compoundCnt
-        );
+        registerEventListeners(ebListeners, navNode.compound, undefined, compoundCnt);
         resolve(compoundCnt);
       });
     });
diff --git a/core/src/utilities/constants.js b/core/src/utilities/constants.js
index 8c2baa42c8..2c76625da7 100644
--- a/core/src/utilities/constants.js
+++ b/core/src/utilities/constants.js
@@ -8,7 +8,6 @@ export const MICROFRONTEND_TYPES = [
   { type: 'modal', selector: '.iframeModalCtn._modal iframe' },
   { type: 'drawer', selector: '.iframeModalCtn._drawer iframe' },
   { type: 'user-settings', selector: '.iframeUserSettingsCtn iframe' }
-
 ];
 
 export const CUSTOM_LUIGI_CONTAINER = {
@@ -17,4 +16,4 @@ export const CUSTOM_LUIGI_CONTAINER = {
 
 export const APP_LOADING_INDICATOR = {
   cssSelector: '[luigi-app-loading-indicator]'
-};
\ No newline at end of file
+};
diff --git a/core/src/utilities/defaultLuigiTranslationTable.js b/core/src/utilities/defaultLuigiTranslationTable.js
index fbd47cab7e..37a8a5f271 100644
--- a/core/src/utilities/defaultLuigiTranslationTable.js
+++ b/core/src/utilities/defaultLuigiTranslationTable.js
@@ -13,8 +13,7 @@ const defaultLuigiInternalTranslationTable = {
       confirm: 'Yes'
     },
     requestedRouteNotFound: 'Could not find the requested route {route}.',
-    notExactTargetNode:
-      'Could not map the exact target node for the requested route {route}.'
+    notExactTargetNode: 'Could not map the exact target node for the requested route {route}.'
   }
 };
 
diff --git a/core/src/utilities/helpers/async-helpers.js b/core/src/utilities/helpers/async-helpers.js
index 51d1b2c900..56f9f92488 100644
--- a/core/src/utilities/helpers/async-helpers.js
+++ b/core/src/utilities/helpers/async-helpers.js
@@ -17,9 +17,7 @@ class AsyncHelpersClass {
         }
         if (Date.now() - startTimer > timeout) {
           clearInterval(this.handles[name]);
-          return reject(
-            `${name} did not appear in object within ${timeout / 1000} seconds.`
-          );
+          return reject(`${name} did not appear in object within ${timeout / 1000} seconds.`);
         }
       }, this.keyExistencyCheckInterval);
     });
diff --git a/core/src/utilities/helpers/auth-helpers.js b/core/src/utilities/helpers/auth-helpers.js
index a33fb9ca40..f4f7f167dd 100644
--- a/core/src/utilities/helpers/auth-helpers.js
+++ b/core/src/utilities/helpers/auth-helpers.js
@@ -9,8 +9,7 @@ class AuthHelpersClass {
 
   isLoggedIn() {
     const storedAuthData = this.getStoredAuthData();
-    const isAuthValid = () =>
-      storedAuthData.accessTokenExpirationDate > Number(new Date());
+    const isAuthValid = () => storedAuthData.accessTokenExpirationDate > Number(new Date());
     return storedAuthData && isAuthValid();
   }
 
diff --git a/core/src/utilities/helpers/escaping-helpers.js b/core/src/utilities/helpers/escaping-helpers.js
index 7c4bcff422..ea80bfdbef 100644
--- a/core/src/utilities/helpers/escaping-helpers.js
+++ b/core/src/utilities/helpers/escaping-helpers.js
@@ -20,19 +20,7 @@ class EscapingHelpersClass {
 
   restoreSanitizedElements(text) {
     let result = text;
-    const elements = [
-      'i',
-      'b',
-      'br',
-      'mark',
-      'strong',
-      'em',
-      'small',
-      'del',
-      'ins',
-      'sub',
-      'sup'
-    ];
+    const elements = ['i', 'b', 'br', 'mark', 'strong', 'em', 'small', 'del', 'ins', 'sub', 'sup'];
 
     for (let i = 0; i < elements.length; i++) {
       const openTag_1 = new RegExp(`&lt;${elements[i]}\/&gt;`, 'g');
@@ -86,9 +74,7 @@ class EscapingHelpersClass {
 
     return Object.entries(links).reduce((acc, [key, content]) => {
       const elemId = `_luigi_alert_${uniqueID}_link_${this.sanitizeParam(key)}`;
-      const escapedText = this.restoreSanitizedBrs(
-        this.sanitizeHtml(content.text)
-      );
+      const escapedText = this.restoreSanitizedBrs(this.sanitizeHtml(content.text));
       const processedData = `<a id="${elemId}">${escapedText}</a>`;
       const keyForRegex = this.escapeKeyForRegexp(key);
       const pattern = new RegExp(`({${keyForRegex}})`, 'g');
diff --git a/core/src/utilities/helpers/event-listener-helpers.js b/core/src/utilities/helpers/event-listener-helpers.js
index e2e7e6f451..2e1b26362f 100644
--- a/core/src/utilities/helpers/event-listener-helpers.js
+++ b/core/src/utilities/helpers/event-listener-helpers.js
@@ -11,9 +11,7 @@ class EventListenerHelpersClass {
   }
 
   removeEventListener(type, listenerFn) {
-    this.listeners = this.listeners.filter(
-      l => !(l.type === type && l.listenerFn === listenerFn)
-    );
+    this.listeners = this.listeners.filter(l => !(l.type === type && l.listenerFn === listenerFn));
     window.removeEventListener(type, listenerFn);
   }
 
@@ -23,7 +21,6 @@ class EventListenerHelpersClass {
     });
     this.listeners = [];
   }
-
 }
 
 export const EventListenerHelpers = new EventListenerHelpersClass();
diff --git a/core/src/utilities/helpers/generic-helpers.js b/core/src/utilities/helpers/generic-helpers.js
index ea64c8b899..8ab54fa730 100644
--- a/core/src/utilities/helpers/generic-helpers.js
+++ b/core/src/utilities/helpers/generic-helpers.js
@@ -10,9 +10,7 @@ class GenericHelpersClass {
    */
   getRandomId() {
     // window.msCrypto for IE 11
-    return (window.crypto || window.msCrypto).getRandomValues(
-      new Uint32Array(1)
-    )[0];
+    return (window.crypto || window.msCrypto).getRandomValues(new Uint32Array(1))[0];
   }
 
   isFunction(anyParam) {
@@ -70,11 +68,7 @@ class GenericHelpersClass {
     // We assume that any URL not starting with
     // http is on the current page's domain
     if (!urlWithoutHash.startsWith('http')) {
-      return (
-        window.location.origin +
-        (urlWithoutHash.startsWith('/') ? '' : '/') +
-        urlWithoutHash
-      );
+      return window.location.origin + (urlWithoutHash.startsWith('/') ? '' : '/') + urlWithoutHash;
     }
     return urlWithoutHash;
   }
@@ -204,32 +198,19 @@ class GenericHelpersClass {
     if (params) {
       Object.entries(params).forEach(entry => {
         processedString = processedString.replace(
-          new RegExp(
-            this.escapeRegExp(
-              (parenthesis ? '{' : '') +
-                prefix +
-                entry[0] +
-                (parenthesis ? '}' : '')
-            ),
-            'g'
-          ),
+          new RegExp(this.escapeRegExp((parenthesis ? '{' : '') + prefix + entry[0] + (parenthesis ? '}' : '')), 'g'),
           encodeURIComponent(entry[1])
         );
       });
     }
     if (parenthesis) {
-      processedString = processedString.replace(
-        new RegExp('\\{' + this.escapeRegExp(prefix) + '[^\\}]+\\}', 'g'),
-        ''
-      );
+      processedString = processedString.replace(new RegExp('\\{' + this.escapeRegExp(prefix) + '[^\\}]+\\}', 'g'), '');
     }
     return processedString;
   }
 
   getInnerHeight() {
-    return LuigiElements.isCustomLuigiContainer()
-      ? LuigiElements.getLuigiContainer().clientHeight
-      : window.innerHeight;
+    return LuigiElements.isCustomLuigiContainer() ? LuigiElements.getLuigiContainer().clientHeight : window.innerHeight;
   }
 
   getContentAreaHeight() {
@@ -245,9 +226,7 @@ class GenericHelpersClass {
   }
 
   isElementVisible(element) {
-    const cssDisplayValue = window
-      .getComputedStyle(element, null)
-      .getPropertyValue('display');
+    const cssDisplayValue = window.getComputedStyle(element, null).getPropertyValue('display');
     return cssDisplayValue !== 'none';
   }
 
@@ -276,9 +255,7 @@ class GenericHelpersClass {
   removeProperties(input, keys) {
     const res = {};
     if (!keys instanceof Array || !keys.length) {
-      console.error(
-        '[ERROR] removeProperties requires second parameter: array of keys to remove from object.'
-      );
+      console.error('[ERROR] removeProperties requires second parameter: array of keys to remove from object.');
       return input;
     }
     for (const key in input) {
@@ -330,9 +307,7 @@ class GenericHelpersClass {
    * @returns true, if feature enabled, false otherwise.
    */
   requestExperimentalFeature(expFeatureName, showWarn) {
-    const val = Boolean(
-      LuigiConfig.getConfigValue('settings.experimental.' + expFeatureName)
-    );
+    const val = Boolean(LuigiConfig.getConfigValue('settings.experimental.' + expFeatureName));
     if (showWarn && !val) {
       console.warn('Experimental feature not enabled: ', expFeatureName);
     }
diff --git a/core/src/utilities/helpers/iframe-helpers.js b/core/src/utilities/helpers/iframe-helpers.js
index 3f7fab6847..3e062ba344 100644
--- a/core/src/utilities/helpers/iframe-helpers.js
+++ b/core/src/utilities/helpers/iframe-helpers.js
@@ -59,12 +59,7 @@ class IframeHelpersClass {
       Object.entries(params).forEach(entry => {
         processedUrl = processedUrl.replace(
           new RegExp(
-            GenericHelpers.escapeRegExp(
-              (parenthesis ? '{' : '') +
-              prefix +
-              entry[0] +
-              (parenthesis ? '}' : '')
-            ),
+            GenericHelpers.escapeRegExp((parenthesis ? '{' : '') + prefix + entry[0] + (parenthesis ? '}' : '')),
             'g'
           ),
           encodeURIComponent(entry[1])
@@ -73,10 +68,7 @@ class IframeHelpersClass {
     }
     if (parenthesis) {
       processedUrl = processedUrl.replace(
-        new RegExp(
-          '\\{' + GenericHelpers.escapeRegExp(prefix) + '[^\\}]+\\}',
-          'g'
-        ),
+        new RegExp('\\{' + GenericHelpers.escapeRegExp(prefix) + '[^\\}]+\\}', 'g'),
         ''
       );
     }
@@ -87,9 +79,7 @@ class IframeHelpersClass {
     //TODO rename to reflect the fact that it checks for URL till hash (which is more than just domain)
     if (config.iframe) {
       const componentData = component.get();
-      const previousUrl = GenericHelpers.getUrlWithoutHash(
-        componentData.previousNodeValues.viewUrl
-      );
+      const previousUrl = GenericHelpers.getUrlWithoutHash(componentData.previousNodeValues.viewUrl);
       const nextUrl = GenericHelpers.getUrlWithoutHash(componentData.viewUrl);
       const previousViewGroup = componentData.previousNodeValues.viewGroup;
       const nextViewGroup = componentData.viewGroup;
@@ -103,20 +93,14 @@ class IframeHelpersClass {
   isSameViewGroup(config, component) {
     if (config.iframe) {
       const componentData = component.get();
-      const previousUrl = GenericHelpers.getUrlWithoutHash(
-        componentData.previousNodeValues.viewUrl
-      );
+      const previousUrl = GenericHelpers.getUrlWithoutHash(componentData.previousNodeValues.viewUrl);
       const nextUrl = GenericHelpers.getUrlWithoutHash(componentData.viewUrl);
       const previousUrlOrigin = this.getLocation(previousUrl);
       const nextUrlOrigin = this.getLocation(nextUrl);
       if (previousUrlOrigin === nextUrlOrigin) {
         const previousViewGroup = componentData.previousNodeValues.viewGroup;
         const nextViewGroup = componentData.viewGroup;
-        if (
-          previousViewGroup &&
-          nextViewGroup &&
-          previousViewGroup === nextViewGroup
-        ) {
+        if (previousViewGroup && nextViewGroup && previousViewGroup === nextViewGroup) {
           return true;
         }
       }
@@ -125,10 +109,7 @@ class IframeHelpersClass {
   }
 
   canReuseIframe(config, component) {
-    return (
-      this.isSameDomain(config, component) ||
-      this.isSameViewGroup(config, component)
-    );
+    return this.isSameDomain(config, component) || this.isSameViewGroup(config, component);
   }
 
   getLocation(url) {
@@ -185,9 +166,7 @@ class IframeHelpersClass {
 
   getCurrentMicrofrontendIframe() {
     const modalIframes = this.getModalIframes();
-    const mainIframes = this.getMainIframes().filter(
-      GenericHelpers.isElementVisible
-    );
+    const mainIframes = this.getMainIframes().filter(GenericHelpers.isElementVisible);
 
     return modalIframes[0] || mainIframes[0] || null;
   }
@@ -223,15 +202,11 @@ class IframeHelpersClass {
   }
 
   sendMessageToVisibleIframes(message) {
-    this.getVisibleIframes().forEach(iframe =>
-      this.sendMessageToIframe(iframe, message)
-    );
+    this.getVisibleIframes().forEach(iframe => this.sendMessageToIframe(iframe, message));
   }
 
   broadcastMessageToAllIframes(message) {
-    IframeHelpers.getMicrofrontendIframes().forEach(iframe =>
-      this.sendMessageToIframe(iframe, message)
-    );
+    IframeHelpers.getMicrofrontendIframes().forEach(iframe => this.sendMessageToIframe(iframe, message));
   }
 
   createIframe(viewUrl, viewGroup, currentNode, microFrontendType) {
@@ -250,18 +225,14 @@ class IframeHelpersClass {
       // 'allow-top-navigation-by-user-activation', // Lets the resource navigate the top-level browsing context, but only if initiated by a user gesture.
       // 'allow-downloads-without-user-activation' // Allows for downloads to occur without a gesture from the user.
     ];
-    const customSandboxRules = LuigiConfig.getConfigValue(
-      'settings.customSandboxRules'
-    );
+    const customSandboxRules = LuigiConfig.getConfigValue('settings.customSandboxRules');
     const allowRules = LuigiConfig.getConfigValue('settings.allowRules');
     const activeSandboxRules = customSandboxRules
       ? [...new Set([...luigiDefaultSandboxRules, ...customSandboxRules])]
       : luigiDefaultSandboxRules;
 
     const iframe = document.createElement('iframe');
-    iframe.src = ViewUrlDecorator.hasDecorators()
-      ? ViewUrlDecorator.applyDecorators(viewUrl)
-      : viewUrl;
+    iframe.src = ViewUrlDecorator.hasDecorators() ? ViewUrlDecorator.applyDecorators(viewUrl) : viewUrl;
     if (allowRules) {
       iframe.allow = allowRules.join(' ');
     }
@@ -278,9 +249,7 @@ class IframeHelpersClass {
     if (currentNode && currentNode.clientPermissions) {
       iframe.luigi.clientPermissions = currentNode.clientPermissions;
     }
-    const iframeInterceptor = LuigiConfig.getConfigValue(
-      'settings.iframeCreationInterceptor'
-    );
+    const iframeInterceptor = LuigiConfig.getConfigValue('settings.iframeCreationInterceptor');
     if (GenericHelpers.isFunction(iframeInterceptor)) {
       try {
         iframeInterceptor(iframe, viewGroup, currentNode, microFrontendType);
@@ -300,9 +269,7 @@ class IframeHelpersClass {
       ...IframeHelpers.getMicrofrontendIframes(),
       { contentWindow: window, luigi: { viewUrl: window.location.href } }
     ];
-    const iframe = allMessagesSources.find(iframe =>
-      this.isMessageSource(e, iframe)
-    );
+    const iframe = allMessagesSources.find(iframe => this.isMessageSource(e, iframe));
 
     if (!iframe || !iframe.luigi || !iframe.luigi.viewUrl) {
       return undefined;
@@ -313,9 +280,7 @@ class IframeHelpersClass {
       return undefined;
     }
 
-    const viewUrl = navigateOkMsg
-      ? iframe.luigi.nextViewUrl
-      : iframe.luigi.viewUrl;
+    const viewUrl = navigateOkMsg ? iframe.luigi.nextViewUrl : iframe.luigi.viewUrl;
     if (!this.iframeIsSameDomain(viewUrl, e.origin)) {
       return undefined;
     }
diff --git a/core/src/utilities/helpers/index.js b/core/src/utilities/helpers/index.js
index ff0eb77668..73e0831ca8 100644
--- a/core/src/utilities/helpers/index.js
+++ b/core/src/utilities/helpers/index.js
@@ -7,5 +7,5 @@ export * from './navigation-helpers';
 export * from './routing-helpers';
 export * from './state-helpers';
 export * from './event-listener-helpers';
-export * from './storage-helper'
-export * from './usersetting-dialog-helpers'
+export * from './storage-helper';
+export * from './usersetting-dialog-helpers';
diff --git a/core/src/utilities/helpers/navigation-helpers.js b/core/src/utilities/helpers/navigation-helpers.js
index bffd2f1907..dce517bf71 100644
--- a/core/src/utilities/helpers/navigation-helpers.js
+++ b/core/src/utilities/helpers/navigation-helpers.js
@@ -1,10 +1,5 @@
 // Helper methods for 'navigation.js' file. They don't require any method from 'navigation.js` but are required by them.
-import {
-  LuigiAuth,
-  LuigiConfig,
-  LuigiFeatureToggles,
-  LuigiI18N
-} from '../../core-api';
+import { LuigiAuth, LuigiConfig, LuigiFeatureToggles, LuigiI18N } from '../../core-api';
 import { AuthHelpers, GenericHelpers } from './';
 import { Navigation } from '../../navigation/services/navigation';
 import { Routing } from '../../services/routing';
@@ -48,17 +43,11 @@ class NavigationHelpersClass {
       const loggedIn = AuthHelpers.isLoggedIn();
       const anon = nodeToCheckPermissionFor.anonymousAccess;
 
-      if (
-        (loggedIn && anon === 'exclusive') ||
-        (!loggedIn && anon !== 'exclusive' && anon !== true)
-      ) {
+      if ((loggedIn && anon === 'exclusive') || (!loggedIn && anon !== 'exclusive' && anon !== true)) {
         return false;
       }
     }
-    if (
-      nodeToCheckPermissionFor &&
-      nodeToCheckPermissionFor.visibleForFeatureToggles
-    ) {
+    if (nodeToCheckPermissionFor && nodeToCheckPermissionFor.visibleForFeatureToggles) {
       let activeFeatureToggles = LuigiFeatureToggles.getActiveFeatureToggleList();
       for (let ft of nodeToCheckPermissionFor.visibleForFeatureToggles) {
         if (ft.startsWith('!')) {
@@ -72,17 +61,11 @@ class NavigationHelpersClass {
         }
       }
     }
-    const permissionCheckerFn = LuigiConfig.getConfigValue(
-      'navigation.nodeAccessibilityResolver'
-    );
+    const permissionCheckerFn = LuigiConfig.getConfigValue('navigation.nodeAccessibilityResolver');
     if (typeof permissionCheckerFn !== 'function') {
       return true;
     }
-    return permissionCheckerFn(
-      nodeToCheckPermissionFor,
-      parentNode,
-      currentContext
-    );
+    return permissionCheckerFn(nodeToCheckPermissionFor, parentNode, currentContext);
   }
 
   applyContext(context, addition, navigationContext) {
@@ -141,11 +124,7 @@ class NavigationHelpersClass {
         if (useVirtualGroups && category) {
           virtualGroupCounter++;
         }
-        if (
-          metaInfo.order === undefined ||
-          metaInfo.order === null ||
-          metaInfo.order === ''
-        ) {
+        if (metaInfo.order === undefined || metaInfo.order === null || metaInfo.order === '') {
           metaInfo.order = key ? groupCounter++ : -1;
         }
         arr = [];
@@ -155,9 +134,7 @@ class NavigationHelpersClass {
         arr.metaInfo = metaInfo;
       }
       if (!arr.metaInfo.categoryUid && key && arr.metaInfo.collapsible) {
-        arr.metaInfo.categoryUid = node.parent
-          ? this.getNodePath(node.parent) + ':' + key
-          : key;
+        arr.metaInfo.categoryUid = node.parent ? this.getNodePath(node.parent) + ':' + key : key;
       }
       if (!node.hideFromNav) {
         arr.push(node);
@@ -214,8 +191,7 @@ class NavigationHelpersClass {
               count: () => badgeCount
             };
           } else if (hasBadge) {
-            const updatedCount =
-              cats[catLabel].badgeCounter.count() + badgeCount;
+            const updatedCount = cats[catLabel].badgeCounter.count() + badgeCount;
             cats[catLabel].badgeCounter.count = () => updatedCount;
           }
         } else {
@@ -278,9 +254,7 @@ class NavigationHelpersClass {
     if (value) {
       if (replace) {
         // Filter out other categories
-        expandedList = expandedList.filter(
-          f => f.indexOf(context + ':') === -1
-        );
+        expandedList = expandedList.filter(f => f.indexOf(context + ':') === -1);
       }
 
       if (expandedList.indexOf(key) < 0) {
@@ -304,22 +278,15 @@ class NavigationHelpersClass {
     if (node.errorFn) {
       node.errorFn();
     } else {
-      console.warn(
-        'Something went wrong with a client! You will be redirected to another page.'
-      );
+      console.warn('Something went wrong with a client! You will be redirected to another page.');
       const path = node.redirectPath || '/';
       Routing.navigateTo(path);
     }
   }
 
   getBurgerTooltipConfig() {
-    const burgerTooltipSettings = LuigiConfig.getConfigValue(
-      'settings.burgerTooltip'
-    );
-    if (
-      GenericHelpers.isObject(burgerTooltipSettings) ||
-      burgerTooltipSettings === true
-    ) {
+    const burgerTooltipSettings = LuigiConfig.getConfigValue('settings.burgerTooltip');
+    if (GenericHelpers.isObject(burgerTooltipSettings) || burgerTooltipSettings === true) {
       const expandNavTooltip = burgerTooltipSettings.navExpanded
         ? LuigiI18N.getTranslation(burgerTooltipSettings.navExpanded)
         : 'Collapse navigation';
diff --git a/core/src/utilities/helpers/routing-helpers.js b/core/src/utilities/helpers/routing-helpers.js
index 831587b4e5..7d3ff3ae4d 100644
--- a/core/src/utilities/helpers/routing-helpers.js
+++ b/core/src/utilities/helpers/routing-helpers.js
@@ -1,12 +1,7 @@
 // Helper methods for 'routing.js' file. They don't require any method from 'routing.js' but are required by them.
 // They are also rarely used directly from outside of 'routing.js'
 import { LuigiConfig, LuigiFeatureToggles } from '../../core-api';
-import {
-  AsyncHelpers,
-  EscapingHelpers,
-  EventListenerHelpers,
-  GenericHelpers
-} from './';
+import { AsyncHelpers, EscapingHelpers, EventListenerHelpers, GenericHelpers } from './';
 import { Routing } from '../../services/routing';
 
 class RoutingHelpersClass {
@@ -22,39 +17,26 @@ class RoutingHelpersClass {
   }
 
   async getDefaultChildNode(pathData, childrenResolverFn) {
-    const lastElement =
-      pathData.navigationPath[pathData.navigationPath.length - 1];
+    const lastElement = pathData.navigationPath[pathData.navigationPath.length - 1];
 
     const children = childrenResolverFn
       ? await childrenResolverFn(lastElement, pathData.context)
-      : await AsyncHelpers.getConfigValueFromObjectAsync(
-          lastElement,
-          'children',
-          pathData.context
-        );
-    const pathExists = children.find(
-      childNode => childNode.pathSegment === lastElement.defaultChildNode
-    );
+      : await AsyncHelpers.getConfigValueFromObjectAsync(lastElement, 'children', pathData.context);
+    const pathExists = children.find(childNode => childNode.pathSegment === lastElement.defaultChildNode);
 
     if (lastElement.defaultChildNode && pathExists) {
       return lastElement.defaultChildNode;
     } else if (children && children.length) {
       const rootPath = pathData.navigationPath.length === 1;
       if (rootPath) {
-        const firstNodeWithPathSegment = children.find(
-          child => child.pathSegment
-        );
+        const firstNodeWithPathSegment = children.find(child => child.pathSegment);
         return (
           (firstNodeWithPathSegment && firstNodeWithPathSegment.pathSegment) ||
-          console.error(
-            'At least one navigation node in the root hierarchy must have a pathSegment.'
-          )
+          console.error('At least one navigation node in the root hierarchy must have a pathSegment.')
         );
       }
       const validChild = children.find(
-        child =>
-          child.pathSegment &&
-          (child.viewUrl || (child.externalLink && child.externalLink.url))
+        child => child.pathSegment && (child.viewUrl || (child.externalLink && child.externalLink.url))
       );
       if (validChild) return validChild.pathSegment;
     }
@@ -70,9 +52,7 @@ class RoutingHelpersClass {
       pairs.forEach(pairString => {
         const keyValue = pairString.split('=');
         if (keyValue && keyValue.length > 0) {
-          result[decodeURIComponent(keyValue[0])] = decodeURIComponent(
-            keyValue[1]
-          );
+          result[decodeURIComponent(keyValue[0])] = decodeURIComponent(keyValue[1]);
         }
       });
     }
@@ -82,9 +62,7 @@ class RoutingHelpersClass {
   encodeParams(dataObj) {
     let queryArr = [];
     for (let key in dataObj) {
-      queryArr.push(
-        encodeURIComponent(key) + '=' + encodeURIComponent(dataObj[key])
-      );
+      queryArr.push(encodeURIComponent(key) + '=' + encodeURIComponent(dataObj[key]));
     }
     return queryArr.join('&');
   }
@@ -153,25 +131,15 @@ class RoutingHelpersClass {
     return this.getQueryParams()[paramName];
   }
   getQueryParams() {
-    const hashRoutingActive = LuigiConfig.getConfigBooleanValue(
-      'routing.useHashRouting'
-    );
-    return hashRoutingActive
-      ? this.getLocationHashQueryParams()
-      : this.getLocationSearchQueryParams();
+    const hashRoutingActive = LuigiConfig.getConfigBooleanValue('routing.useHashRouting');
+    return hashRoutingActive ? this.getLocationHashQueryParams() : this.getLocationSearchQueryParams();
   }
   getLocationHashQueryParams() {
-    const queryParamIndex = location.hash.indexOf(
-      this.defaultQueryParamSeparator
-    );
-    return queryParamIndex !== -1
-      ? RoutingHelpers.parseParams(location.hash.slice(queryParamIndex + 1))
-      : {};
+    const queryParamIndex = location.hash.indexOf(this.defaultQueryParamSeparator);
+    return queryParamIndex !== -1 ? RoutingHelpers.parseParams(location.hash.slice(queryParamIndex + 1)) : {};
   }
   getLocationSearchQueryParams() {
-    return location.search
-      ? RoutingHelpers.parseParams(location.search.slice(1))
-      : {};
+    return location.search ? RoutingHelpers.parseParams(location.search.slice(1)) : {};
   }
 
   getModalPathFromPath() {
@@ -180,22 +148,16 @@ class RoutingHelpersClass {
   }
 
   getModalParamsFromPath() {
-    const modalParamsStr = this.getQueryParam(
-      `${this.getModalViewParamName()}Params`
-    );
+    const modalParamsStr = this.getQueryParam(`${this.getModalViewParamName()}Params`);
     return modalParamsStr && JSON.parse(decodeURIComponent(modalParamsStr));
   }
 
   addRouteChangeListener(callback) {
-    const hashRoutingActive = LuigiConfig.getConfigValue(
-      'routing.useHashRouting'
-    );
+    const hashRoutingActive = LuigiConfig.getConfigValue('routing.useHashRouting');
 
     EventListenerHelpers.addEventListener('message', e => {
       if ('refreshRoute' === e.data.msg && e.origin === window.origin) {
-        const path = hashRoutingActive
-          ? Routing.getHashPath()
-          : Routing.getModifiedPathname();
+        const path = hashRoutingActive ? Routing.getHashPath() : Routing.getModifiedPathname();
         callback(path);
       }
     });
@@ -216,11 +178,7 @@ class RoutingHelpersClass {
   buildRoute(node, path, params) {
     return !node.parent
       ? path + (params ? '?' + params : '')
-      : this.buildRoute(
-          node.parent,
-          `/${node.parent.pathSegment}${path}`,
-          params
-        );
+      : this.buildRoute(node.parent, `/${node.parent.pathSegment}${path}`, params);
   }
 
   getRouteLink(node, pathParams, relativePathPrefix) {
@@ -229,9 +187,7 @@ class RoutingHelpersClass {
       return node.externalLink;
       // externalLinkUrl property is provided so there's no need to trigger routing mechanizm
     } else if (node.link) {
-      const link = node.link.startsWith('/')
-        ? node.link
-        : Routing.buildFromRelativePath(node);
+      const link = node.link.startsWith('/') ? node.link : Routing.buildFromRelativePath(node);
       return pp + link;
     }
 
@@ -254,9 +210,7 @@ class RoutingHelpersClass {
   substituteDynamicParamsInObject(object, paramMap, paramPrefix = ':') {
     return Object.entries(object)
       .map(([key, value]) => {
-        let foundKey = Object.keys(paramMap).find(
-          key2 => value === paramPrefix + key2
-        );
+        let foundKey = Object.keys(paramMap).find(key2 => value === paramPrefix + key2);
         return [key, foundKey ? paramMap[foundKey] : value];
       })
       .reduce((acc, [key, value]) => {
@@ -269,11 +223,7 @@ class RoutingHelpersClass {
    * @param {*} node
    */
   isDynamicNode(node) {
-    return (
-      node.pathSegment &&
-      node.pathSegment.length > 0 &&
-      node.pathSegment[0] === ':'
-    );
+    return node.pathSegment && node.pathSegment.length > 0 && node.pathSegment[0] === ':';
   }
 
   /**
@@ -282,48 +232,29 @@ class RoutingHelpersClass {
    * @param {*} pathParams
    */
   getDynamicNodeValue(node, pathParams) {
-    return this.isDynamicNode(node)
-      ? pathParams[node.pathSegment.substring(1)]
-      : undefined;
+    return this.isDynamicNode(node) ? pathParams[node.pathSegment.substring(1)] : undefined;
   }
 
   substituteViewUrl(viewUrl, componentData) {
     const contextVarPrefix = 'context.';
     const nodeParamsVarPrefix = 'nodeParams.';
 
-    viewUrl = GenericHelpers.replaceVars(
-      viewUrl,
-      componentData.pathParams,
-      ':',
-      false
-    );
-    viewUrl = GenericHelpers.replaceVars(
-      viewUrl,
-      componentData.context,
-      contextVarPrefix
-    );
-    viewUrl = GenericHelpers.replaceVars(
-      viewUrl,
-      componentData.nodeParams,
-      nodeParamsVarPrefix
-    );
+    viewUrl = GenericHelpers.replaceVars(viewUrl, componentData.pathParams, ':', false);
+    viewUrl = GenericHelpers.replaceVars(viewUrl, componentData.context, contextVarPrefix);
+    viewUrl = GenericHelpers.replaceVars(viewUrl, componentData.nodeParams, nodeParamsVarPrefix);
     return viewUrl;
   }
 
   sanitizeParamsMap(paramsMap) {
     return Object.entries(paramsMap).reduce((sanitizedMap, paramPair) => {
-      sanitizedMap[
-        EscapingHelpers.sanitizeParam(paramPair[0])
-      ] = EscapingHelpers.sanitizeParam(paramPair[1]);
+      sanitizedMap[EscapingHelpers.sanitizeParam(paramPair[0])] = EscapingHelpers.sanitizeParam(paramPair[1]);
       return sanitizedMap;
     }, {});
   }
 
   setFeatureToggles(featureToggleProperty, path) {
     let featureTogglesFromUrl;
-    let paramsMap = this.sanitizeParamsMap(
-      this.parseParams(path.split('?')[1])
-    );
+    let paramsMap = this.sanitizeParamsMap(this.parseParams(path.split('?')[1]));
 
     if (paramsMap[featureToggleProperty]) {
       featureTogglesFromUrl = paramsMap[featureToggleProperty];
@@ -379,10 +310,7 @@ class RoutingHelpersClass {
           const alphanumeric = /^[0-9a-zA-Z]+$/;
           const alphanumericOrUnderscores = /^[0-9a-zA-Z_]+$/;
           // TODO: check for character size limit
-          if (
-            semanticObject.match(alphanumeric) &&
-            action.match(alphanumericOrUnderscores)
-          ) {
+          if (semanticObject.match(alphanumeric) && action.match(alphanumericOrUnderscores)) {
             return {
               semanticObject,
               action,
@@ -427,9 +355,7 @@ class RoutingHelpersClass {
       const intentObject = this.getIntentObject(caseInsensitiveLink);
       if (intentObject) {
         let realPath = mappings.find(
-          item =>
-            item.semanticObject === intentObject.semanticObject &&
-            item.action === intentObject.action
+          item => item.semanticObject === intentObject.semanticObject && item.action === intentObject.action
         );
         if (!realPath) {
           return false;
@@ -437,18 +363,14 @@ class RoutingHelpersClass {
         realPath = realPath.pathSegment;
         if (intentObject.params) {
           // get custom node param prefixes if any or default to ~
-          let nodeParamPrefix = LuigiConfig.getConfigValue(
-            'routing.nodeParamPrefix'
-          );
+          let nodeParamPrefix = LuigiConfig.getConfigValue('routing.nodeParamPrefix');
           nodeParamPrefix = nodeParamPrefix ? nodeParamPrefix : '~';
           realPath = realPath.concat(`?${nodeParamPrefix}`);
           intentObject.params.forEach(param => {
             realPath = realPath.concat(Object.keys(param)[0]); // append param name
             realPath = realPath.concat('=');
             // append param value and prefix in case of multiple params
-            realPath = realPath
-              .concat(param[Object.keys(param)[0]])
-              .concat(`&${nodeParamPrefix}`);
+            realPath = realPath.concat(param[Object.keys(param)[0]]).concat(`&${nodeParamPrefix}`);
           });
           realPath = realPath.slice(0, -(nodeParamPrefix.length + 1)); // slice extra prefix
         }
diff --git a/core/src/utilities/helpers/storage-helper.js b/core/src/utilities/helpers/storage-helper.js
index 7e4d0f2e28..a096c8cf3b 100644
--- a/core/src/utilities/helpers/storage-helper.js
+++ b/core/src/utilities/helpers/storage-helper.js
@@ -38,11 +38,7 @@ class StorageHelperClass {
       if (typeof operationFunction !== 'function') {
         throw operation + ' is not a supported operation for the storage';
       }
-      const result = operationFunction.bind(
-        this,
-        this.cleanHostname(hostname),
-        params
-      )();
+      const result = operationFunction.bind(this, this.cleanHostname(hostname), params)();
       this.sendBackOperation(microfrontendId, id, 'OK', result);
     } catch (error) {
       console.log(error);
@@ -157,9 +153,7 @@ class StorageHelperClass {
     IframeHelpers.getMicrofrontendsInDom()
       .filter(microfrontendObj => microfrontendObj.id === microfrontendId)
       .map(microfrontendObj => microfrontendObj.container)
-      .map(mfContainer =>
-        IframeHelpers.sendMessageToIframe(mfContainer, message)
-      );
+      .map(mfContainer => IframeHelpers.sendMessageToIframe(mfContainer, message));
   }
 }
 
diff --git a/core/src/utilities/helpers/usersetting-dialog-helpers.js b/core/src/utilities/helpers/usersetting-dialog-helpers.js
index dd6490ebb7..bc67ab67a6 100644
--- a/core/src/utilities/helpers/usersetting-dialog-helpers.js
+++ b/core/src/utilities/helpers/usersetting-dialog-helpers.js
@@ -5,12 +5,8 @@ class UserSettingsHelperClass {
 
   processUserSettingGroups() {
     const userSettingGroups = [];
-    const userSettingGroupsFromConfig = LuigiConfig.getConfigValue(
-      'userSettings.userSettingGroups'
-    );
-    const userSettingGroupsFromOldConfig = LuigiConfig.getConfigValue(
-      'settings.userSettings.userSettingGroups'
-    );
+    const userSettingGroupsFromConfig = LuigiConfig.getConfigValue('userSettings.userSettingGroups');
+    const userSettingGroupsFromOldConfig = LuigiConfig.getConfigValue('settings.userSettings.userSettingGroups');
     //regarding backwards compatibility
     const userSettingsSchema = userSettingGroupsFromConfig
       ? userSettingGroupsFromConfig
@@ -27,12 +23,7 @@ class UserSettingsHelperClass {
   }
 
   createIframe(viewUrl, userSettingsGroup) {
-    const iframe = IframeHelpers.createIframe(
-      viewUrl,
-      undefined,
-      undefined,
-      'usersettings'
-    );
+    const iframe = IframeHelpers.createIframe(viewUrl, undefined, undefined, 'usersettings');
     const iframeCtn = document.querySelector('.iframeUserSettingsCtn');
     iframe.setAttribute('userSettingsGroup', userSettingsGroup);
     iframe.userSettingsGroup = userSettingsGroup; //important for caching
@@ -52,9 +43,7 @@ class UserSettingsHelperClass {
   }
 
   findActiveCustomUserSettingsIframe(eventSource) {
-    let customUserSettingsIframes = document.querySelectorAll(
-      '[userSettingsGroup]'
-    );
+    let customUserSettingsIframes = document.querySelectorAll('[userSettingsGroup]');
     for (let i = 0; i < customUserSettingsIframes.length; i++) {
       if (customUserSettingsIframes[i].contentWindow === eventSource) {
         return customUserSettingsIframes[i];
diff --git a/core/src/utilities/helpers/web-component-helpers.js b/core/src/utilities/helpers/web-component-helpers.js
index 863cde176e..d0c1129599 100644
--- a/core/src/utilities/helpers/web-component-helpers.js
+++ b/core/src/utilities/helpers/web-component-helpers.js
@@ -3,7 +3,7 @@
  */
 export class DefaultCompoundRenderer {
   constructor(rendererObj) {
-    if(rendererObj) {
+    if (rendererObj) {
       this.rendererObject = rendererObj;
       this.config = rendererObj.config || {};
     } else {
@@ -30,7 +30,7 @@ export class DefaultCompoundRenderer {
 export class CustomCompoundRenderer extends DefaultCompoundRenderer {
   constructor(rendererObj) {
     super(rendererObj || { use: {} });
-    if(rendererObj && rendererObj.use && rendererObj.use.extends) {
+    if (rendererObj && rendererObj.use && rendererObj.use.extends) {
       this.superRenderer = resolveRenderer({
         use: rendererObj.use.extends,
         config: rendererObj.config
@@ -39,7 +39,7 @@ export class CustomCompoundRenderer extends DefaultCompoundRenderer {
   }
 
   createCompoundContainer() {
-    if(this.rendererObject.use.createCompoundContainer) {
+    if (this.rendererObject.use.createCompoundContainer) {
       return this.rendererObject.use.createCompoundContainer(this.config, this.superRenderer);
     } else if (this.superRenderer) {
       return this.superRenderer.createCompoundContainer();
@@ -48,7 +48,7 @@ export class CustomCompoundRenderer extends DefaultCompoundRenderer {
   }
 
   createCompoundItemContainer(layoutConfig) {
-    if(this.rendererObject.use.createCompoundItemContainer) {
+    if (this.rendererObject.use.createCompoundItemContainer) {
       return this.rendererObject.use.createCompoundItemContainer(layoutConfig, this.config, this.superRenderer);
     } else if (this.superRenderer) {
       return this.superRenderer.createCompoundItemContainer(layoutConfig);
@@ -57,7 +57,7 @@ export class CustomCompoundRenderer extends DefaultCompoundRenderer {
   }
 
   attachCompoundItem(compoundCnt, compoundItemCnt) {
-    if(this.rendererObject.use.attachCompoundItem) {
+    if (this.rendererObject.use.attachCompoundItem) {
       this.rendererObject.use.attachCompoundItem(compoundCnt, compoundItemCnt, this.superRenderer);
     } else if (this.superRenderer) {
       this.superRenderer.attachCompoundItem(compoundCnt, compoundItemCnt);
@@ -77,15 +77,15 @@ export class GridCompoundRenderer extends DefaultCompoundRenderer {
     compoundCnt.classList.add(containerClass);
     let mediaQueries = '';
 
-    if(this.config.layouts) {
+    if (this.config.layouts) {
       this.config.layouts.forEach(el => {
-        if(el.minWidth || el.maxWidth) {
+        if (el.minWidth || el.maxWidth) {
           let mq = '@media only screen ';
-          if(el.minWidth != null) {
-            mq += `and (min-width: ${el.minWidth}px) `
+          if (el.minWidth != null) {
+            mq += `and (min-width: ${el.minWidth}px) `;
           }
-          if(el.maxWidth != null) {
-            mq += `and (max-width: ${el.maxWidth}px) `
+          if (el.maxWidth != null) {
+            mq += `and (max-width: ${el.maxWidth}px) `;
           }
 
           mq += `{
@@ -101,7 +101,7 @@ export class GridCompoundRenderer extends DefaultCompoundRenderer {
       });
     }
 
-    compoundCnt.innerHTML = /*html*/`
+    compoundCnt.innerHTML = /*html*/ `
         <style scoped>
           .${containerClass} {
             display: grid;
@@ -130,22 +130,22 @@ export class GridCompoundRenderer extends DefaultCompoundRenderer {
  *
  * @param {*} rendererConfig the renderer config object defined in luigi config
  */
-export const resolveRenderer = (rendererConfig) => {
+export const resolveRenderer = rendererConfig => {
   const rendererDef = rendererConfig.use;
-  if(!rendererDef) {
+  if (!rendererDef) {
     return new DefaultCompoundRenderer(rendererConfig);
-  }
-  else if(rendererDef === 'grid') {
+  } else if (rendererDef === 'grid') {
     return new GridCompoundRenderer(rendererConfig);
-  } else if(rendererDef.createCompoundContainer
-    || rendererDef.createCompoundItemContainer
-    || rendererDef.attachCompoundItem) {
+  } else if (
+    rendererDef.createCompoundContainer ||
+    rendererDef.createCompoundItemContainer ||
+    rendererDef.attachCompoundItem
+  ) {
     return new CustomCompoundRenderer(rendererConfig);
   }
   return new DefaultCompoundRenderer(rendererConfig);
 };
 
-
 /**
  * Registers event listeners defined at the navNode.
  *
@@ -155,7 +155,7 @@ export const resolveRenderer = (rendererConfig) => {
  * @param {*} wcElement the web component element - optional
  */
 export const registerEventListeners = (eventbusListeners, navNode, nodeId, wcElement) => {
-  if(navNode.eventListeners) {
+  if (navNode.eventListeners) {
     navNode.eventListeners.forEach(el => {
       const evID = el.source + '.' + el.name;
       const listenerList = eventbusListeners[evID];
@@ -166,11 +166,11 @@ export const registerEventListeners = (eventbusListeners, navNode, nodeId, wcEle
         converter: el.dataConverter
       };
 
-      if(listenerList) {
+      if (listenerList) {
         listenerList.push(listenerInfo);
       } else {
         eventbusListeners[evID] = [listenerInfo];
       }
     });
   }
-}
+};
diff --git a/core/src/utilities/third-party-cookies-check.js b/core/src/utilities/third-party-cookies-check.js
index 3d1a67d0e4..a6d571eda7 100644
--- a/core/src/utilities/third-party-cookies-check.js
+++ b/core/src/utilities/third-party-cookies-check.js
@@ -6,9 +6,7 @@ EventListenerHelpers.addEventListener(
   'message',
   function(e) {
     if (e.data === 'luigi.tpcDisabled') {
-      console.warn(
-        'Third party cookies are not supported! Silent token renewal might not work!'
-      );
+      console.warn('Third party cookies are not supported! Silent token renewal might not work!');
       status = 'disabled';
     } else if (e.data === 'luigi.tpcEnabled') {
       status = 'enabled';
diff --git a/docs/luigi-client-api.md b/docs/luigi-client-api.md
index 4a060feea0..005056f8da 100644
--- a/docs/luigi-client-api.md
+++ b/docs/luigi-client-api.md
@@ -32,6 +32,36 @@ This document outlines the features provided by the Luigi Client API. It covers
 
 Use the functions and parameters to define the Lifecycle of listeners, navigation nodes, and Event data.
 
+#### isLuigiClientInitialized
+
+Check if LuigiClient is initialized
+
+##### Examples
+
+```javascript
+const init = LuigiClient.isLuigiClientInitialized()
+```
+
+Returns **[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** client initialized state
+
+**Meta**
+
+-   **since**: 1.12.0
+
+#### luigiClientInit
+
+Starts the handshake with Luigi Core and thereafter resulting in initialization of Luigi Client. It is always ran by default when importing luigi-client package in your micro frontend. Note that when using 'defer-luigi-init' to defer default initialization you will need to initialize the handshake using this function manually wherever needed.
+
+##### Examples
+
+```javascript
+LuigiClient.luigiClientInit()
+```
+
+**Meta**
+
+-   **since**: 1.12.0
+
 #### addInitListener
 
 Registers a listener called with the context object and the Luigi Core domain as soon as Luigi is instantiated. Defer your application bootstrap if you depend on authentication data coming from Luigi.
diff --git a/docs/luigi-core-api.md b/docs/luigi-core-api.md
index 1cff730cf8..2915fc0d5f 100644
--- a/docs/luigi-core-api.md
+++ b/docs/luigi-core-api.md
@@ -894,11 +894,11 @@ Luigi
  .ux()
  .showConfirmationModal(settings)
  .then(() => {
-    // Logic to execute when the confirmation modal is confirmed
+    // Logic to execute when the confirmation modal is dismissed
  });
 ```
 
-Returns **[promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** which is resolved when confirming the confirmation modal and rejected when dismissing it
+Returns **[promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** which is resolved when accepting the confirmation modal and rejected when dismissing it
 
 **Meta**
 
diff --git a/package.json b/package.json
index 1a71a585e2..25c8d47c84 100644
--- a/package.json
+++ b/package.json
@@ -1,66 +1,66 @@
 {
-  "private": true,
-  "scripts": {
-     "test:compatibility": "./scripts/testCompatibility.sh",
-     "code-quality": "node code_quality.js -- mode=pre_commit",
-     "code-quality-prettier": "node code_quality.js -- mode=pre_commit_prettier",
-     "code-quality-eslint": "node code_quality.js -- mode=pre_commit__eslint",
-     "full-code-quality": "node code_quality.js -- mode=full",
-     "full-code-quality-prettier": "node code_quality.js -- mode=full_prettier sourcePaths=core/src,client/src",
-     "full-code-quality-eslint": "node code_quality.js -- mode=full_eslint",
-     "full-code-quality-eslint-core": "node code_quality.js -- mode=full_eslint sourcePaths=core/src,core/test report=core_full_eslint_report.html",
-     "full-code-quality-eslint-client": "node code_quality.js -- mode=full_eslint sourcePaths=client/src report=client_full_eslint_report.html",
-     "full-code-quality-eslint-e2e-tests": "node code_quality.js -- mode=full_eslint sourcePaths=test/e2e-test-application/e2e/tests report=e2e-test_full_eslint_report.html",
-     "change-node-version": "node ./scripts/change.node.version.js"
-  },
-  "devDependencies": {
-     "@starptech/prettyhtml": "^0.10.0",
-     "@typescript-eslint/eslint-plugin": "^4.9.0",
-     "@typescript-eslint/parser": "^4.9.0",
-     "ansi_up": "^4.0.4",
-     "cypress": "^5.3.0",
-     "diff": ">=3.5.0",
-     "eslint": "^7.14.0",
-     "eslint-config-standard": "^16.0.2",
-     "eslint-plugin-cypress": "^2.11.2",
-     "eslint-plugin-import": "^2.22.1",
-     "eslint-plugin-node": "^11.1.0",
-     "eslint-plugin-promise": "^4.2.1",
-     "git-changed-files": "^1.0.0",
-     "husky": "^4.3.5",
-     "lerna": "^3.22.1",
-     "lerna-changelog": "^1.0.1",
-     "lodash": ">=4.17.13",
-     "lodash.template": ">=4.5.0",
-     "meow": "8.0.0",
-     "mixin-deep": ">=1.3.2",
-     "prettier": "^1.15.3",
-     "set-value": ">=2.0.1",
-     "simple-git": "^2.24.0",
-     "sirv-cli": "^0.4.4"
-  },
-  "prettier": {
-    "singleQuote": true,
-    "semi": true
-  },
-  "changelog": {
-    "repo": "SAP/luigi",
-    "labels": {
-      "breaking": ":boom: Breaking Change",
-      "enhancement": ":rocket: Added",
-      "bug": ":bug: Fixed",
-      "internal": ":house: Internal"
-    },
-    "cacheDir": ".changelog"
-  },
-  "husky": {
-     "hooks": {
-        "pre-commit": "npm run code-quality && ./scripts/hooks/remove-test-prefixes.sh && ./scripts/hooks/generate-docu.sh && ./scripts/hooks/prevent-illegal-characters.sh"
-     }
-  },
-  "codeQuality": {
-     "usePrettier": false,
-     "useEslint": false,
-     "eslintStopCommit": true
-  }
+   "private": true,
+   "scripts": {
+      "test:compatibility": "./scripts/testCompatibility.sh",
+      "code-quality": "node code_quality.js -- mode=pre_commit",
+      "code-quality-prettier": "node code_quality.js -- mode=pre_commit_prettier",
+      "code-quality-eslint": "node code_quality.js -- mode=pre_commit__eslint",
+      "full-code-quality": "node code_quality.js -- mode=full",
+      "full-code-quality-prettier": "node code_quality.js -- mode=full_prettier sourcePaths=core/src,client/src",
+      "full-code-quality-eslint": "node code_quality.js -- mode=full_eslint",
+      "full-code-quality-eslint-core": "node code_quality.js -- mode=full_eslint sourcePaths=core/src,core/test report=core_full_eslint_report.html",
+      "full-code-quality-eslint-client": "node code_quality.js -- mode=full_eslint sourcePaths=client/src report=client_full_eslint_report.html",
+      "full-code-quality-eslint-e2e-tests": "node code_quality.js -- mode=full_eslint sourcePaths=test/e2e-test-application/e2e/tests report=e2e-test_full_eslint_report.html",
+      "change-node-version": "node ./scripts/change.node.version.js"
+   },
+   "devDependencies": {
+      "@starptech/prettyhtml": "^0.10.0",
+      "@typescript-eslint/eslint-plugin": "^4.9.0",
+      "@typescript-eslint/parser": "^4.9.0",
+      "ansi_up": "^4.0.4",
+      "cypress": "^5.3.0",
+      "diff": ">=3.5.0",
+      "eslint": "^7.14.0",
+      "eslint-config-standard": "^16.0.2",
+      "eslint-plugin-cypress": "^2.11.2",
+      "eslint-plugin-import": "^2.22.1",
+      "eslint-plugin-node": "^11.1.0",
+      "eslint-plugin-promise": "^4.2.1",
+      "git-changed-files": "^1.0.0",
+      "husky": "^4.3.5",
+      "lerna": "^3.22.1",
+      "lerna-changelog": "^1.0.1",
+      "lodash": ">=4.17.13",
+      "lodash.template": ">=4.5.0",
+      "meow": "8.0.0",
+      "mixin-deep": ">=1.3.2",
+      "prettier": "^1.15.3",
+      "set-value": ">=2.0.1",
+      "simple-git": "^2.24.0",
+      "sirv-cli": "^0.4.4"
+   },
+   "prettier": {
+      "singleQuote": true,
+      "semi": true
+   },
+   "changelog": {
+      "repo": "SAP/luigi",
+      "labels": {
+         "breaking": ":boom: Breaking Change",
+         "enhancement": ":rocket: Added",
+         "bug": ":bug: Fixed",
+         "internal": ":house: Internal"
+      },
+      "cacheDir": ".changelog"
+   },
+   "husky": {
+      "hooks": {
+         "pre-commit": "npm run code-quality && ./scripts/hooks/remove-test-prefixes.sh && ./scripts/hooks/generate-docu.sh && ./scripts/hooks/prevent-illegal-characters.sh"
+      }
+   },
+   "codeQuality": {
+      "usePrettier": true,
+      "useEslint": false,
+      "eslintStopCommit": true
+   }
 }
diff --git a/prettier_config.json b/prettier_config.json
index 8653bbaef2..6e18d53095 100644
--- a/prettier_config.json
+++ b/prettier_config.json
@@ -1,14 +1,14 @@
 {
    "js": {
       "parser": "babel-flow",
-      "trailingComma": "es5",
+      "trailingComma": "none",
       "tabWidth": 2,
       "singleQuote": true,
       "printWidth": 120
    },
    "ts": {
       "parser": "typescript",
-      "trailingComma": "es5",
+      "trailingComma": "none",
       "tabWidth": 2,
       "singleQuote": true,
       "printWidth": 120