@sapui5/sap.ushell 1.138.1 → 1.139.0

package/src/main/js/sap/ushell/components/shell/Notifications/Component.js

@@ -21,7 +21,7 @@ sap.ui.define([
     "sap/ushell/state/ShellModel",
     "sap/ui/core/mvc/XMLView",
     "sap/ui/core/Fragment"
-], function (
+], (
     Log,
     Element,
     EventBus,
@@ -42,17 +42,17 @@ sap.ui.define([
     ShellModel,
     XMLView,
     Fragment
-) {
+) => {
     "use strict";
 
     // Time in seconds for the notification to be shown
-    var iNotificationsAlertTimeout = 10;
+    const iNotificationsAlertTimeout = 10;
 
     // shortcut for sap.m.PlacementType
-    var PlacementType = mobileLibrary.PlacementType;
+    const PlacementType = mobileLibrary.PlacementType;
 
     // shortcut for sap.ushell.FloatingNumberType
-    var FloatingNumberType = ushellLibrary.FloatingNumberType;
+    const FloatingNumberType = ushellLibrary.FloatingNumberType;
 
     function getNotificationButton () {
         return Element.getElementById("NotificationsCountButton");
@@ -64,7 +64,7 @@ sap.ui.define([
 
     return UIComponent.extend("sap.ushell.components.shell.Notifications.Component", {
         metadata: {
-            version: "1.138.1",
+            version: "1.139.0",
             library: "sap.ushell.components.shell.Notifications",
             dependencies: {
                 libs: ["sap.m"]
@@ -75,8 +75,7 @@ sap.ui.define([
             this._aTimeouts = [];
             this.oRenderer = Container.getRendererInternal("fiori2");
             this.oConfigModel = ShellModel.getConfigModel();
-            Container.getServiceAsync("NotificationsV2").then(function (oNotificationsService) {
-
+            Container.getServiceAsync("NotificationsV2").then((oNotificationsService) => {
                 this.oNotificationsService = oNotificationsService;
 
                 if (this.oNotificationsService.isEnabled() === true) {
@@ -91,12 +90,12 @@ sap.ui.define([
 
                     EventHub.on("showNotifications").do(this._toggleNotifications.bind(this));
                 }
-            }.bind(this));
+            });
         },
 
         _createNotificationButton: function (oConfigModel) {
             // The press handler is added in the Notification Component
-            var oNotificationToggleButton = new ShellHeadItem({
+            const oNotificationToggleButton = new ShellHeadItem({
                 id: "NotificationsCountButton",
                 tooltip: resources.i18n.getText("notificationsBtn_title"),
                 icon: IconPool.getIconURI("bell"),
@@ -183,7 +182,7 @@ sap.ui.define([
                 });
             // Use classic notifications popover
             } else {
-                //create an element of RightFloatingContainer
+                // create an element of RightFloatingContainer
                 const oAlertEntry = this.oRenderer.addRightFloatingContainerItem({
                     press: fnItemClick,
                     close: function () {
@@ -197,9 +196,9 @@ sap.ui.define([
                     hideShowMoreButton: true
                 }, true, true);
                 this.oRenderer.showRightFloatingContainer(true);
-                const iTimeout = setTimeout(function () {
+                const iTimeout = setTimeout(() => {
                     this.oRenderer.removeRightFloatingContainerItem(oAlertEntry.getId(), true);
-                }.bind(this), iNotificationsAlertTimeout * 1000);
+                }, iNotificationsAlertTimeout * 1000);
                 this._aTimeouts.push(iTimeout);
             }
         },
@@ -209,12 +208,12 @@ sap.ui.define([
         _updateCount: function () {
             this._getPopover().then((oPopover) => {
                 if (!oPopover.isOpen()) {
-                    this.oNotificationsService.getUnseenNotificationsCount().then(function (iNumberOfNotifications) {
+                    this.oNotificationsService.getUnseenNotificationsCount().then((iNumberOfNotifications) => {
                         this.oConfigModel.setProperty("/notificationsCount", parseInt(iNumberOfNotifications, 10));
-                    }.bind(this))
-                    .catch(function (data) {
-                        Log.error("Notifications - call to notificationsService.getCount failed: ", data);
-                    });
+                    })
+                        .catch((data) => {
+                            Log.error("Notifications - call to notificationsService.getCount failed: ", data);
+                        });
                 }
             });
         },
@@ -230,7 +229,7 @@ sap.ui.define([
          * @private
          */
         _wrapPopover: function (oNotificationView, oCustomHeader) {
-            var oPopover = new Popover("shellNotificationsPopover", {
+            const oPopover = new Popover("shellNotificationsPopover", {
                 showHeader: !!oCustomHeader,
                 customHeader: oCustomHeader,
                 placement: PlacementType.Bottom,
@@ -244,7 +243,7 @@ sap.ui.define([
                     oEvent.getSource().getContent()[0].invalidate(); // Workaround to fix 1980098133; for some reason, still needed
                 }
             });
-            oPopover._oAriaLabelledByText = new InvisibleText(oPopover.getId() + "-labelledBy", {
+            oPopover._oAriaLabelledByText = new InvisibleText(`${oPopover.getId()}-labelledBy`, {
                 text: resources.i18n.getText("NotificationToggleButton.NoNewNotifications")
             }).toStatic();
             oPopover.addDependent(oPopover._oAriaLabelledByText);
@@ -286,7 +285,10 @@ sap.ui.define([
                                 oPopover.addStyleClass("sapUshellNotificationsListPopup");
 
                                 // Every time the popover opens, we need to load the notifications.
-                                oPopover.attachBeforeOpen(oController.getNextPage.bind(oController, true));
+                                oPopover.attachBeforeOpen(() => {
+                                    this.oNotificationsService.setUnseenNotificationsCount(0);
+                                    oController.getNextPage(true);
+                                });
 
                                 // Initial focus is required, otherwise the focus is lost and not set properly.
                                 oPopover.setInitialFocus(oController.byId("sapUshellNotificationsList"));
@@ -299,28 +301,28 @@ sap.ui.define([
                         });
                     });
                 } else {
-                    this._oNotificationsPopoverPromise = new Promise(function (resolve, reject) {
+                    this._oNotificationsPopoverPromise = new Promise((resolve, reject) => {
                         XMLView.create({
                             id: "notificationsView",
                             viewName: "sap.ushell.components.shell.Notifications.Notifications",
                             viewData: { notificationsService: this.oNotificationsService }
-                        }).then(function (oNotificationView) {
-                            var oNotificationIconTabBar = oNotificationView.byId("notificationIconTabBar");
+                        }).then((oNotificationView) => {
+                            const oNotificationIconTabBar = oNotificationView.byId("notificationIconTabBar");
                             oNotificationIconTabBar.setAriaTexts({
                                 headerLabel: resources.i18n.getText("Notifications.Popover.IconTabBar.Header.AriaLabel")
                             });
 
-                            var oNotificationsListDate = oNotificationView.byId("sapUshellNotificationsListDate");
+                            const oNotificationsListDate = oNotificationView.byId("sapUshellNotificationsListDate");
                             oNotificationsListDate.enhanceAccessibilityState = function (oNLD, mAriaProps) {
                                 mAriaProps.hidden = true;
                                 return mAriaProps;
                             };
-                            var oNotificationsListPriority = oNotificationView.byId("sapUshellNotificationsListPriority");
+                            const oNotificationsListPriority = oNotificationView.byId("sapUshellNotificationsListPriority");
                             oNotificationsListPriority.enhanceAccessibilityState = function (oNLP, mAriaProps) {
                                 mAriaProps.hidden = true;
                                 return mAriaProps;
                             };
-                            var oNotificationsListType = oNotificationView.byId("sapUshellNotificationsListType");
+                            const oNotificationsListType = oNotificationView.byId("sapUshellNotificationsListType");
                             oNotificationsListType.enhanceAccessibilityState = function (oNLT, mAriaProps) {
                                 mAriaProps.hidden = true;
                                 return mAriaProps;
@@ -329,15 +331,15 @@ sap.ui.define([
                             const oPopover = this._wrapPopover(oNotificationView);
                             oPopover.addStyleClass("sapUshellNotificationsPopup");
                             resolve(oPopover);
-                        }.bind(this)).catch(reject);
-                    }.bind(this));
+                        }).catch(reject);
+                    });
                 }
             }
             return this._oNotificationsPopoverPromise;
         },
 
         _toggleNotifications: function (bShow) {
-            this._getPopover().then(function (oPopover) {
+            this._getPopover().then((oPopover) => {
                 let oSource;
                 if (Config.last("/core/shellBar/enabled")) {
                     oSource = getShellBarNotificationButton();
@@ -355,7 +357,7 @@ sap.ui.define([
                     this._resetCount();
                     oPopover.openBy(oSource);
                 }
-            }.bind(this));
+            });
         },
 
         _resetCount: function () {
@@ -370,13 +372,13 @@ sap.ui.define([
             }
             this.oNotificationsService = null;
 
-            var oNotificationBtn = getNotificationButton();
+            const oNotificationBtn = getNotificationButton();
             if (oNotificationBtn) {
                 this.oRenderer.hideHeaderEndItem(oNotificationBtn, false);
                 oNotificationBtn.destroy();
             }
             this.oRenderer = null;
-            var oNotificationsPopover = Element.getElementById("notificationsView");
+            let oNotificationsPopover = Element.getElementById("notificationsView");
             if (oNotificationsPopover) {
                 oNotificationsPopover.destroy();
                 oNotificationsPopover = null;

package/src/main/js/sap/ushell/components/shell/Notifications/Notifications.controller.js

@@ -16,7 +16,7 @@ sap.ui.define([
     "sap/ushell/Container",
     "sap/ushell/resources",
     "sap/ushell/utils"
-], function (
+], (
     Log,
     CustomListItem,
     mobileLibrary,
@@ -32,7 +32,7 @@ sap.ui.define([
     Container,
     resources,
     ushellUtils
-) {
+) => {
     "use strict";
 
     // shortcut for sap.ui.core.Priority
@@ -296,7 +296,6 @@ sap.ui.define([
                     }
                 });
 
-
                 const sExpandedGroupId = this.sCurrentExpandedType;
                 if (sExpandedGroupId) {
                     const oExpandedGroup = aGroups[iExpandedIndex];
@@ -359,7 +358,7 @@ sap.ui.define([
         },
 
         //*********************************************************************************************************
-        //************************************** Notification actions *********************************************
+        //* ************************************* Notification actions *********************************************
 
         executeAction: function (sNotificationId, sActionName) {
             return this.oNotificationsService.executeAction(sNotificationId, sActionName);
@@ -428,7 +427,7 @@ sap.ui.define([
         },
 
         //*********************************************************************************************************
-        //****************************************** Busy Indicator ***********************************************
+        //* ***************************************** Busy Indicator ***********************************************
 
         addBusyIndicatorToTabFilter: function (sSortingType) {
             const oList = this.getNotificationList(sSortingType);
@@ -444,7 +443,7 @@ sap.ui.define([
         },
 
         //*********************************************************************************************************
-        //***************************************** Model functions ***********************************************
+        //* **************************************** Model functions ***********************************************
 
         refreshModel: async function () {
             if (this.sCurrentSorting === this.oSortingType.NOTIFICATIONS_BY_TYPE_DESCENDING) {
@@ -486,7 +485,7 @@ sap.ui.define([
         },
 
         //*********************************************************************************************************
-        //**************************************** Handler functions ***********************************************
+        //* *************************************** Handler functions ***********************************************
 
         onTabSelected: function (oEvent) {
             const sKey = oEvent.getParameter("key");
@@ -636,7 +635,7 @@ sap.ui.define([
         },
 
         //*********************************************************************************************************
-        //**************************************** Helper functions ***********************************************
+        //* *************************************** Helper functions ***********************************************
 
         getNumberOfItemsInScreen: function () {
             const iHeight = jQuery(window).height();
@@ -797,7 +796,7 @@ sap.ui.define([
         },
 
         //*********************************************************************************************************
-        //**************************************** Formatter functions ********************************************
+        //* *************************************** Formatter functions ********************************************
 
         priorityFormatter: function (sPriority) {
             if (sPriority) {

package/src/main/js/sap/ushell/components/shell/Notifications/NotificationsList.controller.js

@@ -1,10 +1,8 @@
 // Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 sap.ui.define([
-    "sap/base/Log",
     "sap/base/util/deepExtend",
     "sap/m/MessageToast",
-    "sap/m/Text",
     "sap/ui/core/format/DateFormat",
     "sap/ui/core/Fragment",
     "sap/ui/core/mvc/Controller",
@@ -14,11 +12,9 @@ sap.ui.define([
     "sap/ushell/EventHub",
     "sap/ushell/resources",
     "sap/ushell/utils"
-], function (
-    Log,
+], (
     deepExtend,
     MessageToast,
-    Text,
     DateFormat,
     Fragment,
     Controller,
@@ -28,7 +24,7 @@ sap.ui.define([
     EventHub,
     resources,
     ushellUtils
-) {
+) => {
     "use strict";
 
     async function _errorMessage (sText) {
@@ -253,7 +249,6 @@ sap.ui.define([
             return aNotificationsByPriority;
         },
 
-
         /**
          * Groups the notifications by time periods.
          *
@@ -471,7 +466,6 @@ sap.ui.define([
             oModel.setProperty("/listMaxReached", bMaxReached);
         },
 
-
         /**
          * Update the selection state and icon of the sorting menu items.
          *
@@ -599,7 +593,7 @@ sap.ui.define([
                 oNoData.addEventDelegate(oEventDelegate);
             };
 
-            const fnFocusItem = (oFocusItem) => {
+            function fnFocusItem (oFocusItem) {
                 oFocusItem?.getParent()?.setCollapsed(false);
                 const oEventDelegate = {
                     onAfterRendering: () => {
@@ -610,7 +604,7 @@ sap.ui.define([
                     }
                 };
                 oFocusItem.addEventDelegate(oEventDelegate);
-            };
+            }
 
             switch (sReason) {
                 case this.oSetFocusReason.ListRefreshed:
@@ -697,7 +691,7 @@ sap.ui.define([
         },
 
         //*********************************************************************************************************
-        //**************************************** Handler functions **********************************************
+        //* *************************************** Handler functions **********************************************
 
         /**
          * Handles the press event on the "More" button which loads more notifications.

package/src/main/js/sap/ushell/components/shell/PostLoadingHeaderEnhancement/Component.js

@@ -16,7 +16,7 @@ sap.ui.define([
     "sap/ushell/state/StateManager",
     "sap/ushell/Container",
     "sap/ushell/utils/UrlParsing"
-], function (
+], (
     Localization,
     Device,
     Component,
@@ -32,14 +32,14 @@ sap.ui.define([
     StateManager,
     Container,
     UrlParsing
-) {
+) => {
     "use strict";
 
     // shortcut for sap.ushell.AppTitleState
-    var AppTitleState = ushellLibrary.AppTitleState;
+    const AppTitleState = ushellLibrary.AppTitleState;
 
     // shortcut for sap.ushell.FloatingNumberType
-    var FloatingNumberType = ushellLibrary.FloatingNumberType;
+    const FloatingNumberType = ushellLibrary.FloatingNumberType;
 
     // shortcut for sap.ushell.state.StateManager.LaunchpadState
     const LaunchpadState = StateManager.LaunchpadState;
@@ -57,14 +57,14 @@ sap.ui.define([
         Merged
     } = ShellMode;
 
-    var aCreatedControlIds = [];
+    let aCreatedControlIds = [];
 
     return Component.extend("sap.ushell.components.shell.PostLoadingHeaderEnhancement.Component", {
         metadata: {
             library: "sap.ushell"
         },
         init: function () {
-            var oShellConfig = Container.getRendererInternal("fiori2").getShellConfig();
+            const oShellConfig = Container.getRendererInternal("fiori2").getShellConfig();
 
             aCreatedControlIds.push(this._createBackButton());
             aCreatedControlIds.push(this._createOverflowButton());
@@ -74,22 +74,22 @@ sap.ui.define([
             }
 
             if (oShellConfig.moveContactSupportActionToShellHeader) {
-                this._createSupportButton().then(function (sBtnId) {
+                this._createSupportButton().then((sBtnId) => {
                     aCreatedControlIds.push(sBtnId);
                 });
             }
 
             this._createShellNavigationMenu();
 
-            var oShellHeader = Element.getElementById("shell-header");
+            const oShellHeader = Element.getElementById("shell-header");
             oShellHeader.updateAggregation("headItems");
             oShellHeader.updateAggregation("headEndItems");
         },
 
         _createBackButton: function () {
-            var sBackButtonIcon = Localization.getRTL() ? "feeder-arrow" : "nav-back";
+            const sBackButtonIcon = Localization.getRTL() ? "feeder-arrow" : "nav-back";
             const sCurrentShellMode = StateManager.getShellMode();
-            var oBackButton;
+            let oBackButton;
             if (Config.last("/core/shellBar/enabled")) {
                 const Button = sap.ui.require("sap/ushell/gen/ui5/webcomponents/dist/Button");
                 oBackButton = new Button({
@@ -113,7 +113,6 @@ sap.ui.define([
                 });
             }
 
-
             if ([Default, Standalone, Embedded, Merged].includes(sCurrentShellMode)) {
                 StateManager.updateBaseStates([LaunchpadState.App], "header.headItems", Operation.Add, oBackButton.getId());
             } else if (sCurrentShellMode === Lean) {
@@ -148,6 +147,11 @@ sap.ui.define([
         },
 
         _createOverflowButton: function () {
+            if (Config.last("/core/shellBar/enabled")) {
+                // overflow is hanlded by the ShellBar component
+                return;
+            }
+
             var oEndItemsOverflowBtn = new ShellHeadItem({
                 id: "endItemsOverflowBtn",
                 tooltip: {
@@ -170,15 +174,32 @@ sap.ui.define([
             return oEndItemsOverflowBtn.getId();
         },
 
+        _createHeaderItem: function (oSettings) {
+            if (Config.last("/core/shellBar/enabled")) {
+                const ShellBarItem = sap.ui.require("sap/ushell/gen/ui5/webcomponents-fiori/dist/ShellBarItem");
+                // Create a ShellBarItem for the shell header
+                oSettings.click = oSettings.press; // web components use click instead of press
+                delete oSettings.press; // remove press to avoid confusion
+
+                oSettings.accessibilityAttributes = oSettings.accessibilityAttributes || {};
+                oSettings.accessibilityAttributes.hasPopup = oSettings.accessibilityAttributes.hasPopup || oSettings.ariaHaspopup;
+                delete oSettings.ariaHaspopup; // web components do not support ariaHaspopup
+                delete oSettings.ariaLabel; // web components do not support ariaLabel
+
+                return new ShellBarItem(oSettings);
+            }
+                return new ShellHeadItem(oSettings);
+        },
+
         _createAppFinderButton: function () {
-            var oOpenCatalogButton = new ShellHeadItem({
+            var oOpenCatalogButton = this._createHeaderItem({
                 id: "openCatalogBtn",
                 text: resources.i18n.getText("open_appFinderBtn"),
                 ariaLabel: resources.i18n.getText("open_appFinderBtn"),
                 tooltip: resources.i18n.getText("open_appFinderBtn"),
                 icon: "sap-icon://sys-find",
                 press: function () {
-                    Container.getServiceAsync("Navigation").then(function (oNavService) {
+                    Container.getServiceAsync("Navigation").then((oNavService) => {
                         oNavService.navigate({
                             target: {
                                 semanticObject: "Shell",
@@ -198,22 +219,22 @@ sap.ui.define([
         },
 
         _createSupportButton: function () {
-            return new Promise(function (fnResolve) {
-                sap.ui.require(["sap/ushell/ui/footerbar/ContactSupportButton"], function (ContactSupportButton) {
-                    var sButtonName = "ContactSupportBtn";
-                    var oSupportButton = Element.getElementById(sButtonName);
+            return new Promise((fnResolve) => {
+                sap.ui.require(["sap/ushell/ui/footerbar/ContactSupportButton"], (ContactSupportButton) => {
+                    const sButtonName = "ContactSupportBtn";
+                    let oSupportButton = Element.getElementById(sButtonName);
                     if (!oSupportButton) {
                         // Create an ActionItem from UserActionsMenu (ContactSupportButton)
                         // in order to to take its text and icon
                         // and fire the press method when the shell header item is pressed,
                         // but don't render this control
-                        var oTempButton = new ContactSupportButton("tempContactSupportBtn", {
+                        const oTempButton = new ContactSupportButton("tempContactSupportBtn", {
                             visible: true
                         });
 
-                        var sIcon = oTempButton.getIcon();
-                        var sText = oTempButton.getText();
-                        oSupportButton = new ShellHeadItem({
+                        const sIcon = oTempButton.getIcon();
+                        const sText = oTempButton.getText();
+                        oSupportButton = this._createHeaderItem({
                             id: sButtonName,
                             icon: sIcon,
                             tooltip: sText,
@@ -238,16 +259,16 @@ sap.ui.define([
                     "sap/m/StandardListItem",
                     "sap/ushell/ui/shell/NavigationMiniTile",
                     "sap/ushell/ui/shell/ShellNavigationMenu"
-                ], function (StandardListItem, NavigationMiniTile, ShellNavigationMenu) {
-                    var sMenuId = "shellNavigationMenu";
+                ], (StandardListItem, NavigationMiniTile, ShellNavigationMenu) => {
+                    const sMenuId = "shellNavigationMenu";
 
-                    var oHierarchyTemplateFunction = function (sId, oContext) {
-                        var sIcon = oContext.getProperty("icon") || "sap-icon://circle-task-2",
-                            sTitle = oContext.getProperty("title"),
-                            sSubtitle = oContext.getProperty("subtitle"),
-                            sIntent = oContext.getProperty("intent");
+                    function oHierarchyTemplateFunction (sId, oContext) {
+                        const sIcon = oContext.getProperty("icon") || "sap-icon://circle-task-2";
+                        const sTitle = oContext.getProperty("title");
+                        const sSubtitle = oContext.getProperty("subtitle");
+                        const sIntent = oContext.getProperty("intent");
 
-                        var oListItem = (new StandardListItem({
+                        const oListItem = (new StandardListItem({
                             type: "Active", // Use string literal to avoid dependency from sap.m.library
                             title: sTitle,
                             description: sSubtitle,
@@ -265,29 +286,29 @@ sap.ui.define([
                         })).addStyleClass("sapUshellNavigationMenuListItems");
 
                         return oListItem;
-                    };
+                    }
 
-                    var oRelatedAppsTemplateFunction = function (sId, oContext) {
+                    function oRelatedAppsTemplateFunction (sId, oContext) {
                         // default icon behavior
-                        var sIcon = oContext.getProperty("icon"),
-                            sTitle = oContext.getProperty("title"),
-                            sSubtitle = oContext.getProperty("subtitle"),
-                            sIntent = oContext.getProperty("intent");
+                        const sIcon = oContext.getProperty("icon");
+                        const sTitle = oContext.getProperty("title");
+                        const sSubtitle = oContext.getProperty("subtitle");
+                        const sIntent = oContext.getProperty("intent");
                         return new NavigationMiniTile({
                             title: sTitle,
                             subtitle: sSubtitle,
                             icon: sIcon,
                             intent: sIntent,
                             press: function () {
-                                var sTileIntent = this.getIntent();
+                                const sTileIntent = this.getIntent();
                                 if (sTileIntent && sTileIntent[0] === "#") {
                                     EventHub.emit("navigateFromShellApplicationNavigationMenu", sTileIntent, true);
                                 }
                             }
                         });
-                    };
+                    }
 
-                    var oShellNavigationMenu = new ShellNavigationMenu(sMenuId, {
+                    const oShellNavigationMenu = new ShellNavigationMenu(sMenuId, {
                         showRelatedApps: StateManager.getShellMode() !== Lean,
                         items: {
                             path: "shellModel>/application/hierarchy",
@@ -308,20 +329,20 @@ sap.ui.define([
                     oShellNavigationMenu.setModel(ShellModel.getModel(), "shellModel");
                     oShellNavigationMenu.setModel(ShellModel.getConfigModel(), "configModel");
 
-                    var oShellAppTitle = Element.getElementById("shellAppTitle");
+                    const oShellAppTitle = Element.getElementById("shellAppTitle");
                     if (oShellAppTitle) {
                         oShellAppTitle.setNavigationMenu(oShellNavigationMenu);
                     }
                     aCreatedControlIds.push(sMenuId);
 
                     resolve(oShellNavigationMenu);
-                }.bind(this));
+                });
             });
         },
 
         exit: function () {
-            aCreatedControlIds.forEach(function (sControl) {
-                var oControl = Element.getElementById(sControl);
+            aCreatedControlIds.forEach((sControl) => {
+                const oControl = Element.getElementById(sControl);
                 if (oControl) {
                     oControl.destroy();
                 }