@sapui5/sap.ushell 1.136.3 → 1.138.1

package/src/main/js/sap/ushell/ui/launchpad/AnchorNavigationBar.js

@@ -16,7 +16,7 @@ sap.ui.define([
     "sap/ui/thirdparty/jquery",
     "sap/ushell/library", // css style dependency
     "sap/ushell/resources"
-], function (
+], (
     AnchorNavigationBarRenderer,
     Localization,
     isEmptyObject,
@@ -28,7 +28,7 @@ sap.ui.define([
     jQuery,
     ushellLibrary,
     resources
-) {
+) => {
     "use strict";
 
     /**
@@ -44,7 +44,7 @@ sap.ui.define([
      *
      * @private
      */
-    var AnchorNavigationBar = Bar.extend("sap.ushell.ui.launchpad.AnchorNavigationBar", /** @lends sap.ushell.ui.launchpad.AnchorNavigationBar.prototype */{
+    const AnchorNavigationBar = Bar.extend("sap.ushell.ui.launchpad.AnchorNavigationBar", /** @lends sap.ushell.ui.launchpad.AnchorNavigationBar.prototype */{
         metadata: {
             library: "sap.ushell",
             properties: {
@@ -78,25 +78,25 @@ sap.ui.define([
             ResizeHandler.deregister(this._sResizeListenerId);
             this._sResizeListenerId = null;
         }
-        var oScrollItem = window.document.getElementsByClassName("sapUshellAnchorNavigationBarItemsScroll")[0];
+        const oScrollItem = window.document.getElementsByClassName("sapUshellAnchorNavigationBarItemsScroll")[0];
         if (oScrollItem) {
             oScrollItem.removeEventListener("scroll", this.fnNavigationBarItemsVisibility);
         }
     };
 
     AnchorNavigationBar.prototype.onAfterRendering = function () {
-        var oDomRef = this.getDomRef();
+        const oDomRef = this.getDomRef();
 
         if (this._bIsRenderedCompletely) {
             this.reArrangeNavigationBarElements();
             this.adjustVisibleAnchorItemsAccessibility();
 
-            var oScrollItem = window.document.getElementsByClassName("sapUshellAnchorNavigationBarItemsScroll")[0];
+            const oScrollItem = window.document.getElementsByClassName("sapUshellAnchorNavigationBarItemsScroll")[0];
             if (oScrollItem) {
                 oScrollItem.addEventListener("scroll", this.fnNavigationBarItemsVisibility);
             }
 
-            //listen to resize
+            // listen to resize
             if (oDomRef) { // onAfterRendering test does not actually render the AnchorNavigationBar
                 this._sResizeListenerId = ResizeHandler.register(oDomRef, this.reArrangeNavigationBarElements.bind(this));
             }
@@ -104,7 +104,7 @@ sap.ui.define([
     };
 
     AnchorNavigationBar.prototype.openOverflowPopup = function () {
-        var overflowOpened = jQuery(".sapUshellAnchorItemOverFlow").hasClass("sapUshellAnchorItemOverFlowOpen");
+        const overflowOpened = jQuery(".sapUshellAnchorItemOverFlow").hasClass("sapUshellAnchorItemOverFlowOpen");
         if (this.oOverflowButton && !overflowOpened) {
             this.oOverflowButton.firePress();
         }
@@ -118,7 +118,7 @@ sap.ui.define([
 
     AnchorNavigationBar.prototype.reArrangeNavigationBarElements = function () {
         this.anchorItems = this.getVisibleGroups();
-        var selectedItemIndex = this.getSelectedItemIndex() || 0;
+        const selectedItemIndex = this.getSelectedItemIndex() || 0;
 
         if (this.anchorItems.length) {
             // Make sure only one item is selected at a time
@@ -126,32 +126,32 @@ sap.ui.define([
         }
 
         if (Device.system.phone && this.anchorItems.length) {
-            this.anchorItems.forEach(function (oItem) {
+            this.anchorItems.forEach((oItem) => {
                 oItem.setIsGroupVisible(false);
             });
             this.anchorItems[this.getSelectedItemIndex()].setIsGroupVisible(true);
         } else {
-            setTimeout(function () {
+            setTimeout(() => {
                 if (this.isDestroyed()) {
                     return;
                 }
                 this.setNavigationBarItemsVisibility();
-            }.bind(this), 200);
+            }, 200);
         }
     };
 
     AnchorNavigationBar.prototype._scrollToGroupByGroupIndex = function (groupIndex, speed) {
         // The layout is different between touch and non-touch screens
         // See the CSS rule for .sap-tablet .sapUshellAnchorNavigationBarItemsScroll
-        var sScrollArea = Device.system.tablet ? ".sapUshellAnchorNavigationBarItemsScroll" : ".sapUshellAnchorNavigationBarItems";
-        var oContainer = document.documentElement.querySelector(sScrollArea);
-        var oSelectedElement = this.anchorItems[groupIndex].getDomRef();
+        const sScrollArea = Device.system.tablet ? ".sapUshellAnchorNavigationBarItemsScroll" : ".sapUshellAnchorNavigationBarItems";
+        const oContainer = document.documentElement.querySelector(sScrollArea);
+        const oSelectedElement = this.anchorItems[groupIndex].getDomRef();
         if (oContainer && oSelectedElement) {
-            var oContainerRect = oContainer.getBoundingClientRect();
-            var oItemRect = oSelectedElement.getBoundingClientRect();
-            var $Container = jQuery(oContainer);
-            var iScrollLeft = this.bIsRtl ? $Container.scrollLeftRTL() : oContainer.scrollLeft;
-            var iX; // scroll increment
+            const oContainerRect = oContainer.getBoundingClientRect();
+            const oItemRect = oSelectedElement.getBoundingClientRect();
+            const $Container = jQuery(oContainer);
+            const iScrollLeft = this.bIsRtl ? $Container.scrollLeftRTL() : oContainer.scrollLeft;
+            let iX; // scroll increment
             // adjust the horizontal scroll position of the container, if needed
             if (oItemRect.left < oContainerRect.left) {
                 iX = oItemRect.left - oContainerRect.left - 16; // add 1 rem padding
@@ -174,7 +174,7 @@ sap.ui.define([
             this.setNavigationBarItemsVisibilityOnDesktop();
         } else if (this.anchorItems && this.anchorItems.length > 0) {
             this.oOverflowButton.removeStyleClass("sapUshellShellHidden");
-            var selectedItemIndex = this.getSelectedItemIndex() || 0;
+            const selectedItemIndex = this.getSelectedItemIndex() || 0;
             if (this.oPopover) {
                 this.oPopover.setTitle(this.anchorItems[selectedItemIndex].getTitle());
             }
@@ -182,13 +182,13 @@ sap.ui.define([
     };
 
     AnchorNavigationBar.prototype.setNavigationBarItemsVisibilityOnDesktop = function () {
-        //check if to show or hide the popover overflow button
+        // check if to show or hide the popover overflow button
         if (this.anchorItems.length && (!this.isMostRightAnchorItemVisible() || !this.isMostLeftAnchorItemVisible())) {
             this.oOverflowButton.removeStyleClass("sapUshellShellHidden");
         } else if (this.oOverflowButton) {
             this.oOverflowButton.addStyleClass("sapUshellShellHidden");
         }
-        //add left / right overflow indication on anchor items with respect to locale direction
+        // add left / right overflow indication on anchor items with respect to locale direction
         if (this.bIsRtl) {
             if (this.anchorItems.length && !this.isMostLeftAnchorItemVisible()) {
                 this.oOverflowRightButton.removeStyleClass("sapUshellShellHidden");
@@ -217,46 +217,45 @@ sap.ui.define([
     AnchorNavigationBar.prototype.adjustItemSelection = function (iSelectedIndex) {
         // call adjustItemSelection with timeout since after deletion of group the dashboard scrolls and changes the selection wrongly
         // so wait a bit for the scroll and then adjust the selection
-        setTimeout(function () {
+        setTimeout(() => {
             if (this.anchorItems && this.anchorItems.length) {
-                this.anchorItems.forEach(function (oItem) {
+                this.anchorItems.forEach((oItem) => {
                     oItem.setSelected(false);
                 });
                 if (iSelectedIndex >= 0 && iSelectedIndex < this.anchorItems.length) {
                     this.anchorItems[iSelectedIndex].setSelected(true);
 
-                    //scroll to group
+                    // scroll to group
                     this._scrollToGroupByGroupIndex(iSelectedIndex);
                 }
             }
-        }.bind(this), 50);
+        }, 50);
     };
 
     AnchorNavigationBar.prototype.isMostRightAnchorItemVisible = function () {
-        var jqNavigationBar = jQuery(".sapUshellAnchorNavigationBarInner"),
-            navigationBarWidth = !isEmptyObject(jqNavigationBar) ? jqNavigationBar.width() : 0,
-            navigationBarOffset = !isEmptyObject(jqNavigationBar) && jqNavigationBar.offset() ?
-                jqNavigationBar.offset().left : 0,
-            lastItem = this.bIsRtl ? this.anchorItems[0].getDomRef() : this.anchorItems[this.anchorItems.length - 1].getDomRef(),
-            lastItemWidth = !isEmptyObject(lastItem) ? jQuery(lastItem).width() : 0,
-            lastItemOffset;
+        const jqNavigationBar = jQuery(".sapUshellAnchorNavigationBarInner");
+        const navigationBarWidth = !isEmptyObject(jqNavigationBar) ? jqNavigationBar.width() : 0;
+        const navigationBarOffset = !isEmptyObject(jqNavigationBar) && jqNavigationBar.offset() ?
+            jqNavigationBar.offset().left : 0;
+        const lastItem = this.bIsRtl ? this.anchorItems[0].getDomRef() : this.anchorItems[this.anchorItems.length - 1].getDomRef();
+        let lastItemWidth = !isEmptyObject(lastItem) ? jQuery(lastItem).width() : 0;
         // when the anchor bar isn't visible, the items gets negative width
         // use the minimal width for items instead
         if (lastItemWidth < 0) {
             lastItemWidth = 80;
         }
-        lastItemOffset = lastItem && jQuery(lastItem).offset() ? jQuery(lastItem).offset().left : 0;
+        const lastItemOffset = lastItem && jQuery(lastItem).offset() ? jQuery(lastItem).offset().left : 0;
 
         // last item is completely shown in the navigation bar
         return Math.ceil(lastItemOffset) + lastItemWidth <= navigationBarOffset + navigationBarWidth;
     };
 
     AnchorNavigationBar.prototype.isMostLeftAnchorItemVisible = function () {
-        var jqNavigationBar = jQuery(".sapUshellAnchorNavigationBarInner"),
-            navigationBarOffsetLeft = !isEmptyObject(jqNavigationBar)
-                && jqNavigationBar.offset() && jqNavigationBar.offset().left || 0,
-            firstItem = this.bIsRtl ? this.anchorItems[this.anchorItems.length - 1].getDomRef() : this.anchorItems[0].getDomRef(),
-            firstItemOffset = !isEmptyObject(firstItem) && jQuery(firstItem).offset() ? jQuery(firstItem).offset().left : 0;
+        const jqNavigationBar = jQuery(".sapUshellAnchorNavigationBarInner");
+        const navigationBarOffsetLeft = !isEmptyObject(jqNavigationBar)
+                && jqNavigationBar.offset() && jqNavigationBar.offset().left || 0;
+        const firstItem = this.bIsRtl ? this.anchorItems[this.anchorItems.length - 1].getDomRef() : this.anchorItems[0].getDomRef();
+        const firstItemOffset = !isEmptyObject(firstItem) && jQuery(firstItem).offset() ? jQuery(firstItem).offset().left : 0;
 
         // last item is not completely shown in the navigation bar
         return Math.ceil(firstItemOffset) >= navigationBarOffsetLeft;
@@ -327,15 +326,15 @@ sap.ui.define([
             "sap/ushell/ui/launchpad/GroupListItem",
             "sap/m/List",
             "sap/m/library"
-        ], function (
+        ], (
             Popover,
             Filter,
             GroupListItem,
             List,
             mobileLibrary
-        ) {
+        ) => {
             // shortcut for sap.m.ListMode
-            var ListMode = mobileLibrary.ListMode;
+            const ListMode = mobileLibrary.ListMode;
 
             if (!this.oPopover) {
                 this.oList = new List({
@@ -354,10 +353,10 @@ sap.ui.define([
                     content: [this.oList],
                     horizontalScrolling: false,
                     beforeOpen: function () {
-                        //place the popover under the overflow button
-                        var jqOverflowBtn = jQuery(".sapUshellAnchorItemOverFlow"),
-                            bIsRtl = Localization.getRTL(),
-                            offset = bIsRtl ? -1 * jqOverflowBtn.outerWidth() : jqOverflowBtn.outerWidth();
+                        // place the popover under the overflow button
+                        const jqOverflowBtn = jQuery(".sapUshellAnchorItemOverFlow");
+                        const bIsRtl = Localization.getRTL();
+                        const offset = bIsRtl ? -1 * jqOverflowBtn.outerWidth() : jqOverflowBtn.outerWidth();
                         this.setOffsetX(offset);
                     },
                     afterClose: function () {
@@ -374,8 +373,8 @@ sap.ui.define([
                 // if we need to open the popover
                 this.anchorItems = this.getVisibleGroups();
                 this.oList.setModel(this.getModel());
-                var bActionModeActive = this.getModel().getProperty("/tileActionModeActive");
-                var visibleGroupFilter = new Filter("", "EQ", "a");
+                const bActionModeActive = this.getModel().getProperty("/tileActionModeActive");
+                const visibleGroupFilter = new Filter("", "EQ", "a");
                 visibleGroupFilter.fnTest = function (itemModel) {
                     // Empty groups should not be displayed when personalization is off or
                     // if they are locked or default group not in action mode
@@ -393,9 +392,9 @@ sap.ui.define([
                     }),
                     filters: [visibleGroupFilter]
                 });
-                var sSelectedGroupId = jQuery(".sapUshellAnchorItemSelected").attr("id");
-                var oSelectedGroup = Element.getElementById(sSelectedGroupId);
-                this.oList.getItems().forEach(function (oItem) {
+                const sSelectedGroupId = jQuery(".sapUshellAnchorItemSelected").attr("id");
+                const oSelectedGroup = Element.getElementById(sSelectedGroupId);
+                this.oList.getItems().forEach((oItem) => {
                     if (oSelectedGroup.mProperties.groupId === oItem.mProperties.groupId) {
                         oItem.addStyleClass("sapUshellAnchorPopoverItemSelected");
                     } else {
@@ -405,11 +404,11 @@ sap.ui.define([
                 jQuery(".sapUshellAnchorItemOverFlow").toggleClass("sapUshellAnchorItemOverFlowPressed", true);
                 this.oPopover.openBy(this.oOverflowButton);
             }
-        }.bind(this));
+        });
     };
 
     AnchorNavigationBar.prototype.getVisibleGroups = function () {
-        return this.getGroups().filter(function (oGroup) {
+        return this.getGroups().filter((oGroup) => {
             return oGroup.getVisible();
         });
     };
@@ -433,10 +432,10 @@ sap.ui.define([
      * Sets the correct posinset and setsize properties for all visible anchorItems.
      */
     AnchorNavigationBar.prototype.adjustVisibleAnchorItemsAccessibility = function () {
-        var aVisibleGroups = this.getVisibleGroups(),
-            iSetSize = aVisibleGroups.length;
+        const aVisibleGroups = this.getVisibleGroups();
+        const iSetSize = aVisibleGroups.length;
 
-        aVisibleGroups.forEach(function (oAnchorItem, index) {
+        aVisibleGroups.forEach((oAnchorItem, index) => {
             oAnchorItem.setPosinset(index + 1);
             oAnchorItem.setSetsize(iSetSize);
         });

package/src/main/js/sap/ushell/ui/launchpad/AnchorNavigationBarRenderer.js

@@ -7,11 +7,11 @@
 sap.ui.define([
     "sap/ushell/resources",
     "sap/ui/core/library"
-], function (resources, coreLibrary) {
+], (resources, coreLibrary) => {
     "use strict";
 
     // shortcut for sap.ui.core.AccessibleLandmarkRole
-    var AccessibleLandmarkRole = coreLibrary.AccessibleLandmarkRole;
+    const AccessibleLandmarkRole = coreLibrary.AccessibleLandmarkRole;
 
     /**
      * AnchorNavigationBar renderer.
@@ -19,7 +19,7 @@ sap.ui.define([
      * @static
      * @private
      */
-    var AnchorNavigationBarRenderer = {
+    const AnchorNavigationBarRenderer = {
         apiVersion: 2
     };
 
@@ -46,7 +46,7 @@ sap.ui.define([
 
         if (oControl.getGroups().length > 0) {
             oControl._setRenderedCompletely(true);
-            //left overflow arrow
+            // left overflow arrow
             // overflow arrows are aria-hidden: the list items are available for the screen reader anyway
             oRm.openStart("div");
             oRm.class("sapUshellAnchorLeftOverFlowButton");
@@ -55,7 +55,7 @@ sap.ui.define([
             oRm.renderControl(oControl._getOverflowLeftArrowButton());
             oRm.close("div");
 
-            //anchor items
+            // anchor items
             oRm.openStart("div");
             oRm.class("sapUshellAnchorNavigationBarItems");
             oRm.openEnd();
@@ -72,7 +72,7 @@ sap.ui.define([
 
             oRm.close("div");
 
-            //right overflow arrow
+            // right overflow arrow
             oRm.openStart("div");
             oRm.class("sapUshellAnchorRightOverFlowButton");
             oRm.accessibilityState(oControl._getOverflowRightArrowButton(), { hidden: true });
@@ -80,7 +80,7 @@ sap.ui.define([
             oRm.renderControl(oControl._getOverflowRightArrowButton());
             oRm.close("div");
 
-            //overflow popover button
+            // overflow popover button
             oRm.openStart("div");
             oRm.class("sapUshellAnchorItemOverFlow");
             oRm.accessibilityState(oControl._getOverflowButton(), { hidden: true });
@@ -95,7 +95,7 @@ sap.ui.define([
     };
 
     AnchorNavigationBarRenderer.renderAnchorNavigationItems = function (oRm, oControl) {
-        oControl.getGroups().forEach(function (oAnchorItem) {
+        oControl.getGroups().forEach((oAnchorItem) => {
             oRm.renderControl(oAnchorItem);
         });
     };

package/src/main/js/sap/ushell/ui/launchpad/CatalogEntryContainer.js

@@ -8,14 +8,14 @@ sap.ui.define([
     "sap/ushell/resources",
     "sap/ushell/ui/launchpad/TileContainerUtils",
     "sap/ushell/Container"
-], function (
+], (
     Log,
     Control,
     ushellLibrary,
     resources,
     TileContainerUtils,
     Container
-) {
+) => {
     "use strict";
 
     /**
@@ -26,7 +26,7 @@ sap.ui.define([
      *
      * @private
      */
-    var CatalogEntryContainer = Control.extend("sap.ushell.ui.launchpad.CatalogEntryContainer", /** @lends sap.ushell.ui.launchpad.CatalogEntryContainer.prototype */{
+    const CatalogEntryContainer = Control.extend("sap.ushell.ui.launchpad.CatalogEntryContainer", /** @lends sap.ushell.ui.launchpad.CatalogEntryContainer.prototype */{
         metadata: {
             library: "sap.ushell",
             properties: {
@@ -44,7 +44,7 @@ sap.ui.define([
             render: function (rm, catalogEntryContainer) {
                 // WRAPPER start
                 rm.openStart("div", catalogEntryContainer);
-                rm.attr("aria-labeledby", catalogEntryContainer.getId() + "-title");
+                rm.attr("aria-labeledby", `${catalogEntryContainer.getId()}-title`);
                 rm.attr("role", "group");
                 rm.class("sapUshellTileContainer");
                 rm.class("sapUshellCatalogTileContainer");
@@ -56,7 +56,7 @@ sap.ui.define([
                 rm.attr("tabindex", "-1");
                 rm.openEnd(); // div - tag
 
-                var sHeaders = catalogEntryContainer.getHeader();
+                let sHeaders = catalogEntryContainer.getHeader();
                 if (sHeaders) {
                     if (resources.i18n.hasText(sHeaders)) {
                         sHeaders = resources.i18n.getText(sHeaders);
@@ -66,12 +66,12 @@ sap.ui.define([
                     rm.openStart("div");
                     rm.class("sapUshellTileContainerHeader");
                     rm.class("sapUshellCatalogTileContainerHeader");
-                    rm.attr("id", catalogEntryContainer.getId() + "-groupheader");
+                    rm.attr("id", `${catalogEntryContainer.getId()}-groupheader`);
                     rm.openEnd(); // div - tag
 
                     rm.openStart("div");
                     rm.class("sapUshellCatalogTileContainerHeaderInner");
-                    rm.attr("id", catalogEntryContainer.getId() + "-title");
+                    rm.attr("id", `${catalogEntryContainer.getId()}-title`);
                     rm.openEnd(); // div - tag
 
                     rm.openStart("h2");
@@ -89,10 +89,10 @@ sap.ui.define([
                     rm.close("div");
                 }
 
-                var aAppBoxesContainers = catalogEntryContainer.getAppBoxesContainer();
-                var iIndex;
+                const aAppBoxesContainers = catalogEntryContainer.getAppBoxesContainer();
+                let iIndex;
 
-                var aCustomTilesContainers = catalogEntryContainer.getCustomTilesContainer();
+                const aCustomTilesContainers = catalogEntryContainer.getCustomTilesContainer();
 
                 if (aAppBoxesContainers.length > 0 || aCustomTilesContainers.length > 0) {
                     // INNER CONTENT start
@@ -157,9 +157,9 @@ sap.ui.define([
         // This code should be in the controller of the view, TODO make a callback from the controller, very like the calculater
         // This code bind between the view and the tile, It is here to improve performance.
         if (sName === "customTilesContainer") {
-            var elementToDisplaySrc = elementToDisplay.getObject && elementToDisplay.getObject().src;
+            const elementToDisplaySrc = elementToDisplay.getObject && elementToDisplay.getObject().src;
             if (elementToDisplaySrc !== undefined) {
-                var oContract;
+                let oContract;
                 if (elementToDisplaySrc.Chip !== undefined && elementToDisplaySrc.Chip.getContract !== undefined) {
                     oContract = elementToDisplaySrc.Chip.getContract("preview");
                 } else if (elementToDisplaySrc.getContract !== undefined) {
@@ -170,39 +170,37 @@ sap.ui.define([
                 }
             }
 
-            Container.getServiceAsync("FlpLaunchPage").then(function (oLaunchpageService) {
+            Container.getServiceAsync("FlpLaunchPage").then((oLaunchpageService) => {
                 oLaunchpageService.getCatalogTileViewControl(elementToDisplay.getProperty("src")).done(
-                    function (catalogTileView) {
-                        elementToDisplay.getModel().setProperty(elementToDisplay.getPath() + "/content", [catalogTileView]);
+                    (catalogTileView) => {
+                        elementToDisplay.getModel().setProperty(`${elementToDisplay.getPath()}/content`, [catalogTileView]);
                     }
                 );
             });
         }
 
-        var oNewCatalog = TileContainerUtils.createNewItem.bind(this)(elementToDisplay, sName);
+        const oNewCatalog = TileContainerUtils.createNewItem.bind(this)(elementToDisplay, sName);
         TileContainerUtils.addNewItem.bind(this)(oNewCatalog, sName);
 
-        var aItems = (sName === "appBoxesContainer") ? this.getAppBoxesContainer() : this.getCustomTilesContainer(),
-            sPath = elementToDisplay.getPath();
+        const aItems = (sName === "appBoxesContainer") ? this.getAppBoxesContainer() : this.getCustomTilesContainer();
+        const sPath = elementToDisplay.getPath();
         this.indexingMaps[sName].onScreenPathIndexMap[sPath] = { aItemsRefrenceIndex: aItems.length - 1, isVisible: true };
 
         return true;
     };
 
-    CatalogEntryContainer.prototype.getNumberResults = function (/*sReason*/) {
+    CatalogEntryContainer.prototype.getNumberResults = function (/* sReason */) {
         return {
-            nAppboxes: this.nNumberOfVisibileElements.appBoxesContainer,
-            nCustom: this.nNumberOfVisibileElements.customTilesContainer
+            nAppboxes: this.nNumberOfVisibleElements.appBoxesContainer,
+            nCustom: this.nNumberOfVisibleElements.customTilesContainer
         };
     };
 
     CatalogEntryContainer.prototype.handleElements = function (sReason) {
-        var sName = sReason,
-            oBinding = this.mBindingInfos[sName].binding,
-            aBindingContexts = oBinding.getContexts(),
-            aItems,
-            oShowHideReturnObject,
-            indexSearchMissingFilteredElem;
+        const sName = sReason;
+        const oBinding = this.mBindingInfos[sName].binding;
+        const aBindingContexts = oBinding.getContexts();
+        let aItems;
 
         if (!this.catalogState) {
             this.catalogState = {};
@@ -216,15 +214,15 @@ sap.ui.define([
             this.indexingMaps = {};
         }
 
-        if (!this.nNumberOfVisibileElements) {
-            this.nNumberOfVisibileElements = [];
+        if (!this.nNumberOfVisibleElements) {
+            this.nNumberOfVisibleElements = [];
         }
-        if (!this.nNumberOfVisibileElements.customTilesContainer) {
-            this.nNumberOfVisibileElements.customTilesContainer = 0;
+        if (!this.nNumberOfVisibleElements.customTilesContainer) {
+            this.nNumberOfVisibleElements.customTilesContainer = 0;
         }
 
-        if (!this.nNumberOfVisibileElements.appBoxesContainer) {
-            this.nNumberOfVisibileElements.appBoxesContainer = 0;
+        if (!this.nNumberOfVisibleElements.appBoxesContainer) {
+            this.nNumberOfVisibleElements.appBoxesContainer = 0;
         }
 
         if (!this.filters) {
@@ -237,7 +235,7 @@ sap.ui.define([
         this.indexingMaps[sName] = TileContainerUtils.indexOnScreenElements(aItems, false);
 
         // search for the missing filtered elements
-        indexSearchMissingFilteredElem = TileContainerUtils.markVisibleOnScreenElementsSearchCatalog(
+        const indexSearchMissingFilteredElem = TileContainerUtils.markVisibleOnScreenElementsSearchCatalog(
             aBindingContexts, this.indexingMaps[sName], true);
 
         // add the missing elements and check if there is a need for header.
@@ -260,9 +258,9 @@ sap.ui.define([
         aItems = (sName === "appBoxesContainer") ? this.getAppBoxesContainer() : this.getCustomTilesContainer();
 
         // show/hide all the tiles
-        oShowHideReturnObject = TileContainerUtils.showHideTilesAndHeaders(this.indexingMaps[sName], aItems);
+        const oShowHideReturnObject = TileContainerUtils.showHideTilesAndHeaders(this.indexingMaps[sName], aItems);
 
-        this.nNumberOfVisibileElements[sName] = oShowHideReturnObject.nCountVisibElelemnts;
+        this.nNumberOfVisibleElements[sName] = oShowHideReturnObject.nCountVisibleElements;
 
         if (this.fnCallback) {
             this.fnCallback(this);
@@ -274,10 +272,10 @@ sap.ui.define([
     };
 
     CatalogEntryContainer.prototype.processFiltering = function (entry, sName) {
-        var sPath = entry.getPath();
+        const sPath = entry.getPath();
 
         if (sName) {
-            var indexEntry = this.indexingMaps[sName].onScreenPathIndexMap[sPath];
+            const indexEntry = this.indexingMaps[sName].onScreenPathIndexMap[sPath];
             if (indexEntry.isVisible && this.currElementVisible) {
                 this.currElementVisible();
             }