@sapui5/sap.ushell 1.138.1 → 1.139.0

package/src/main/js/sap/ushell/components/homepage/DashboardContent.view.js

@@ -5,7 +5,7 @@
  * with a header of type <code>sap.ushell.ui.launchpad.AnchorNavigationBar</code>
  * and content of type <code>sap.ushell.ui.launchpad.DashboardGroupsContainer</code>.
  *
- * @version 1.138.1
+ * @version 1.139.0
  *
  * @deprecated since 1.112
  * @private
@@ -31,7 +31,7 @@ sap.ui.define([
     "sap/ushell/utils",
     "sap/ushell/components/homepage/DashboardContent.controller", // controller must be preloaded
     "sap/ushell/components/homepage/ActionMode"
-], function (
+], (
     mobileLibrary,
     coreLibrary,
     Page,
@@ -52,11 +52,11 @@ sap.ui.define([
     utils,
     DashboardContentController,
     ActionMode
-) {
+) => {
     "use strict";
 
     // shortcut for sap.ui.core.AccessibleLandmarkRole
-    var AccessibleLandmarkRole = coreLibrary.AccessibleLandmarkRole;
+    const AccessibleLandmarkRole = coreLibrary.AccessibleLandmarkRole;
 
     return View.extend("sap.ushell.components.homepage.DashboardContent", {
         /**
@@ -65,12 +65,15 @@ sap.ui.define([
          *  - AnchorNavigationBar as header.
          *  - DashboardGroupsBox that contains the groups and tiles as content.
          *  - Bar in the footer if edit mode is enabled.
+         *
+         * @param {sap.ushell.components.homepage.DashboardContent.controller} oController the dashboard content controller.
+         * @returns {sap.m.Page} the dashboard page control.
          */
         createContent: function (oController) {
             this.oModel = this.getController().getOwnerComponent().getModel();
 
-            var bEnablePersonalization = this.oModel.getProperty("/personalization");
-            var bEnableTileActionsIcon = this.oModel.getProperty("/enableTileActionsIcon");
+            const bEnablePersonalization = this.oModel.getProperty("/personalization");
+            const bEnableTileActionsIcon = this.oModel.getProperty("/enableTileActionsIcon");
 
             this.isCombi = Device.system.combi;
             this.isTouch = this.isCombi ? false : (Device.system.phone || Device.system.tablet);
@@ -88,7 +91,7 @@ sap.ui.define([
              * In order to save performance we delay the ActionMode init, the footer creation and the overflow of the anchorBar
              * till core-ext file has been loaded.
              */
-            this.oDoable = EventHub.once("CoreResourcesComplementLoaded").do(function () {
+            this.oDoable = EventHub.once("CoreResourcesComplementLoaded").do(() => {
                 this.oAnchorNavigationBar.setOverflowEnabled(true);
 
                 if (bEnablePersonalization || bEnableTileActionsIcon) {
@@ -98,7 +101,7 @@ sap.ui.define([
                     this._createFooter();
                     this._createActionModeButton();
                 }
-            }.bind(this));
+            });
             this.oFilterSelectedGroup = new Filter("isGroupSelected", FilterOperator.EQ, true);
 
             this.oRenderer.getRouter().getRoute("home").attachMatched(this._onHomeNavigation, this);
@@ -107,7 +110,7 @@ sap.ui.define([
             this.oAnchorNavigationBar.setModel(this.oModel);
             this.oRenderer.setNavigationBar(this.oAnchorNavigationBar);
 
-            var oDashboardGroupsBoxModule = new DashboardGroupsBox();
+            const oDashboardGroupsBoxModule = new DashboardGroupsBox();
             // Create the DashboardGroupsBox object that contains groups and tiles
             this.oDashboardGroupsBox = oDashboardGroupsBoxModule.createGroupsBox(oController, this.oModel);
 
@@ -124,8 +127,8 @@ sap.ui.define([
 
             this.oPage.addEventDelegate({
                 onAfterRendering: function () {
-                    var oDomRef = this.getDomRef();
-                    var oScrollableElement = oDomRef.getElementsByTagName("section");
+                    const oDomRef = this.getDomRef();
+                    const oScrollableElement = oDomRef.getElementsByTagName("section");
 
                     jQuery(oScrollableElement[0]).off("scrollstop", oController.handleDashboardScroll);
                     jQuery(oScrollableElement[0]).on("scrollstop", oController.handleDashboardScroll);
@@ -136,8 +139,8 @@ sap.ui.define([
         },
 
         getAnchorItemTemplate: function () {
-            var that = this;
-            var oAnchorItemTemplate = new AnchorItem({
+            const that = this;
+            const oAnchorItemTemplate = new AnchorItem({
                 index: "{index}",
                 title: "{title}",
                 groupId: "{groupId}",
@@ -176,7 +179,7 @@ sap.ui.define([
         },
 
         _getAnchorNavigationBar: function (oController) {
-            var oAnchorNavigationBar = new AnchorNavigationBar("anchorNavigationBar", {
+            const oAnchorNavigationBar = new AnchorNavigationBar("anchorNavigationBar", {
                 selectedItemIndex: "{/topGroupInViewPortIndex}",
                 itemPress: [function (oEvent) {
                     this._handleAnchorItemPress(oEvent);
@@ -184,10 +187,10 @@ sap.ui.define([
                 overflowEnabled: false // we will enable the overflow once coreExt will be loaded!!!
             });
 
-            this._oAnchorNavigationBarDelegatePromise = new Promise(function (resolve, reject) {
+            this._oAnchorNavigationBarDelegatePromise = new Promise((resolve, reject) => {
                 if (Device.system.desktop) {
-                    sap.ui.require(["sap/ushell/components/ComponentKeysHandler"], function (ComponentKeysHandler) {
-                        ComponentKeysHandler.getInstance().then(function (ComponentKeysHandlerInstance) {
+                    sap.ui.require(["sap/ushell/components/ComponentKeysHandler"], (ComponentKeysHandler) => {
+                        ComponentKeysHandler.getInstance().then((ComponentKeysHandlerInstance) => {
                             oAnchorNavigationBar.addEventDelegate({
                                 onBeforeFastNavigationFocus: function (oEvent) {
                                     if (jQuery(".sapUshellAnchorItem").is(":visible")) {
@@ -223,15 +226,15 @@ sap.ui.define([
 
         _actionModeButtonPress: function () {
             this.oDashboardGroupsBox.getBinding("groups").filter([]); // replace model filter in order to show hidden groups
-            var dashboardGroups = this.oDashboardGroupsBox.getGroups();
+            const dashboardGroups = this.oDashboardGroupsBox.getGroups();
             ActionMode.toggleActionMode(this.oModel, "Menu Item", dashboardGroups);
             this._updateAnchorNavigationBarVisibility();
             if (this.oModel.getProperty("/homePageGroupDisplay") === "tabs") {
                 if (this.oModel.getProperty("/tileActionModeActive")) { // To edit mode
                     // find the selected group
-                    var aGroups = this.oModel.getProperty("/groups"),
-                        selectedGroup;
-                    for (var i = 0; i < aGroups.length; i++) {
+                    const aGroups = this.oModel.getProperty("/groups");
+                    let selectedGroup;
+                    for (let i = 0; i < aGroups.length; i++) {
                         if (aGroups[i].isGroupSelected) {
                             selectedGroup = i;
                             break;
@@ -260,13 +263,13 @@ sap.ui.define([
          * @since 1.86.0
          */
         _createActionModeButton: function () {
-            var oActionButtonObjectData = {
+            const oActionButtonObjectData = {
                 id: "ActionModeBtn",
                 text: resources.i18n.getText("activateEditMode"),
                 icon: "sap-icon://edit",
                 press: this._actionModeButtonPress.bind(this)
             };
-            var bMoveEditButtonToShellHeader = this.oRenderer.getShellConfig().moveEditHomePageActionToShellHeader;
+            const bMoveEditButtonToShellHeader = this.oRenderer.getShellConfig().moveEditHomePageActionToShellHeader;
             if (bMoveEditButtonToShellHeader) {
                 this._createActionModeButtonInHeader(oActionButtonObjectData);
             } else {
@@ -283,7 +286,16 @@ sap.ui.define([
          * @since 1.86.0
          */
         _createActionModeButtonInHeader: function (oActionButtonObjectData) {
-            sap.ui.require(["sap/ushell/ui/shell/ShellHeadItem"], function (ShellHeadItem) {
+            let sRequirePath = "sap/ushell/ui/shell/ShellHeadItem";
+            if (Config.last("/core/shellBar/enabled")) {
+                sRequirePath = "sap/ushell/gen/ui5/webcomponents-fiori/dist/ShellBarItem";
+                if (oActionButtonObjectData.press) {
+                    oActionButtonObjectData.click = oActionButtonObjectData.press;
+                    delete oActionButtonObjectData.press; // remove press handler, since it is not used in ShellBarItem
+                }
+            }
+
+            sap.ui.require([sRequirePath], (ShellHeadItem) => {
                 this.oTileActionsButton = new ShellHeadItem(oActionButtonObjectData);
                 if (Config.last("/core/extension/enableHelp")) {
                     this.oTileActionsButton.addStyleClass("help-id-ActionModeBtn"); // xRay help ID
@@ -293,7 +305,7 @@ sap.ui.define([
                 } else {
                     this.oRenderer.showHeaderEndItem(this.oTileActionsButton.getId(), false, ["home"]);
                 }
-            }.bind(this));
+            });
         },
 
         /**
@@ -305,7 +317,7 @@ sap.ui.define([
          * @since 1.86.0
          */
         _createActionModeButtonInUserMenu: function (oActionButtonObjectData) {
-            var oAddActionButtonParameters = {
+            const oAddActionButtonParameters = {
                 controlType: "sap.ushell.ui.launchpad.ActionItem",
                 oControlProperties: oActionButtonObjectData,
                 bIsVisible: true,
@@ -317,14 +329,13 @@ sap.ui.define([
                 oAddActionButtonParameters.bCurrentState = true;
             }
 
-            this.oRenderer.addUserAction(oAddActionButtonParameters).done(function (oActionButton) {
+            this.oRenderer.addUserAction(oAddActionButtonParameters).done((oActionButton) => {
                 this.oTileActionsButton = oActionButton;
                 // if xRay is enabled
                 if (Config.last("/core/extension/enableHelp")) {
                     this.oTileActionsButton.addStyleClass("help-id-ActionModeBtn");// xRay help ID
                 }
-            }.bind(this));
-
+            });
         },
 
         _handleEditModeChange: function () {
@@ -338,7 +349,7 @@ sap.ui.define([
                 "sap/m/Bar",
                 "sap/m/Button",
                 "sap/m/ToolbarSpacer"
-            ], function (Bar, Button, ToolbarSpacer) {
+            ], (Bar, Button, ToolbarSpacer) => {
                 this.oPage.setFooter(new Bar("sapUshellDashboardFooter", {
                     visible: "{/tileActionModeActive}",
                     contentRight: [
@@ -351,11 +362,11 @@ sap.ui.define([
                         })
                     ]
                 }));
-            }.bind(this));
+            });
         },
 
         _onDashboardShown: function () {
-            var bInDashboard = this.oRenderer && this.oRenderer.getCurrentCoreView() === "home";
+            const bInDashboard = this.oRenderer && this.oRenderer.getCurrentCoreView() === "home";
 
             if (bInDashboard) {
                 if (!Device.system.phone) {
@@ -367,11 +378,11 @@ sap.ui.define([
                 this.getController().resizeHandler();
                 utils.refreshTiles();
                 if (Device.system.desktop) {
-                    var sTagName = document.activeElement ? document.activeElement.tagName : "";
+                    const sTagName = document.activeElement ? document.activeElement.tagName : "";
                     if (sTagName !== "INPUT" && sTagName !== "TEXTAREA") {
                         // only change the focus while not renaming a tile
-                        sap.ui.require(["sap/ushell/components/ComponentKeysHandler"], function (ComponentKeysHandler) {
-                            ComponentKeysHandler.getInstance().then(function (ComponentKeysHandlerInstance) {
+                        sap.ui.require(["sap/ushell/components/ComponentKeysHandler"], (ComponentKeysHandler) => {
+                            ComponentKeysHandler.getInstance().then((ComponentKeysHandlerInstance) => {
                                 ComponentKeysHandlerInstance.goToLastVisitedTile();
                             });
                         });
@@ -397,26 +408,25 @@ sap.ui.define([
         },
 
         _updateAnchorNavigationBarVisibility: function () {
-            var bOldVisible = this.oAnchorNavigationBar.getVisible(),
-                bActionModeActive = this.getModel().getObject("/tileActionModeActive"),
-                aVisibleGroups = this.getModel().getProperty("/groups").filter(function (oGroup) {
-                    // Check for group's visibility AND - depending on the ActionMode - the visibilityMode
-                    // (see ushell/utils.calcVisibilityModes() for details of visibilityModes)
-                    if (bActionModeActive) {
-                        return oGroup.isGroupVisible && oGroup.visibilityModes[1];
-                    }
-                    return oGroup.isGroupVisible && oGroup.visibilityModes[0];
-
-                }),
-                bVisible = aVisibleGroups.length > 1;
+            const bOldVisible = this.oAnchorNavigationBar.getVisible();
+            const bActionModeActive = this.getModel().getObject("/tileActionModeActive");
+            const aVisibleGroups = this.getModel().getProperty("/groups").filter((oGroup) => {
+                // Check for group's visibility AND - depending on the ActionMode - the visibilityMode
+                // (see ushell/utils.calcVisibilityModes() for details of visibilityModes)
+                if (bActionModeActive) {
+                    return oGroup.isGroupVisible && oGroup.visibilityModes[1];
+                }
+                return oGroup.isGroupVisible && oGroup.visibilityModes[0];
+            });
+            const bVisible = aVisibleGroups.length > 1;
 
             this.oAnchorNavigationBar.setVisible(bVisible);
 
             if (bVisible && !bOldVisible) {
-                var aGroups = this.getModel().getProperty("/groups"),
-                    iSelectedGroup = this.getModel().getProperty("/iSelectedGroup");
+                const aGroups = this.getModel().getProperty("/groups");
+                const iSelectedGroup = this.getModel().getProperty("/iSelectedGroup");
 
-                for (var i = 0; i < aVisibleGroups.length; i++) {
+                for (let i = 0; i < aVisibleGroups.length; i++) {
                     if (aVisibleGroups[i].getGroupId && aVisibleGroups[i].getGroupId() === aGroups[iSelectedGroup].groupId) {
                         this.oAnchorNavigationBar.setSelectedItemIndex(i);
                         break;