@sapui5/sap.ushell 1.134.1 → 1.136.0

package/src/main/js/sap/ushell/components/shell/SideNavigation/modules/Favorites.js

@@ -1,50 +1,71 @@
 // Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 sap.ui.define([
-    "sap/tnt/NavigationListItem",
+    "sap/m/GenericTile",
+    "sap/m/library",
     "sap/tnt/NavigationListGroup",
-    "sap/ushell/Config",
-    "sap/ushell/Container",
+    "sap/tnt/NavigationListItem",
+    "sap/ui/core/ComponentContainer",
     "sap/ui/core/CustomData",
     "sap/ui/model/Filter",
     "sap/ui/model/FilterOperator",
-    "sap/ui/model/json/JSONModel"
+    "sap/ui/model/json/JSONModel",
+    "sap/ushell/Config",
+    "sap/ushell/Container",
+    "sap/ushell/components/shell/SideNavigation/modules/NavigationHelper"
 ], function (
-    NavigationListItem,
+    GenericTile,
+    mobileLibrary,
     NavigationListGroup,
-    Config,
-    Container,
+    NavigationListItem,
+    ComponentContainer,
     CustomData,
     Filter,
     FilterOperator,
-    JSONModel
+    JSONModel,
+    Config,
+    Container,
+    NavigationHelper
 ) {
     "use strict";
 
     /**
-     * The menu entry "Favorites" with the sections and apps from the MyHome page for the SideNavigation.
+     * The menu entry "Favorites" with the sections (folders) and apps from the MyHome page for the SideNavigation.
      *
      * @since 1.134.0
      * @private
      */
     class Favorites {
         /**
-         * The side navigation API object.
-         * @type {object} Holds the side navigation API object passed to the constructor.
+         * The side navigation API object passed to the constructor.
+         * @type {object}
          */
         #oSideNavAPI;
 
         /**
-         * The root navigation list item.
-         * @type {sap.tnt.NavigationListGroup} The root navigation list group item configured with sections and apps.
+         * The promise which resolves with the root navigation list item when everything is loaded.
+         * @type {Promise<sap.tnt.NavigationListGroup>}
+         */
+        #pItemReady;
+
+        /**
+         * The root navigation list item group item configured with sections and apps.
+         * @type {sap.tnt.NavigationListGroup}
          */
         #oRootItem;
 
         /**
-         * The promise which resolves with the root navigation list item when everything is loaded.
-         * @type {Promise<sap.tnt.NavigationListGroup>} Resolves with the root navigation list item.
+         * Helper class for performing navigation actions.
+         * @type {NavigationHelper} Helper class for performing navigation actions.
          */
-        #pItemReady;
+        #NavigationHelper;
+
+        /**
+         * The object that stores the smart business visualization instances.
+         * Those are used to navigate to the app by firing the press event on the GenericTile.
+         * @type {object}
+         */
+        #oSmartBusinessVizInstances = {};
 
         /**
          * Creates a new menu entry "Favorites" with the sections and apps from the MyHome page for the SideNavigation.
@@ -73,6 +94,8 @@ sap.ui.define([
             this.#pItemReady = new Promise((resolve, reject) => {
                 this.#prepareModel(resolve, reject);
             });
+
+            this.#NavigationHelper = new NavigationHelper();
         }
 
         /**
@@ -95,11 +118,26 @@ sap.ui.define([
          * @param {sap.ui.base.Event} oEvent The event object.
          * @since 1.134.0
          */
-        onItemPressed (oEvent) {
-            const sTargetUrl = oEvent.getSource().getBindingContext("favorites").getProperty("targetURL");
-            if (sTargetUrl) {
-                this.#oSideNavAPI.closeSideNavigation();
+        async onItemPressed (oEvent) {
+            const oVisualization = oEvent.getSource().getBindingContext("favorites").getProperty();
+            // Check if the item is a visualization
+            if (!oVisualization.vizType) {
+                // No navigation for sections
+                return;
             }
+
+            const oVizInstance = this.#oSmartBusinessVizInstances[oVisualization.id];
+            if (oVizInstance) {
+                // Is smart business visualization
+                await oVizInstance.loaded();
+                this.#getGenericTileInstance(oVizInstance.getContent())?.firePress();
+            } else if (oVisualization.targetURL) {
+                this.#NavigationHelper.navigate({
+                    target: { shellHash: oVisualization.targetURL },
+                    type: "IBN"
+                });
+            }
+            this.#oSideNavAPI.closeSideNavigation();
         }
 
         /**
@@ -130,11 +168,11 @@ sap.ui.define([
             const oPagesModel = oPagesService.getModel();
             const oFavoritesModel = new JSONModel([]);
             oPagesModel.attachEvent("dataChange", () => {
-                this.#updateFavoritesModel(oPagesModel, oFavoritesModel, sHomePagePath);
+                this.#updateFavoritesModel(oFavoritesModel, sMyHomePageId);
             });
 
             this.#oRootItem.setModel(oFavoritesModel, "favorites");
-            this.#updateFavoritesModel(oPagesModel, oFavoritesModel, sHomePagePath);
+            await this.#updateFavoritesModel(oFavoritesModel, sMyHomePageId);
 
             resolve(this.#oRootItem);
         }
@@ -142,15 +180,18 @@ sap.ui.define([
         /**
          * Updates the favorites model with the sections and apps from the MyHome page.
          *
-         * @param {sap.ushell.utils.RestrictedJSONModel} oPagesModel The pages model.
          * @param {sap.ui.model.json.JSONModel} oFavoritesModel The favorites model.
-         * @param {string} sHomePagePath The path to the MyHome page.
+         * @param {string} sMyHomePageId The path to the MyHome page.
          *
          * @since 1.134.0
          * @private
          */
-        #updateFavoritesModel (oPagesModel, oFavoritesModel, sHomePagePath) {
-            const aMyHomePageSections = oPagesModel.getProperty(`${sHomePagePath}/sections`);
+        async #updateFavoritesModel (oFavoritesModel, sMyHomePageId) {
+            const oPagesService = await Container.getServiceAsync("Pages");
+            const sHomePagePath = await oPagesService.loadPage(sMyHomePageId);
+            const oPagesModel = oPagesService.getModel();
+
+            const aMyHomePageSections = oPagesModel.getProperty(`${sHomePagePath}/sections`) || [];
             const aFavorites = [];
             let oDefaultSection;
 
@@ -162,14 +203,15 @@ sap.ui.define([
             }, {});
 
             aMyHomePageSections.forEach((oSection) => {
-                // Remember default section to append it at the end
+                // Remember default section to add its visualizations to the beginning
                 if (oSection.default) {
                     oDefaultSection = oSection;
                     return;
                 }
-                // Add folders in existing order
+                // Add sections in existing order
                 const aVisualizations = oSection.visualizations;
                 if (aVisualizations.length > 0) {
+                    this.#processSmartBusinessVisualizations(aVisualizations);
                     aFavorites.push({
                         id: oSection.id,
                         title: oSection.title,
@@ -178,13 +220,96 @@ sap.ui.define([
                     });
                 }
             });
+
             if (oDefaultSection?.visualizations?.length > 0) {
-                // Add default section at the end
-                aFavorites.push(...oDefaultSection.visualizations);
+                // Add default section visualizations to the beginning
+                this.#processSmartBusinessVisualizations(oDefaultSection.visualizations);
+                aFavorites.splice(0, 0, ...oDefaultSection.visualizations);
             }
             oFavoritesModel.setProperty("/", aFavorites);
         }
 
+        /**
+         * Creates visualization instances for smart business visualizations and registers callbacks to update their titles.
+         *
+         * @param {Array} aVisualizations The array of visualizations to process.
+         *
+         * @since 1.136.0
+         * @private
+         */
+        #processSmartBusinessVisualizations (aVisualizations) {
+            // Process visualizations to extract relevant information
+            Container.getServiceAsync("VisualizationInstantiation").then((oVisualizationInstantiationService) => {
+                aVisualizations.forEach((oVisualization) => {
+                    if (oVisualization.vizType?.startsWith("X-SAP-UI2-CHIP:SSB")) {
+                        const oVizInstance = oVisualizationInstantiationService.instantiateVisualization(oVisualization);
+                        oVizInstance.setActive(true);
+                        oVizInstance.loaded().then(() => {
+                            const sTitle = this.#getGenericTileInstance(oVizInstance.getContent())?.getHeader();
+                            if (!oVisualization.title && sTitle) {
+                                const oModel = this.#oRootItem.getModel("favorites");
+                                const aFavorites = oModel.getProperty("/");
+                                for (let iSectionIndex = 0; iSectionIndex < aFavorites.length; iSectionIndex++) {
+                                    const oElement = aFavorites[iSectionIndex];
+
+                                    // Is in default section
+                                    if (oElement.id === oVisualization.id) {
+                                        oModel.setProperty(`/${iSectionIndex}/title`, sTitle);
+                                        oModel.setProperty(`/${iSectionIndex}/targetURL`, "");
+                                    }
+
+                                    // Is in section
+                                    if (Array.isArray(oElement.visualizations)) {
+                                        for (let iVizIndex = 0; iVizIndex < oElement.visualizations.length; iVizIndex++) {
+                                            const oVisualizationInSection = oElement.visualizations[iVizIndex];
+                                            if (oVisualizationInSection.id === oVisualization.id) {
+                                                oModel.setProperty(`/${iSectionIndex}/visualizations/${iVizIndex}/title`, sTitle);
+                                                oModel.setProperty(`/${iSectionIndex}/visualizations/${iVizIndex}/targetURL`, "");
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        });
+                        this.#oSmartBusinessVizInstances[oVisualization.id] = oVizInstance;
+                    }
+                });
+            });
+        }
+
+        /**
+         * Recursively retrieves the GenericTile instance from the given control.
+         *
+         * @param {sap.ui.core.Control} oVizInstanceRootControl The root control of the visualization instance.
+         * @returns {sap.m.GenericTile|null} The GenericTile instance if found, otherwise null.
+         * @since 1.136.0
+         * @private
+         */
+        #getGenericTileInstance (oVizInstanceRootControl) {
+            if (!oVizInstanceRootControl) {
+                return null;
+            }
+
+            if (oVizInstanceRootControl instanceof GenericTile) {
+                return oVizInstanceRootControl;
+            } else if (oVizInstanceRootControl instanceof ComponentContainer) {
+                oVizInstanceRootControl = oVizInstanceRootControl.getComponentInstance().getRootControl();
+            }
+
+            const oControlMetadata = oVizInstanceRootControl.getMetadata();
+            const oDefaultAggregationDefinition = oControlMetadata.getDefaultAggregation() || null;
+            const sDefaultAggregationName = oDefaultAggregationDefinition ? oDefaultAggregationDefinition?.name : "content";
+
+            const aAggregationData = sDefaultAggregationName ? oVizInstanceRootControl.getAggregation(sDefaultAggregationName) : null;
+            const oAggregationValue = Array.isArray(aAggregationData) ? aAggregationData[0] : aAggregationData;
+
+            if (!oAggregationValue) {
+                return null;
+            }
+
+            return this.#getGenericTileInstance(oAggregationValue);
+        }
+
         /**
          * Factory function for creating a navigation list item in the "Favorites" menu entry for the favorites model.
          *
@@ -196,10 +321,11 @@ sap.ui.define([
         #favoritesModelItemFactory (sId) {
             return new NavigationListItem(sId, {
                 key: "{favorites>id}",
-                text: "{= %{favorites>title} === '' ? %{i18n>SideNavigation.Item.Favorites.UntitledFolder} : %{favorites>title} }",
+                text: "{= !%{favorites>vizType} && %{favorites>title} === '' ? %{i18n>SideNavigation.Item.Favorites.UntitledFolder} : %{favorites>title} }",
                 enabled: "{viewConfiguration>/enableSideNavigation}",
                 expanded: "{favorites>expanded}",
-                icon: "{= %{favorites>visualizations} ? 'sap-icon://folder' : '' }",
+                icon: "{= !%{favorites>vizType} ? 'sap-icon://folder' : '' }",
+                href: "{favorites>targetURL}",
                 selectable: false,
                 items: {
                     path: "favorites>visualizations",

package/src/main/js/sap/ushell/components/shell/SideNavigation/modules/GenericNavigationListProvider.js

@@ -1,13 +1,9 @@
 // Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 sap.ui.define([
-    "sap/ui/model/json/JSONModel",
-    "sap/ui/model/Sorter",
     "sap/ushell/Config",
     "sap/tnt/NavigationList"
 ], function (
-    JSONModel,
-    Sorter,
     Config,
     NavigationList
 ) {
@@ -42,13 +38,28 @@ sap.ui.define([
      * }
      * </code>
      *
-     * @property {object} oSideNavAPI Holds the side navigation API object passed to the constructor.
-     * @property {sap.tnt.NavigationList} oRootItem The root navigation list item configured with fixed menu entries e.g. AppFinder.
-     *
      * @since 1.134.0
      * @private
      */
     class GenericNavigationListProvider {
+        /**
+         * The side navigation API object passed to the constructor.
+         * @type {object}
+         */
+        #oSideNavAPI;
+
+        /**
+         * The root navigation list.
+         * @type {sap.tnt.NavigationList}
+         */
+        #oRootItem;
+
+        /**
+         * Instance of the MyHome module.
+         * @type {object}
+         */
+        #oMyHome;
+
         /**
          * Creates a NavigationList for the item aggregation of the SideNavigation.
          *
@@ -58,14 +69,8 @@ sap.ui.define([
          * @private
          */
         constructor (oSideNavAPI) {
-            this.oSideNavAPI = oSideNavAPI;
-            this.oRootItem = new NavigationList({
-                items: {
-                    path: "/items",
-                    sorter: new Sorter({ path: "scale" }),
-                    factory: this.#sideNavigationFactory.bind(this)
-                }
-            });
+            this.#oSideNavAPI = oSideNavAPI;
+            this.#oRootItem = new NavigationList();
             this.#buildSideNavigation();
         }
 
@@ -73,20 +78,25 @@ sap.ui.define([
         * Asynchronously retrieves the root navigation item.
         *
         * @async
-        * @returns {Promise<sap.tnt.NavigationList>} A promise that resolves to NavigationList with all truned on in configuration menu items.
+        * @returns {Promise<sap.tnt.NavigationList>} A promise that resolves to NavigationList with the configuration menu items.
         * @since 1.134.0
         */
         async getRootItem () {
-            return this.oRootItem;
+            return this.#oRootItem;
         }
 
         /**
         * Asynchronously retrieves the selected item key from the spaces.
-        * @returns {Promise<string>} - A promise that resolves to the selected item key.
+        * @returns {Promise<string>} A promise that resolves to the selected item key.
         * @since 1.134.0
         */
         async findSelectedKey () {
-            return (await this.pSpaces).findSelectedKey();
+            let sSelectedKey;
+            sSelectedKey = await this.#oMyHome?.findSelectedKey();
+            if (!sSelectedKey) {
+                sSelectedKey = (await this.pSpaces).findSelectedKey();
+            }
+            return sSelectedKey;
         }
 
         /**
@@ -98,87 +108,56 @@ sap.ui.define([
         */
         #buildSideNavigation () {
             this.oChildItems = {};
-            const oSideNavigationItemModel = new JSONModel({
-                items: []
-            });
 
-            const fnAddItemToModel = (oItem) => {
-                const sPath = "/items";
-                const oModel = this.oRootItem.getModel();
-                const aItems = oModel.getObject(sPath);
-                aItems.push(oItem);
-                oModel.setProperty(sPath, aItems);
+            const fnAddItemsToAggregation = () => {
+                this.#oRootItem.addAggregation("items", this.oChildItems.myHome);
+                this.#oRootItem.addAggregation("items", this.oChildItems.recentActivity);
+                this.#oRootItem.addAggregation("items", this.oChildItems.favorites);
+                this.#oRootItem.addAggregation("items", this.oChildItems.spaces);
             };
 
             if (Config.last("/core/spaces/myHome/enabled")) {
                 sap.ui.require(["sap/ushell/components/shell/SideNavigation/modules/MyHome"], (MyHome) => {
-                    const oMyHome = new MyHome(this.oSideNavAPI);
-                    oMyHome.getRootItem().then((oItem) => {
+                    this.#oMyHome = new MyHome(this.#oSideNavAPI);
+                    this.#oMyHome.getRootItem().then((oItem) => {
                         this.oChildItems.myHome = oItem;
-                        fnAddItemToModel({ key: "myHome", scale: 1 });
+                        fnAddItemsToAggregation();
                     });
                 });
             }
 
-            if (this.oSideNavAPI.getConfigValue("recentActivity.enabled")) {
+            if (this.#oSideNavAPI.getConfigValue("recentActivity.enabled")) {
                 sap.ui.require(["sap/ushell/components/shell/SideNavigation/modules/RecentActivity"], (RecentActivity) => {
-                    const oRecentActivity = new RecentActivity(this.oSideNavAPI);
+                    const oRecentActivity = new RecentActivity(this.#oSideNavAPI);
                     oRecentActivity.getRootItem().then((oItem) => {
                         this.oChildItems.recentActivity = oItem;
-                        fnAddItemToModel({ key: "recentActivity", scale: 2 });
+                        fnAddItemsToAggregation();
                     });
                 });
             }
 
-            if (this.oSideNavAPI.getConfigValue("favorites.enabled")) {
+            if (this.#oSideNavAPI.getConfigValue("favorites.enabled")) {
                 sap.ui.require(["sap/ushell/components/shell/SideNavigation/modules/Favorites"], (Favorites) => {
-                    const oFavorites = new Favorites(this.oSideNavAPI);
+                    const oFavorites = new Favorites(this.#oSideNavAPI);
                     oFavorites.getRootItem().then((oItem) => {
                         this.oChildItems.favorites = oItem;
-                        fnAddItemToModel({ key: "favorites", scale: 3 });
+                        fnAddItemsToAggregation();
                     });
                 });
             }
 
             this.pSpaces = new Promise((resolve) => {
-                if (this.oSideNavAPI.getConfigValue("spaces.enabled")) {
+                if (this.#oSideNavAPI.getConfigValue("spaces.enabled")) {
                     sap.ui.require(["sap/ushell/components/shell/SideNavigation/modules/Spaces"], (Spaces) => {
-                        const oSpaces = new Spaces(this.oSideNavAPI);
+                        const oSpaces = new Spaces(this.#oSideNavAPI);
                         oSpaces.getRootItem().then((oItem) => {
                             this.oChildItems.spaces = oItem;
-                            fnAddItemToModel({key: "spaces", scale: 4});
+                            fnAddItemsToAggregation();
                         });
                         resolve(oSpaces);
                     });
                 }
             });
-
-            this.oRootItem.setModel(oSideNavigationItemModel);
-        }
-
-        /**
-        * Retrieves and clones a child navigation item by its identifier.
-        *
-        * @param {string} sId - The identifier of the child navigation item to retrieve.
-        * @returns {sap.tnt.NavigationListItem | sap.tnt.NavigationListGroup} A clone of the requested child navigation item.
-        * @private
-        * @since 1.134.0
-        */
-        #getChildItemById (sId) {
-            return this.oChildItems[sId].clone();
-        }
-
-        /**
-        * Factory function for creating side navigation list items.
-        *
-        * @param {string} _sId - The unique identifier for the side navigation list item.
-        * @param {object} oContext - The context object providing access to model data for item creation.
-        * @returns {sap.tnt.NavigationListItem | sap.tnt.NavigationListGroup} A cloned navigation list item based on the key from the context.
-        * @private
-        * @since 1.134.0
-        */
-        #sideNavigationFactory (_sId, oContext) {
-            return this.#getChildItemById(oContext.getProperty("key"));
         }
     }
 

package/src/main/js/sap/ushell/components/shell/SideNavigation/modules/MyHome.js

@@ -3,13 +3,17 @@
 sap.ui.define([
     "sap/tnt/NavigationListItem",
     "sap/ui/core/CustomData",
+    "sap/ui/thirdparty/hasher",
     "sap/ushell/Config",
-    "sap/ushell/components/shell/SideNavigation/modules/NavigationHelper"
+    "sap/ushell/components/shell/SideNavigation/modules/NavigationHelper",
+    "sap/ushell/utils/UrlParsing"
 ], function (
     NavigationListItem,
     CustomData,
+    hasher,
     Config,
-    NavigationHelper
+    NavigationHelper,
+    UrlParsing
 ) {
     "use strict";
 
@@ -34,6 +38,7 @@ sap.ui.define([
             this.oSideNavAPI = oSideNavAPI;
             this.oNavigationHelper = new NavigationHelper();
             this.oRootItem = new NavigationListItem({
+                key: "MyHome",
                 text: "{i18n>SideNavigation.Item.MyHome.Title}",
                 enabled: "{viewConfiguration>/enableSideNavigation}",
                 customData: [new CustomData({
@@ -41,7 +46,7 @@ sap.ui.define([
                     value: "MenuEntry-My-Home",
                     writeToDom: true
                 })],
-                href: Config.last("/core/shellHeader/homeUri"),
+                href: Config.last("/core/shellHeader/homeUri") || "#Shell-home",
                 icon: "sap-icon://home",
                 press: this.onMyHomeMenuSelected.bind(this)
             });
@@ -62,11 +67,24 @@ sap.ui.define([
         /**
         * Triggered whenever a user selects the MyHome menu entry
         *
-        * @since 1.134.0
+        * @since 1.135.0
         */
         onMyHomeMenuSelected () {
             this.oSideNavAPI.closeSideNavigation();
         }
+
+        /**
+        * Asynchronously retrieves the selected item key from the spaces.
+        * @returns {Promise<string>} A promise that resolves to the selected item key.
+        * @since 1.135.0
+        */
+        async findSelectedKey () {
+            const sHash = hasher.getHash();
+            const oHashParts = UrlParsing.parseShellHash(sHash);
+            if (oHashParts.semanticObject === "Shell" && oHashParts.action === "home") {
+                return (await this.getRootItem()).getKey();
+            }
+        }
     }
 
     return MyHome;

package/src/main/js/sap/ushell/components/shell/SideNavigation/modules/NavigationHelper.js

@@ -25,7 +25,7 @@ sap.ui.define([
         _performNavigation (oTarget) {
             return Container.getServiceAsync("Navigation").then(function (oNavigationService) {
                 const oParams = {};
-                oTarget.parameters.forEach(function (oParameter) {
+                oTarget.parameters?.forEach(function (oParameter) {
                     if (oParameter.name && oParameter.value) {
                         oParams[oParameter.name] = [oParameter.value];
                     }
@@ -34,7 +34,8 @@ sap.ui.define([
                 oNavigationService.navigate({
                     target: {
                         semanticObject: oTarget.semanticObject,
-                        action: oTarget.action
+                        action: oTarget.action,
+                        shellHash: oTarget.shellHash
                     },
                     params: oParams
                 });