@sapui5/sap.ushell 1.129.1 → 1.130.1

package/src/main/js/sap/ushell/themes/base/library.source.less

@@ -9,7 +9,6 @@
 @import "AddBookmarkButton.less";
 @import "AnchorItem.less";
 @import "AnchorNavigationBar.less";
-@import "AppearanceView.less";
 @import "ApplicationContainer.less";
 @import "Catalog.less";
 @import "ContentFinder.less";

package/src/main/js/sap/ushell/themes/sap_belize_base/library.source.less

@@ -9,7 +9,6 @@
 @import "AddBookmarkButton.less";
 @import "AnchorItem.less";
 @import "AnchorNavigationBar.less";
-@import "AppearanceView.less";
 @import "ApplicationContainer.less";
 @import "Catalog.less";
 @import "ContentFinder.less";

package/src/main/js/sap/ushell/themes/sap_bluecrystal_base/library.source.less

@@ -9,7 +9,6 @@
 @import "AddBookmarkButton.less";
 @import "AnchorItem.less";
 @import "AnchorNavigationBar.less";
-@import "AppearanceView.less";
 @import "ApplicationContainer.less";
 @import "Catalog.less";
 @import "ContentFinder.less";

package/src/main/js/sap/ushell/themes/sap_hcb/library.source.less

@@ -17,7 +17,6 @@
 @import "base_AddBookmarkButton.less";
 @import "base_AnchorItem.less";
 @import "base_AnchorNavigationBar.less";
-@import "base_AppearanceView.less";
 @import "base_ApplicationContainer.less";
 @import "base_Catalog.less";
 @import "base_ContentFinder.less";

package/src/main/js/sap/ushell/ui/cards/RecentActivitiesExtension.js

