@sapui5/sap.ushell_abap 1.152.1 → 1.154.0

package/src/main/js/sap/ushell_abap/components/SideNavigation/modules/Favorites.js

@@ -0,0 +1,549 @@
+// Copyright (c) 2009-2026 SAP SE, All Rights Reserved
+
+sap.ui.define([
+    "sap/base/Log",
+    "sap/base/util/deepClone",
+    "sap/m/GenericTile",
+    "sap/m/ObjectStatus",
+    "sap/tnt/NavigationListGroup",
+    "sap/tnt/NavigationListItem",
+    "sap/ui/core/ComponentContainer",
+    "sap/ui/core/CustomData",
+    "sap/ui/core/library",
+    "sap/ui/model/Filter",
+    "sap/ui/model/FilterOperator",
+    "sap/ui/model/json/JSONModel",
+    "sap/ushell/Config",
+    "sap/ushell/Container",
+    "sap/ushell/components/shell/SideNavigation/modules/NavigationHelper",
+    "sap/ui/model/resource/ResourceModel",
+    "sap/base/i18n/Localization",
+    "sap/ushell_abap/utils/UserPersonalization"
+], (
+    Log,
+    deepClone,
+    GenericTile,
+    ObjectStatus,
+    NavigationListGroup,
+    NavigationListItem,
+    ComponentContainer,
+    CustomData,
+    coreLibrary,
+    Filter,
+    FilterOperator,
+    JSONModel,
+    Config,
+    Container,
+    NavigationHelper,
+    ResourceModel,
+    Localization,
+    UserPersonalization
+) => {
+    "use strict";
+
+    // shortcut for sap.ui.core.ValueState
+    const ValueState = coreLibrary.ValueState;
+
+    /**
+     * @typedef {object} VisualizationPosition
+     * @property {int} sectionIndex the position in the top-level favorites array.
+     * @property {int|undefined} vizIndex the position inside a folder's visualizations array, or
+     *   <code>undefined</code> when the visualization is a flat top-level item).
+     *
+     * @since 1.154
+     * @private
+     */
+
+    /**
+     * 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 passed to the constructor.
+         * @type {sap.ushell.modules.NavigationMenu.ListProviderAPI}
+         */
+        #oSideNavAPI;
+
+        /**
+         * 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;
+
+        /**
+         * Helper class for performing navigation actions.
+         * @type {NavigationHelper} Helper class for performing navigation actions.
+         */
+        #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 {Map<string, sap.ushell.ui.launchpad.VizInstance>}
+         */
+        #mVizInstances = new Map();
+
+        /**
+         * The promise that resolves with the resource bundle for the i18n texts.
+         * @type {sap.ui.model.resource.ResourceModel}
+         */
+        #oI18nModel;
+
+        /**
+         * The favorites JSON model.
+         * @type {sap.ui.model.json.JSONModel}
+         */
+        #oFavoritesModel;
+
+        /**
+         * Cleanup method
+         * @type {function|undefined}
+         */
+        #fnDetachModelHandlers;
+
+        /**
+         * Creates a new menu entry "Favorites" with the sections and apps from the MyHome page for the SideNavigation.
+         *
+         * @param {sap.ushell.modules.NavigationMenu.ListProviderAPI} oSideNavAPI The side navigation API object.
+         *
+         * @since 1.134.0
+         * @private
+         */
+        constructor (oSideNavAPI) {
+            this.#oI18nModel = new ResourceModel({
+                bundleUrl: sap.ui.require.toUrl("sap/ushell/components/shell/SideNavigation/resources/resources.properties"),
+                bundleLocale: Localization.getLanguage(),
+                async: true
+            });
+            this.#oSideNavAPI = oSideNavAPI;
+            this.#oRootItem = new NavigationListGroup({
+                text: "{i18n>SideNavigation.Item.Favorites.Title}",
+                enabled: "{viewConfiguration>/enableSideNavigation}",
+                items: {
+                    path: "favorites>/",
+                    key: "{favorites>id}",
+                    factory: this.#favoritesModelItemFactory.bind(this)
+                },
+                customData: [new CustomData({
+                    key: "help-id",
+                    value: "MenuEntry-Favorites",
+                    writeToDom: true
+                })]
+            });
+            this.#pItemReady = new Promise((resolve, reject) => {
+                this.#prepareModel(resolve, reject);
+            });
+
+            this.#NavigationHelper = new NavigationHelper();
+        }
+
+        /**
+         * Asynchronously retrieves the root navigation list item.
+         *
+         * @async
+         * @returns {Promise<sap.tnt.NavigationListGroup>} A promise that resolves to NavigationListGroup once the model is prepared and ready.
+         * @since 1.134.0
+         * @private
+         */
+        async getRootItem () {
+            return this.#pItemReady;
+        }
+
+        /**
+         * Triggered whenever a user selects a recent activity item.
+         *
+         * Closes the side navigation.
+         *
+         * @param {sap.ui.base.Event} oEvent The event object.
+         * @since 1.134.0
+         */
+        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 pVizInstance = this.#mVizInstances.get(oVisualization.id);
+            if (pVizInstance) {
+                // Is smart business visualization
+                const oVizInstance = await pVizInstance;
+                this.#getGenericTileInstance(oVizInstance.getContent())?.firePress();
+            } else if (oVisualization.targetURL && oVisualization.target?.type === "URL") {
+                this.#NavigationHelper.navigate({
+                    target: { url: oVisualization.targetURL },
+                    type: "URL"
+                });
+            } else if (oVisualization.targetURL && oVisualization.target?.semanticObject && oVisualization.target?.action) {
+                this.#NavigationHelper.navigate({
+                    target: { shellHash: oVisualization.targetURL },
+                    type: "IBN"
+                });
+            }
+            this.#oSideNavAPI.closeSideNavigation();
+        }
+
+        /**
+         * Prepares the model by fetching the pages service and setting the favorites model on the root item.
+         *
+         * @async
+         * @param {function} resolve The function to call if the operation is successful.
+         * @param {function} reject The function to call if the operation fails.
+         * @returns {Promise<undefined>} A promise that resolves when the model is prepared.
+         * @since 1.134.0
+         * @private
+         */
+        async #prepareModel (resolve, reject) {
+            const oPagesService = await Container.getServiceAsync("Pages");
+
+            const sMyHomePageId = Config.last("/core/spaces/myHome/myHomePageId");
+            if (!sMyHomePageId) {
+                reject(new Error("MyHome pageId is not defined"));
+                return;
+            }
+
+            const sHomePagePath = await oPagesService.loadPage(sMyHomePageId);
+            if (!sHomePagePath) {
+                reject(new Error("MyHome page not loaded"));
+                return;
+            }
+
+            const oPagesModel = oPagesService.getModel();
+            this.#oFavoritesModel = new JSONModel([]);
+
+            const fnBoundUpdateFavoritesModel = this.#updateFavoritesModel.bind(this, this.#oFavoritesModel, sMyHomePageId);
+
+            oPagesModel.attachEvent("dataChange", fnBoundUpdateFavoritesModel);
+            UserPersonalization.attachDisplayTransactionCodeChanged(fnBoundUpdateFavoritesModel);
+
+            this.#fnDetachModelHandlers = () => {
+                oPagesModel.detachEvent("dataChange", fnBoundUpdateFavoritesModel);
+                UserPersonalization.detachDisplayTransactionCodeChanged(fnBoundUpdateFavoritesModel);
+            };
+
+            this.#oRootItem.setModel(this.#oFavoritesModel, "favorites");
+            await this.#updateFavoritesModel(this.#oFavoritesModel, sMyHomePageId);
+            resolve(this.#oRootItem);
+        }
+
+        /**
+         * Updates the favorites model with the sections and apps from the MyHome page.
+         *
+         * @param {sap.ui.model.json.JSONModel} oFavoritesModel The favorites model.
+         * @param {string} sMyHomePageId The path to the MyHome page.
+         *
+         * @since 1.134.0
+         * @private
+         */
+        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;
+
+            const oCurrentFavorites = oFavoritesModel.getProperty("/");
+
+            const oExpandedList = oCurrentFavorites.reduce((oExpanded, oSection) => {
+                oExpanded[oSection.id] = oSection.expanded;
+                return oExpanded;
+            }, {});
+
+            aMyHomePageSections.forEach((oSection) => {
+                // Remember default section to add its visualizations to the beginning
+                if (oSection.default) {
+                    oDefaultSection = oSection;
+                    return;
+                }
+                // Add sections in existing order
+                const aVisualizations = deepClone(oSection.visualizations, 20);
+                if (aVisualizations.length > 0) {
+                    this.#processSmartBusinessVisualizations(aVisualizations);
+                    this.#calculateTags(aVisualizations);
+                    aFavorites.push({
+                        id: oSection.id,
+                        title: oSection.title,
+                        visualizations: aVisualizations,
+                        expanded: !!oExpandedList[oSection.id]
+                    });
+                }
+            });
+
+            // Add a button at the bottom of the "Favorites" menu entry to add new favorite apps using the App Finder
+            const sAddAppsText = (await this.#oI18nModel.getResourceBundle()).getText("SideNavigation.Item.Favorites.AddApps");
+            aFavorites.push({
+                id: "addAppsToFavoritesFolder",
+                title: sAddAppsText,
+                vizType: "sap.ushell.StaticAppLauncher",
+                target: {
+                    semanticObject: "Shell",
+                    action: "appfinder"
+                },
+                targetURL: "#Shell-appfinder"
+            });
+
+            if (oDefaultSection?.visualizations?.length > 0) {
+                // Add default section visualizations to the beginning
+                this.#processSmartBusinessVisualizations(oDefaultSection.visualizations);
+                this.#calculateTags(oDefaultSection.visualizations);
+                aFavorites.splice(0, 0, ...oDefaultSection.visualizations);
+            }
+            oFavoritesModel.setProperty("/", aFavorites);
+        }
+
+        /**
+         * Finds the position of a visualization within the favorites model.
+         *
+         * Returns the section index and, if the visualization is nested inside a folder,
+         * the visualization index within that folder. Returns <code>undefined</code> when
+         * the visualization is not found.
+         *
+         * @param {object} oVisualization The visualization to locate.
+         * @param {string} oVisualization.id The unique identifier of the visualization.
+         * @returns {VisualizationPosition|undefined} An object the position in the model or <code>undefined</code> if the visualization is not found.
+         *
+         * @since 1.154.0
+         * @private
+         */
+        #findVisualizationInModel (oVisualization) {
+            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) {
+                    return {
+                        sectionIndex: iSectionIndex,
+                        vizIndex: undefined
+                    };
+                }
+
+                // 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) {
+                            return {
+                                sectionIndex: iSectionIndex,
+                                vizIndex: iVizIndex
+                            };
+                        }
+                    }
+                }
+            }
+        }
+
+        /**
+         * Initiates async resolution of the transaction code tag for each ABAP visualization
+         * and writes the result back to the favorites model once resolved.
+         *
+         * Can handle simplified chip and real chips. Non-ABAP visualizations are skipped.
+         *
+         * @param {object[]} aVisualizations The visualization objects to process.
+         *
+         * @since 1.154.0
+         * @private
+         */
+        #calculateTags (aVisualizations) {
+            aVisualizations.forEach((oVisualization) => {
+                let pTag = Promise.resolve("");
+                let pVizInstance = this.#mVizInstances.get(oVisualization.id);
+                if (!pVizInstance) {
+                    pVizInstance = Container.getServiceAsync("VisualizationInstantiation").then(async (oVisualizationInstantiationService) => {
+                        const oVizInstance = oVisualizationInstantiationService.instantiateVisualization(oVisualization);
+                        oVizInstance.setActive(true);
+                        await oVizInstance.loaded();
+
+                        return oVizInstance;
+                    });
+
+                    this.#mVizInstances.set(oVisualization.id, pVizInstance);
+                }
+
+                pTag = pVizInstance.then(async (oVizInstance) => {
+                    if (oVizInstance.getTransactionCode) {
+                        return oVizInstance.getTransactionCode();
+                    }
+                    return UserPersonalization.formatTransactionCode("");
+                });
+
+                pTag.then((sTag) => {
+                    const oModel = this.#oRootItem.getModel("favorites");
+                    const oPosition = this.#findVisualizationInModel(oVisualization);
+                    if (!oPosition) {
+                        Log.error(`Could not update tag for Visualization '${oVisualization.id}' in Favorites SideNavigation Module: Missing visualization in model`);
+                    }
+                    // Is in default section
+                    if (typeof oPosition.sectionIndex === "number" && typeof oPosition.vizIndex !== "number") {
+                        oModel.setProperty(`/${oPosition.sectionIndex}/tag`, sTag);
+                    }
+
+                    // Is in section
+                    if (typeof oPosition.sectionIndex === "number" && typeof oPosition.vizIndex === "number") {
+                        oModel.setProperty(`/${oPosition.sectionIndex}/visualizations/${oPosition.vizIndex}/tag`, sTag);
+                    }
+                });
+            });
+        }
+
+        /**
+         * 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") && !this.#mVizInstances.has(oVisualization.id)) {
+                        const oDeferred = Promise.withResolvers();
+                        this.#mVizInstances.set(oVisualization.id, oDeferred.promise);
+                        const oVizInstance = oVisualizationInstantiationService.instantiateVisualization(oVisualization);
+                        oVizInstance.setActive(true);
+                        oVizInstance.loaded().then(() => {
+                            oDeferred.resolve(oVizInstance);
+                            const sTitle = this.#getGenericTileInstance(oVizInstance.getContent())?.getHeader();
+                            if (!oVisualization.title && sTitle) {
+                                const oModel = this.#oRootItem.getModel("favorites");
+                                const oPosition = this.#findVisualizationInModel(oVisualization);
+                                if (!oPosition) {
+                                    Log.error(`Could not update title and url for Visualization '${oVisualization.id}' in Favorites SideNavigation Module: Missing visualization in model`);
+                                }
+                                // Is in default section
+                                if (typeof oPosition.sectionIndex === "number" && typeof oPosition.vizIndex !== "number") {
+                                    oModel.setProperty(`/${oPosition.sectionIndex}/title`, sTitle);
+                                    oModel.setProperty(`/${oPosition.sectionIndex}/targetURL`, "");
+                                }
+
+                                // Is in section
+                                if (typeof oPosition.sectionIndex === "number" && typeof oPosition.vizIndex === "number") {
+                                    oModel.setProperty(`/${oPosition.sectionIndex}/visualizations/${oPosition.vizIndex}/title`, sTitle);
+                                    oModel.setProperty(`/${oPosition.sectionIndex}/visualizations/${oPosition.vizIndex}/targetURL`, "");
+                                }
+                            }
+                        });
+                    }
+                });
+            });
+        }
+
+        /**
+         * 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.
+         *
+         * @param {string} sId - The unique identifier for the navigation list item.
+         * @returns {sap.tnt.NavigationListItem} A new instance of NavigationListItem configured for the favorites model.
+         * @since 1.134.0
+         * @private
+         */
+        #favoritesModelItemFactory (sId) {
+            return new NavigationListItem(sId, {
+                key: "{favorites>id}",
+                text: "{= !%{favorites>vizType} && %{favorites>title} === '' ? %{i18n>SideNavigation.Item.Favorites.UntitledFolder} : %{favorites>title} }",
+                enabled: "{viewConfiguration>/enableSideNavigation}",
+                expanded: "{favorites>expanded}",
+                icon: "{= !%{favorites>vizType} ? 'sap-icon://folder' : '' }",
+                href: "{favorites>targetURL}",
+                selectable: false,
+                // Show transaction code on flat app items from the default section.
+                // Folders have no transaction code, so the tag stays hidden for them.
+                tag: new ObjectStatus({
+                    text: "{favorites>tag}",
+                    visible: "{= !!%{favorites>tag} }",
+                    state: ValueState.Indication10,
+                    inverted: true
+                }),
+                // There should be at least one visualization with a title to show the folder
+                visible: {
+                    path: "favorites>visualizations",
+                    formatter: (aVisualizations) => aVisualizations?.some((oItem) => !!oItem.title)
+                },
+                items: {
+                    path: "favorites>visualizations",
+                    template: new NavigationListItem({
+                        key: "{favorites>id}",
+                        text: "{favorites>title}",
+                        enabled: "{viewConfiguration>/enableSideNavigation}",
+                        href: "{favorites>targetURL}",
+                        selectable: false,
+                        tag: new ObjectStatus({
+                            text: "{favorites>tag}",
+                            visible: "{= !!%{favorites>tag} }",
+                            state: ValueState.Indication10,
+                            inverted: true
+                        }),
+                        press: this.onItemPressed.bind(this)
+                    }),
+                    filters: new Filter("title", FilterOperator.NE, "")
+                },
+                press: this.onItemPressed.bind(this)
+            });
+        }
+
+        /**
+         * Cleans up the instance.
+         *
+         * @since 1.144.0
+         * @private
+         */
+        async destroy () {
+            await this.pItemReady;
+
+            this.#oRootItem.destroy();
+            this.#oI18nModel.destroy();
+            this.#oFavoritesModel?.destroy();
+
+            this.#fnDetachModelHandlers?.();
+        }
+    }
+
+    return Favorites;
+}, false);