@@ -3,7 +3,7 @@
 /**
  * @fileOverview Extension for recent activities card
  *
- * @version 1.129.1
+ * @version 1.130.1
  */
 sap.ui.define([
     "sap/ui/integration/Extension",

package/src/main/js/sap/ushell/ui/footerbar/AboutButton.js

@@ -4,11 +4,15 @@
 sap.ui.define([
     "sap/m/ButtonRenderer", // will load the renderer async
     "sap/ushell/resources",
-    "sap/ushell/ui/launchpad/ActionItem"
+    "sap/ushell/ui/launchpad/ActionItem",
+    "sap/ui/core/Fragment",
+    "sap/ushell/ui/footerbar/AboutDialog.controller"
 ], function (
     ButtonRenderer,
     resources,
-    ActionItem
+    ActionItem,
+    Fragment,
+    AboutDialogController
 ) {
     "use strict";
 
@@ -41,25 +45,17 @@ sap.ui.define([
     };
 
     AboutButton.prototype.showAboutDialog = function () {
-        return new Promise(function (resolve, reject) {
-            sap.ui.require([
-                "sap/ushell/ui/footerbar/AboutDialog.controller",
-                "sap/ui/core/Fragment"
-            ], function (
-                AboutDialogController,
-                Fragment
-            ) {
-                Fragment.load({
-                    id: "aboutDialogFragment",
-                    name: "sap.ushell.ui.footerbar.AboutDialog",
-                    type: "XML",
-                    controller: new AboutDialogController()
-                }).then(function (dialog) {
-                    dialog.setModel(resources.getTranslationModel(), "i18n");
-                    dialog.open();
-                    resolve();
-                }).catch(reject);
-            });
+        return new Promise((resolve, reject) => {
+            Fragment.load({
+                id: "aboutDialogFragment",
+                name: "sap.ushell.ui.footerbar.AboutDialog",
+                type: "XML",
+                controller: new AboutDialogController()
+            }).then(function (dialog) {
+                dialog.setModel(resources.getTranslationModel(), "i18n");
+                dialog.open();
+                resolve();
+            }).catch(reject);
         });
     };
 

package/src/main/js/sap/ushell/ui/footerbar/AboutDialog.controller.js

@@ -1,8 +1,11 @@
 // Copyright (c) 2009-2023 SAP SE, All Rights Reserved
 
 sap.ui.define([
+    "sap/m/Label",
+    "sap/m/Text",
     "sap/ui/core/mvc/Controller",
     "sap/ui/core/Fragment",
+    "sap/ui/core/Title",
     "sap/ui/model/json/JSONModel",
     "sap/ushell/services/AppConfiguration",
     "sap/ushell/Config",
@@ -12,8 +15,11 @@ sap.ui.define([
     "sap/ui/Device",
     "sap/ushell/Container"
 ], function (
+    Label,
+    Text,
     Controller,
     Fragment,
+    Title,
     JSONModel,
     AppConfiguration,
     Config,
@@ -33,10 +39,15 @@ sap.ui.define([
          */
         onBeforeOpen: function () {
             this._setupAboutDialogModel();
+            this._updateHeaderButtonVisibility();
+
+            // Set the first item in the list as selected
+            var oAboutDialogMasterList = Fragment.byId("aboutDialogFragment", "aboutDialogEntryList");
+            oAboutDialogMasterList.setSelectedItem(oAboutDialogMasterList.getItems()[0]);
         },
 
         /**
-         * Triggered when the About Dialog's "OK" button is pressed.
+         * Triggered when the About Dialog's "Cancel" button is pressed.
          * @since 1.89.0
          * @private
          */
@@ -71,55 +82,161 @@ sap.ui.define([
          * @private
          */
         _setupAboutDialogModel: function () {
+
+            var oAboutDialog = this._getDialog();
+
+            // application info
             this._setupAppInfoModel().catch(function (error) {
                 Log.error("Failed to setup application info model.", error);
             });
-
-            var oAboutDialog = this._getDialog(),
-                oSystemInformation = this._getSystemInformation(),
-                oUserEnvironmentInformation = this._getUserEnvironmentInformation(),
-                oSystemInformationModel = new JSONModel(oSystemInformation),
-                oUserEnvironmentModel = new JSONModel(oUserEnvironmentInformation);
+            // system information
+            var oSystemInformation = this._getSystemInformation();
+            var oSystemInformationModel = new JSONModel(oSystemInformation);
+            // user environment information
+            var oUserEnvironmentInformation = this._getUserEnvironmentInformation();
+            var oUserEnvironmentModel = new JSONModel(oUserEnvironmentInformation);
 
             oAboutDialog.setModel(oSystemInformationModel, "SysInfo");
             oAboutDialog.setModel(oUserEnvironmentModel, "UserEnvInfo");
         },
 
+        /**
+         * Retrieves the SplitApp object from the About Dialog fragment.
+         * @returns {sap.m.SplitApp} The SplitApp object.
+         * @since 1.130.0
+         * @private
+         */
+        _getSplitAppObj: function () {
+            var oResult = Fragment.byId("aboutDialogFragment", "aboutDialogContainer");
+            if (!oResult) {
+                Log.info("SplitContainer object can't be found");
+            }
+            return oResult;
+        },
+
+        /**
+         * Triggered after the master area of the SplitApp is closed.
+         * @since 1.130.0
+         * @private
+         */
+        onAfterMasterClose: function () {
+            this._getSplitAppObj().setMode("ShowHideMode");
+            this._updateHeaderButtonVisibility();
+        },
+
+        /**
+        * Triggered when an item in the master list is pressed.
+        * @param {sap.ui.base.Event} oEvent The event object.
+        * @since 1.130.0
+        * @private
+        */
+        onItemPress: function (oEvent) {
+            var sToPageId = oEvent.getParameter("listItem").getCustomData()[0].getValue();
+            var sToPageIdOnFragment = Fragment.createId("aboutDialogFragment", sToPageId);
+            this._getSplitAppObj().toDetail(sToPageIdOnFragment);
+            if (Device.system.desktop) {
+                this._getSplitAppObj().hideMaster();
+            }
+            if (Device.system.phone) {
+                this._getSplitAppObj().setMode("HideMode");
+                this.onAfterMasterClose();
+                this._updateHeaderButtonVisibility();
+            }
+        },
+
+        /**
+         * Navigates back to the master area of the SplitApp.
+         * @since 1.130.0
+         * @private
+         */
+        navigateBackToMaster: function () {
+            this._getSplitAppObj().backToTopMaster();
+            this._updateHeaderButtonVisibility();
+        },
+
+        /**
+         * Triggered before the master area of the SplitApp is opened.
+         * @since 1.130.0
+         * @private
+         */
+        onBeforeMasterOpen: function () {
+            this._updateHeaderButtonVisibility();
+        },
+
+        /**
+         * Triggered when the "Menu" button is pressed.
+         * @since 1.130.0
+         * @private
+         */
+        navToggleButtonPressHandler: function () {
+            if (this._getSplitAppObj().isMasterShown()) {
+                this._getSplitAppObj().hideMaster();
+            } else {
+                this._getSplitAppObj().showMaster();
+            }
+            this._updateHeaderButtonVisibility();
+        },
+
+        /**
+         * Updates the visibility of the header buttons.
+         * @since 1.130.0
+         * @private
+         */
+        _updateHeaderButtonVisibility: function () {
+            var bIsMasterShown = this._getSplitAppObj().isMasterShown();
+            var oBackButton = Fragment.byId("aboutDialogFragment", "aboutDialogNavBackButton");
+            var oMenuButton = Fragment.byId("aboutDialogFragment", "aboutDialogMenuButton");
+            if (Device.system.phone) {
+                oBackButton.setVisible(!bIsMasterShown);
+                if (!oBackButton) {
+                    Log.info("oBackButton object can't be found");
+                }
+            } else {
+                if (Device.orientation.portrait) {
+                    oMenuButton.setVisible(true);
+                    oMenuButton.setPressed(bIsMasterShown);
+                    oMenuButton.setTooltip(resources.i18n.getText(bIsMasterShown ? "ToggleButtonHide" : "ToggleButtonShow"));
+                } else {
+                    oMenuButton.setVisible(false);
+                }
+                if (!oMenuButton) {
+                    Log.info("oMenuButton object can't be found");
+                }
+            }
+        },
+
+        /**
+         * Sets up the application information model.
+         * @since 1.89.0
+         * @private
+         * @returns {Promise} A promise that resolves when the application information model is set up.
+         */
         _setupAppInfoModel: function () {
-            var aAppInfoParameters = [
-                    "appId",
-                    "appVersion",
-                    "appSupportInfo",
-                    "technicalAppComponentId",
-                    "appFrameworkId",
-                    "appFrameworkVersion",
-                    "appTitle",
-                    "title"
-                ],
-                oAboutDialog = this._getDialog();
+            var oAboutDialog = this._getDialog();
 
             return new Promise(function (resolve, reject) {
                 Container.getServiceAsync("AppLifeCycle")
                     .then(function (oAppLifeCycle) {
                         var oCurrentApplication = oAppLifeCycle.getCurrentApplication();
                         return Promise.all([
-                            oCurrentApplication.getInfo(aAppInfoParameters),
+                            oCurrentApplication.getAllAppInfo(true),
+                            oCurrentApplication.getAllAppInfo(false),
                             this._getContentProviderLabel(oCurrentApplication)
                         ]);
                     }.bind(this))
                     .then(function (aResults) {
-                        var oMetaData = AppConfiguration.getMetadata(),
-                            oInfo = aResults[0] || {},
-                            sProviderId = aResults[1];
+                        const oMetaData = AppConfiguration.getMetadata();
+                        const oAllAppInfoValues = aResults[0] || {};
+                        const oAllAppInfo = aResults[1] || {};
+                        const sProviderId = aResults[2];
 
-                        aAppInfoParameters = aAppInfoParameters.concat([
-                            "contentProviderLabel"
-                        ]);
-                        // 1. title from WebGUI/WDA (PostMessage API), 2. appTitle from cFLP, 3. title from metadata
-                        oInfo.appTitle = oInfo.title || oInfo.appTitle || oMetaData.title || "";
-                        oInfo.contentProviderLabel = sProviderId;
+                        // 1. title from WebGUI/WDA (PostMessage API)
+                        // 2. appTitle from cFLP
+                        // 3. title from metadata
+                        oAllAppInfoValues.appTitle = oAllAppInfoValues.title || oAllAppInfoValues.appTitle || oMetaData.title || "";
+                        oAllAppInfoValues.contentProviderLabel = sProviderId;
 
-                        var oApplicationInformation = this._buildApplicationInformationObject(aAppInfoParameters, oInfo);
+                        const oApplicationInformation = this._buildApplicationInformationObject(oAllAppInfoValues, oAllAppInfo);
                         oAboutDialog.setModel(new JSONModel(oApplicationInformation), "AppInfo");
                         resolve();
                     }.bind(this))
@@ -131,97 +248,219 @@ sap.ui.define([
 
         },
 
-        _buildApplicationInformationObject: function (appInfoParameters, parameterInfo) {
-            var oApplicationInformation = {},
-                sParameterName;
-            for (var i = 0; i < appInfoParameters.length; i++) {
-                sParameterName = appInfoParameters[i];
-                if (parameterInfo[sParameterName]) {
-                    oApplicationInformation[sParameterName] = {
-                        label: resources.i18n.getText(sParameterName),
-                        text: parameterInfo[sParameterName]
-                    };
+        _buildApplicationInformationObject: function (oParameterInfo, oParameterInfoExtended) {
+            const aSortOrder = [
+                "appTitle",
+                "appId",
+                "appVersion",
+                "appSupportInfo",
+                "technicalAppComponentId",
+                "appFrameworkId",
+                "appFrameworkVersion",
+                "contentProviderLabel"
+            ];
+            var oAppInfoModelData = {
+                entries: [],
+                customEntries: []
+            };
+
+            aSortOrder.forEach((sParameterName) => {
+                if (oParameterInfo[sParameterName]) {
+                    oAppInfoModelData.entries.push({
+                        parameterName: sParameterName,
+                        value: `{i18n>${sParameterName}}`,
+                        type: "label"
+                    });
+
+                    oAppInfoModelData.entries.push({
+                        parameterName: sParameterName,
+                        value: oParameterInfo[sParameterName],
+                        type: "text"
+                    });
                 }
-            }
+            });
+
+            // CustomProperties
+            const aCustomProperties = Object.keys(oParameterInfoExtended)
+                .filter((sParameter) => {
+                    const oParameter = oParameterInfoExtended[sParameter];
+                    return oParameter.showInAbout;
+                })
+                .sort((sParameter1, sParameter2) => {
+                    return sParameter1.toLowerCase() < sParameter2.toLowerCase() ? -1 : 1;
+                })
+                .map((sParameter) => {
+                    const oParameter = oParameterInfoExtended[sParameter];
+                    return {
+                        parameterName: sParameter,
+                        ...oParameter
+                    };
+                });
 
-            return oApplicationInformation;
+            aCustomProperties.forEach((oParameter) => {
+                oAppInfoModelData.customEntries.push({
+                    parameterName: oParameter.parameterName,
+                    value: oParameter.label,
+                    type: "label"
+                });
+
+                oAppInfoModelData.customEntries.push({
+                    parameterName: oParameter.parameterName,
+                    value: oParameter.value,
+                    type: "text"
+                });
+            });
+
+            return oAppInfoModelData;
         },
 
         _getSystemInformation: function () {
-            var oLogonSystem = Container.getLogonSystem(),
-                sProductName = oLogonSystem.getProductName(),
-                sProductVersion = oLogonSystem.getProductVersion(),
-                sSystemName = oLogonSystem.getSystemName(),
-                sSystemRole = oLogonSystem.getSystemRole(),
-                sTenantRole = oLogonSystem.getTenantRole(),
-                oSystemInformation = {};
+            const oLogonSystem = Container.getLogonSystem();
+            const oSysInfoModelData = {
+                entries: []
+            };
+
+            const sProductName = oLogonSystem.getProductName();
             if (sProductName) {
-                oSystemInformation.productName = {
-                    label: resources.i18n.getText("productName"),
-                    text: sProductName
-                };
+                oSysInfoModelData.entries.push({
+                    parameterName: "productName",
+                    value: "{i18n>productName}",
+                    type: "label"
+                });
+                oSysInfoModelData.entries.push({
+                    parameterName: "productName",
+                    value: sProductName,
+                    type: "text"
+                });
             }
+
+            const sProductVersion = oLogonSystem.getProductVersion();
             if (sProductVersion) {
-                oSystemInformation.productVersion = {
-                    label: resources.i18n.getText("productVersionFld"),
-                    text: sProductVersion
-                };
+                oSysInfoModelData.entries.push({
+                    parameterName: "productVersion",
+                    value: "{i18n>productVersionFld}",
+                    type: "label"
+                });
+                oSysInfoModelData.entries.push({
+                    parameterName: "productVersion",
+                    value: sProductVersion,
+                    type: "text"
+                });
             }
+
+            const sSystemName = oLogonSystem.getSystemName();
             if (sSystemName) {
-                oSystemInformation.systemName = {
-                    label: resources.i18n.getText("systemName"),
-                    text: sSystemName
-                };
+                oSysInfoModelData.entries.push({
+                    parameterName: "systemName",
+                    value: "{i18n>systemName}",
+                    type: "label"
+                });
+                oSysInfoModelData.entries.push({
+                    parameterName: "systemName",
+                    value: sSystemName,
+                    type: "text"
+                });
             }
+
+            const sSystemRole = oLogonSystem.getSystemRole();
             if (sSystemRole) {
-                oSystemInformation.systemRole = {
-                    label: resources.i18n.getText("systemRole"),
-                    text: sSystemRole
-                };
+                oSysInfoModelData.entries.push({
+                    parameterName: "systemRole",
+                    value: "{i18n>systemRole}",
+                    type: "label"
+                });
+                oSysInfoModelData.entries.push({
+                    parameterName: "systemRole",
+                    value: sSystemRole,
+                    type: "text"
+                });
             }
+
+            const sTenantRole = oLogonSystem.getTenantRole();
             if (sTenantRole) {
-                oSystemInformation.tenantRole = {
-                    label: resources.i18n.getText("tenantRole"),
-                    text: sTenantRole
-                };
+                oSysInfoModelData.entries.push({
+                    parameterName: "tenantRole",
+                    value: "{i18n>tenantRole}",
+                    type: "label"
+                });
+                oSysInfoModelData.entries.push({
+                    parameterName: "tenantRole",
+                    value: sTenantRole,
+                    type: "text"
+                });
             }
 
-            return oSystemInformation;
+            return oSysInfoModelData;
         },
 
         _getUserEnvironmentInformation: function () {
-            var oUserEnvironmentInformation = {};
-
-            oUserEnvironmentInformation.userAgentFld = {
-                label: resources.i18n.getText("userAgentFld"),
-                text: navigator.userAgent
+            const oUser = Container.getUser();
+            const oUserEnvInfoModelData = {
+                entries: []
             };
-            var sDeviceType = this._getDeviceType(),
-                bTouchSupported = this._isTouchSupported(),
-                oUser = Container.getUser(),
-                sTheme = oUser.getTheme(),
-                bOptimizedForTouchInput = oUser.getContentDensity() === "cozy";
 
+            const sDeviceType = this._getDeviceType();
             if (sDeviceType) {
-                oUserEnvironmentInformation.deviceType = {
-                    label: resources.i18n.getText("deviceType"),
-                    text: sDeviceType
-                };
+                oUserEnvInfoModelData.entries.push({
+                    parameterName: "deviceType",
+                    value: "{i18n>deviceType}",
+                    type: "label"
+                });
+                oUserEnvInfoModelData.entries.push({
+                    parameterName: "deviceType",
+                    value: sDeviceType,
+                    type: "text"
+                });
             }
-            oUserEnvironmentInformation.touchSupported = {
-                label: resources.i18n.getText("touchSupported"),
-                text: bTouchSupported ? resources.i18n.getText("yes") : resources.i18n.getText("no")
-            };
-            oUserEnvironmentInformation.activeTheme = {
-                label: resources.i18n.getText("activeTheme"),
-                text: sTheme
-            };
-            oUserEnvironmentInformation.optimizedForTouch = {
-                label: resources.i18n.getText("AppearanceContentDensityLabel"),
-                text: bOptimizedForTouchInput ? resources.i18n.getText("yes") : resources.i18n.getText("no")
-            };
 
-            return oUserEnvironmentInformation;
+            const sTheme = oUser.getTheme();
+            oUserEnvInfoModelData.entries.push({
+                parameterName: "activeTheme",
+                value: "{i18n>activeTheme}",
+                type: "label"
+            });
+            oUserEnvInfoModelData.entries.push({
+                parameterName: "activeTheme",
+                value: sTheme,
+                type: "text"
+            });
+
+            const bOptimizedForTouchInput = oUser.getContentDensity() === "cozy";
+            oUserEnvInfoModelData.entries.push({
+                parameterName: "optimizedForTouch",
+                value: "{i18n>AppearanceContentDensityLabel}",
+                type: "label"
+            });
+            oUserEnvInfoModelData.entries.push({
+                parameterName: "optimizedForTouch",
+                value: bOptimizedForTouchInput ? "{i18n>yes}" : "{i18n>no}",
+                type: "text"
+            });
+
+            const bTouchSupported = this._isTouchSupported();
+            oUserEnvInfoModelData.entries.push({
+                parameterName: "touchSupported",
+                value: "{i18n>touchSupported}",
+                type: "label"
+            });
+            oUserEnvInfoModelData.entries.push({
+                parameterName: "touchSupported",
+                value: bTouchSupported ? "{i18n>yes}" : "{i18n>no}",
+                type: "text"
+            });
+
+            oUserEnvInfoModelData.entries.push({
+                parameterName: "userAgentFld",
+                value: "{i18n>userAgentFld}",
+                type: "label"
+            });
+            oUserEnvInfoModelData.entries.push({
+                parameterName: "userAgentFld",
+                value: navigator.userAgent,
+                type: "text"
+            });
+
+            return oUserEnvInfoModelData;
         },
 
         _getContentProviderLabel: function (oApplication) {
@@ -236,13 +475,13 @@ sap.ui.define([
         _getDeviceType: function () {
             var sDeviceType;
             if (Device.system.combi) {
-                sDeviceType = resources.i18n.getText("configuration.form_factor_combi");
+                sDeviceType = "{i18n>configuration.form_factor_combi}";
             } else if (Device.system.desktop) {
-                sDeviceType = resources.i18n.getText("configuration.form_factor_desktop");
+                sDeviceType = "{i18n>configuration.form_factor_desktop}";
             } else if (Device.system.tablet) {
-                sDeviceType = resources.i18n.getText("configuration.form_factor_tablet");
+                sDeviceType = "{i18n>configuration.form_factor_tablet}";
             } else if (Device.system.phone) {
-                sDeviceType = resources.i18n.getText("configuration.form_factor_phone");
+                sDeviceType = "{i18n>configuration.form_factor_phone}";
             }
             return sDeviceType;
         },
@@ -251,6 +490,25 @@ sap.ui.define([
             return Device.support.touch && (Device.system.tablet || Device.system.phone || Device.system.combi);
         },
 
+        itemFactory: function (id, context) {
+            const sType = context.getProperty("type");
+
+            switch (sType) {
+                case "label":
+                    return new Label({
+                        text: context.getProperty("value")
+                    });
+                case "title":
+                    return new Title({
+                        text: context.getProperty("value")
+                    });
+                default: // case "text"
+                    return new Text({
+                        text: context.getProperty("value")
+                    });
+            }
+        },
+
         /**
          * Formatter function to calculate the number of columns displayed in a form depending on the model content.
          * @param {object} modelData The object that stores the form's data.