@sapui5/sap.cux.home 1.141.0 → 1.142.1

package/src/sap/cux/home/TilesPanel.js

@@ -2,7 +2,7 @@
  * SAP UI development toolkit for HTML5 (SAPUI5)
  *  * (c) Copyright 2009-2025 SAP SE. All rights reserved
  */
-sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLayoutData", "sap/m/Button", "sap/m/CustomListItem", "sap/m/Dialog", "sap/m/GenericTile", "sap/m/HBox", "sap/m/HeaderContainer", "sap/m/IllustratedMessage", "sap/m/IllustratedMessageSize", "sap/m/IllustratedMessageType", "sap/m/Label", "sap/m/List", "sap/m/ObjectIdentifier", "sap/m/Title", "sap/m/VBox", "sap/m/library", "sap/ui/core/EventBus", "sap/ui/core/Icon", "sap/ui/core/Lib", "sap/ui/model/json/JSONModel", "sap/ushell/Config", "sap/ushell/Container", "sap/ushell/api/S4MyHome", "./BasePanel", "./MenuItem", "./utils/Accessibility", "./utils/AppManager", "./utils/Constants", "./utils/DataFormatUtils", "./utils/Device", "./utils/DragDropUtils", "./utils/FESRUtil", "./utils/InsightsUtils"], function (Log, GridContainer, GridContainerItemLayoutData, Button, CustomListItem, Dialog, GenericTile, HBox, HeaderContainer, IllustratedMessage, IllustratedMessageSize, IllustratedMessageType, Label, List, ObjectIdentifier, Title, VBox, sap_m_library, EventBus, Icon, Lib, JSONModel, Config, Container, S4MyHome, __BasePanel, __MenuItem, ___utils_Accessibility, __AppManager, ___utils_Constants, ___utils_DataFormatUtils, ___utils_Device, ___utils_DragDropUtils, ___utils_FESRUtil, ___utils_InsightsUtils) {
+sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLayoutData", "sap/m/Button", "sap/m/CustomListItem", "sap/m/Dialog", "sap/m/GenericTile", "sap/m/HBox", "sap/m/HeaderContainer", "sap/m/IllustratedMessage", "sap/m/IllustratedMessageSize", "sap/m/IllustratedMessageType", "sap/m/Label", "sap/m/List", "sap/m/ObjectIdentifier", "sap/m/Title", "sap/m/VBox", "sap/m/library", "sap/ui/core/EventBus", "sap/ui/core/Icon", "sap/ui/core/Lib", "sap/ui/model/json/JSONModel", "sap/ushell/Config", "sap/ushell/Container", "sap/ushell/api/S4MyHome", "./BasePanel", "./ErrorPanel", "./MenuItem", "./utils/Accessibility", "./utils/AppManager", "./utils/Constants", "./utils/DataFormatUtils", "./utils/Device", "./utils/DragDropUtils", "./utils/FESRUtil", "./utils/InsightsUtils"], function (Log, GridContainer, GridContainerItemLayoutData, Button, CustomListItem, Dialog, GenericTile, HBox, HeaderContainer, IllustratedMessage, IllustratedMessageSize, IllustratedMessageType, Label, List, ObjectIdentifier, Title, VBox, sap_m_library, EventBus, Icon, Lib, JSONModel, Config, Container, S4MyHome, __BasePanel, __ErrorPanel, __MenuItem, ___utils_Accessibility, __AppManager, ___utils_Constants, ___utils_DataFormatUtils, ___utils_Device, ___utils_DragDropUtils, ___utils_FESRUtil, ___utils_InsightsUtils) {
   "use strict";
 
   function _interopRequireDefault(obj) {
@@ -33,6 +33,7 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
   }
   const LoadState = sap_m_library["LoadState"];
   const BasePanel = _interopRequireDefault(__BasePanel);
+  const ErrorPanel = _interopRequireDefault(__ErrorPanel);
   const MenuItem = _interopRequireDefault(__MenuItem);
   const checkPanelExists = ___utils_Accessibility["checkPanelExists"];
   const AppManager = _interopRequireDefault(__AppManager);
@@ -46,10 +47,11 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
   const fetchElementProperties = ___utils_Device["fetchElementProperties"];
   const focusDraggedItem = ___utils_DragDropUtils["focusDraggedItem"];
   const addFESRId = ___utils_FESRUtil["addFESRId"];
+  const addFESRNavigationSource = ___utils_FESRUtil["addFESRNavigationSource"];
   const addFESRSemanticStepName = ___utils_FESRUtil["addFESRSemanticStepName"];
   const FESR_EVENTS = ___utils_FESRUtil["FESR_EVENTS"];
-  const createShowMoreActionButton = ___utils_InsightsUtils["createShowMoreActionButton"];
-  const createShowMoreMenuItem = ___utils_InsightsUtils["createShowMoreMenuItem"];
+  const FESRNavigationSource = ___utils_FESRUtil["FESRNavigationSource"];
+  const getAssociatedFullScreenButton = ___utils_InsightsUtils["getAssociatedFullScreenButton"];
   const getAssociatedFullScreenMenuItem = ___utils_InsightsUtils["getAssociatedFullScreenMenuItem"];
   const sortMenuItems = ___utils_InsightsUtils["sortMenuItems"];
   var tilesMenuItems = /*#__PURE__*/function (tilesMenuItems) {
@@ -58,22 +60,20 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
     tilesMenuItems["EDIT_TILES"] = "tiles-editTiles";
     return tilesMenuItems;
   }(tilesMenuItems || {});
-  var tilesContainerMenuItems = /*#__PURE__*/function (tilesContainerMenuItems) {
-    tilesContainerMenuItems["REFRESH"] = "container-tiles-refresh";
-    tilesContainerMenuItems["ADD_APPS"] = "container-tiles-addSmartApps";
-    tilesContainerMenuItems["EDIT_TILES"] = "container-tiles-editTiles";
-    tilesContainerMenuItems["SHOW_MORE"] = "tilesContainerFullScreenMenuItem";
-    return tilesContainerMenuItems;
-  }(tilesContainerMenuItems || {});
   var tilesActionButtons = /*#__PURE__*/function (tilesActionButtons) {
     tilesActionButtons["ADD_TILES"] = "tiles-addTilesButton";
+    tilesActionButtons["SHOW_MORE"] = "fullScreen";
     return tilesActionButtons;
   }(tilesActionButtons || {});
-  var tilesContainerActionButtons = /*#__PURE__*/function (tilesContainerActionButtons) {
-    tilesContainerActionButtons["ADD_TILES"] = "container-tiles-addTilesButton";
-    tilesContainerActionButtons["SHOW_MORE"] = "tilesContanerFullScreenActionButton";
-    return tilesContainerActionButtons;
-  }(tilesContainerActionButtons || {});
+  var errorPanelMenuItems = /*#__PURE__*/function (errorPanelMenuItems) {
+    errorPanelMenuItems["ADD_APPS"] = "tiles-errorPanel-addSmartApps";
+    errorPanelMenuItems["EDIT_TILES"] = "tiles-errorPanel-editTiles";
+    return errorPanelMenuItems;
+  }(errorPanelMenuItems || {});
+  var errorPanelActionButtons = /*#__PURE__*/function (errorPanelActionButtons) {
+    errorPanelActionButtons["ADD_TILES"] = "tiles-errorPanel-addTilesButton";
+    return errorPanelActionButtons;
+  }(errorPanelActionButtons || {});
   var DisplayFormat = /*#__PURE__*/function (DisplayFormat) {
     DisplayFormat["Standard"] = "standard";
     DisplayFormat["StandardWide"] = "standardWide";
@@ -173,10 +173,9 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
      */
     constructor: function _constructor(id, settings) {
       BasePanel.prototype.constructor.call(this, id, settings);
-      this._insightsSectionTitle = this._i18nBundle.getText("insights");
+      this._insightsSectionTitle = this._i18nBundle.getText("insightsTiles");
       this._addFromFavDialogId = `${this.getId()}-addFromFavDialog`;
       this.aInsightsApps = [];
-      this._headerVisible = false;
     },
     /**
      * Initializes the Tiles Panel.
@@ -198,6 +197,7 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
       this._controlModel = new JSONModel(this._oData);
       this.appManagerInstance = AppManager.getInstance();
       this.setProperty("key", "tiles");
+      this.setProperty("title", this._i18nBundle.getText("insightsTiles"));
       this.setProperty("enableFullScreen", true);
       const refreshMenuItem = this._createRefreshMenuItem(tilesMenuItems.REFRESH, "tilesRefresh");
       const editTilesMenuItem = this._createEditTilesMenuItem(tilesMenuItems.EDIT_TILES, "manageTiles");
@@ -232,6 +232,11 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
 
       // Toggles the activity of tiles
       this._toggleTileActivity();
+      //Add error panel to the parent container 'TilesContainer'
+      const parentContainer = this._getTilesContainer();
+      parentContainer?.addContent(this._errorPanel);
+      //set its visibility to false initially
+      this._errorPanel?.setVisible(false);
     },
     /**
      * Toggles the activity of tiles on route change.
@@ -351,6 +356,7 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
             _this3._showPlaceHolders();
             if (checkPanelExists(container, appsConatinerlName, favAppPanelName)) {
               const addFromFavAppMenuItem = _this3._createAddFromFavMenuItem(tilesMenuItems.ADD_APPS, "smartAppsDialog");
+              addFromFavAppMenuItem.setVisible(_showAddApps());
               _this3.addAggregation("menuItems", addFromFavAppMenuItem);
               _this3._sortMenuItems(sortedMenuItems);
             }
@@ -360,6 +366,7 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
             });
           }, function (error) {
             _this3.fireHandleHidePanel();
+            _this3._addErrorPanel();
           });
         }, function (_wasThrown, _result) {
           _this3.fireEvent("loaded");
@@ -393,26 +400,52 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
     refreshData: function _refreshData(refreshTiles = false) {
       try {
         const _this4 = this;
-        const panelName = _this4.getMetadata().getName();
         return Promise.resolve(_this4.appManagerInstance.fetchInsightApps(true, _this4._insightsSectionTitle)).then(function (_this4$appManagerInst) {
           function _temp6() {
             _this4._clearPlaceHolders();
             _this4._controlModel.setProperty("/tiles", _this4.aInsightsApps);
             if (_this4.aInsightsApps?.length) {
+              _this4._errorPanel?.setVisible(false);
+              //loop through the contents of parent container of this panel i.e., TilesContainer
+              const parentContainer = _this4._getTilesContainer();
+              parentContainer?.getContent().forEach(content => {
+                if (content instanceof ErrorPanel) {
+                  //remove the error panel from the TilesContainer
+                  parentContainer.removeContent(content);
+                }
+              });
               _this4.fireHandleUnhidePanel();
               if (refreshTiles) {
                 const isMobile = _this4.getDeviceType() === DeviceType.Mobile;
-                const container = isMobile ? _this4.tilesMobileContainer : _this4.tilesContainer;
+                const container = isMobile ? _this4.tilesMobileContainer : _this4.tilesDesktopContainer;
                 const sDefaultAggreName = container.getMetadata().getDefaultAggregationName();
                 const dynamicTiles = container.getAggregation(sDefaultAggreName) || [];
                 dynamicTiles.forEach(tiles => tiles.refresh?.());
               }
-              _this4._getInsightsContainer()?.updatePanelsItemCount(_this4.aInsightsApps.length, panelName);
-              if (_this4._headerVisible) {
-                _this4.setProperty("title", `${_this4._i18nBundle?.getText("insightsTiles")} (${_this4.aInsightsApps.length})`);
-              }
+              _this4.setProperty("title", `${_this4._i18nBundle?.getText("insightsTiles")} (${_this4.aInsightsApps.length})`);
+              //if the panel has been loaded and has tiles, update the visibility of header elements of the panel
+              _this4.getMenuItems().forEach(item => {
+                if (item.getId().includes(tilesMenuItems.REFRESH) || item.getId().includes(tilesMenuItems.EDIT_TILES) || item.getId().includes("showMore")) {
+                  item.setVisible(true);
+                }
+              });
             } else {
+              //if there are no tiles, hide the panel and show the error panel
+              _this4.setProperty("title", `${_this4._i18nBundle?.getText("insightsTiles")}`);
+              _this4.getMenuItems().forEach(item => {
+                if (item.getId().includes(tilesMenuItems.REFRESH) || item.getId().includes(tilesMenuItems.EDIT_TILES) || item.getId().includes("showMore")) {
+                  item.setVisible(false);
+                }
+              });
               _this4.fireHandleHidePanel();
+              _this4._addErrorPanel();
+              const layout = _this4._getTilesContainer()?._getLayout();
+              if (layout?.getProperty("expanded")) {
+                _this4.tilesContainer.addContent(_this4);
+                layout?.toggleFullScreen(_this4);
+                //remove the tiles panel from the tiles container
+                _this4.tilesContainer.removeContent(_this4);
+              }
             }
           }
           _this4.aInsightsApps = _this4$appManagerInst;
@@ -430,6 +463,69 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
         return Promise.reject(e);
       }
     },
+    /**
+     * Adds an error panel when there are no tiles available.
+     *
+     * @private
+     * @returns {void}
+     */
+    _addErrorPanel: function _addErrorPanel() {
+      const _this5 = this;
+      const parentContainer = this._getTilesContainer();
+      //set the visibility of tiles panel to false
+      this.setVisible(false);
+      if (!this._errorPanel) {
+        this._errorPanel = new ErrorPanel(`${this.getId()}-errorTilesPanel`, {
+          additionalData: [new Button(`${this.getId()}-addInsightsTilesBtn`, {
+            text: this._i18nBundle.getText("appFinderLink"),
+            type: "Emphasized",
+            press: function () {
+              try {
+                const container = _this5._getTilesContainer();
+                const _temp7 = function () {
+                  if (checkPanelExists(container, appsConatinerlName, favAppPanelName)) {
+                    // Favorite App Panel is visible, proceed as usual
+                    void _this5._handleAddFromFavApps();
+                  } else {
+                    // Favorite App Panel is NOT visible, navigate to App Finder
+                    return Promise.resolve(_this5.navigateToAppFinder()).then(function () {});
+                  }
+                }();
+                return Promise.resolve(_temp7 && _temp7.then ? _temp7.then(function () {}) : void 0);
+              } catch (e) {
+                return Promise.reject(e);
+              }
+            }
+          })],
+          messageTitle: this._i18nBundle.getText("noAppsTitle"),
+          messageDescription: this._i18nBundle.getText("noInsightsTileMsg")
+        });
+        this._errorPanel.getData();
+        //Add the menu items and action buttons to the error panel
+        const editTilesMenuItem = this._createEditTilesMenuItem(errorPanelMenuItems.EDIT_TILES, "manageTiles");
+        const addFromFavAppMenuItem = this._createAddFromFavMenuItem(errorPanelMenuItems.ADD_APPS, "smartAppsDialog");
+        this._errorPanel.setProperty("enableSettings", true);
+        addFromFavAppMenuItem.setVisible(_showAddApps());
+        const menuItems = [editTilesMenuItem, addFromFavAppMenuItem];
+        menuItems.forEach(menuItem => this._errorPanel.addAggregation("menuItems", menuItem));
+        this._sortMenuItems(sortedMenuItems);
+        const addTilesButton = this._createAddTilesButton(errorPanelActionButtons.ADD_TILES, "addTiles");
+        const actionButtons = [addTilesButton];
+        actionButtons.forEach(actionButton => this._errorPanel.addAggregation("actionButtons", actionButton));
+      }
+      //Add the title to the error panel
+      this._errorPanel.setTitle(this._i18nBundle.getText("insightsTiles"));
+
+      //Add error panel to the parent container 'TilesContainer'
+      parentContainer.addAggregation("content", this._errorPanel);
+      this._errorPanel.setVisible(true);
+
+      //set the visibility of header elements of the error panel
+      this._errorPanel.getMenuItems().forEach(item => {
+        const itemVisibility = item.getId().includes(errorPanelMenuItems.ADD_APPS) || item.getId().includes(errorPanelMenuItems.EDIT_TILES) || item.getId().includes("settings");
+        item.setVisible(itemVisibility);
+      });
+    },
     /**
      * Generates the wrapper for the tiles container, if it doesn't already exist
      *
@@ -464,7 +560,7 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
           scrollTime: 1000,
           showDividers: false,
           visible: "{/isPhone}"
-        }).addStyleClass("sectionMarginTopTilesInsight sapMHeaderContainerMarginBottom");
+        }).addStyleClass("sectionMarginTopTilesInsight sapMHeaderContainerMarginBottom sapCuxInsightsMobileCardsContainer");
 
         // Attach aggregation to the container
         this._attachAggregationToContainer(this.tilesMobileContainer);
@@ -478,17 +574,17 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
      * @returns {sap.m.GridContainer} The generated tiles wrapper.
      */
     _createWrapperFlexBox: function _createWrapperFlexBox() {
-      // Check if the tilesContainer already exists
-      if (!this.tilesContainer) {
+      // Check if the tilesDesktopContainer already exists
+      if (!this.tilesDesktopContainer) {
         // Create the GridContainer with required properties
-        this.tilesContainer = new GridContainer(`${this.getId()}-insightsTilesContainer`, {
+        this.tilesDesktopContainer = new GridContainer(`${this.getId()}-insightsTilesContainer`, {
           visible: "{= !${/isPhone}}"
-        }).addStyleClass("insightTiles sapUiSmallMarginTop sapUiSmallMarginBottom");
+        }).addStyleClass("insightTiles sapUiSmallMarginTop");
         // Attach aggregation to the container
-        this._attachAggregationToContainer(this.tilesContainer);
+        this._attachAggregationToContainer(this.tilesDesktopContainer);
       }
       // Return the existing or newly created container
-      return this.tilesContainer;
+      return this.tilesDesktopContainer;
     },
     /**
      * Updates the activation flags for Insights Tiles based on the device type and viewport.
@@ -509,15 +605,15 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
      * Attaches necessary aggregations and configurations to the provided container.
      *
      * @private
-     * @param {GridContainer | HeaderContainer} tilesContainer - The container to which the aggregation and events are to be attached.
+     * @param {GridContainer | HeaderContainer} tilesDesktopContainer - The container to which the aggregation and events are to be attached.
      * @returns {void}
      *
      */
-    _attachAggregationToContainer: function _attachAggregationToContainer(tilesContainer) {
-      tilesContainer.setModel(this._controlModel);
-      const sDefaultAggreName = tilesContainer.getMetadata().getDefaultAggregationName();
+    _attachAggregationToContainer: function _attachAggregationToContainer(tilesDesktopContainer) {
+      tilesDesktopContainer.setModel(this._controlModel);
+      const sDefaultAggreName = tilesDesktopContainer.getMetadata().getDefaultAggregationName();
       const isPhoneScreen = this.getDeviceType() === DeviceType.Mobile;
-      tilesContainer.bindAggregation(sDefaultAggreName, {
+      tilesDesktopContainer.bindAggregation(sDefaultAggreName, {
         path: "/tiles",
         factory: (id, context) => {
           const oApp = context.getObject();
@@ -529,12 +625,15 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
             minRows: 2,
             columns: oVisualization.getDisplayFormat?.() === DisplayFormat.Standard ? 2 : 4
           }));
+          oVisualization?.attachPress?.(() => {
+            addFESRNavigationSource(FESRNavigationSource.Tiles);
+          });
           oVisualization?.bindProperty?.("active", isPhoneScreen ? "/activateInsightsTilesOnPhone" : "/activateInsightsTilesOnDesktop");
           this._setDropAreaRectFunction(oVisualization);
           return oVisualization;
         }
       });
-      this.addDragDropConfigTo(tilesContainer, oEvent => this._handleTilesDnd(oEvent));
+      this.addDragDropConfigTo(tilesDesktopContainer, oEvent => this._handleTilesDnd(oEvent));
     },
     /**
      * Sets the drop area rectangle function for the given visualization.
@@ -595,15 +694,15 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
      */
     _DragnDropTiles: function _DragnDropTiles(iDragItemIndex, iDropItemIndex, sInsertPosition) {
       try {
-        const _this5 = this;
+        const _this6 = this;
         if (sInsertPosition === "Before" && iDragItemIndex < iDropItemIndex) {
           iDropItemIndex--;
         } else if (sInsertPosition === "After" && iDragItemIndex > iDropItemIndex) {
           iDropItemIndex++;
         }
-        const oDisplacedItem = _this5.aInsightsApps[iDropItemIndex],
-          oItemMoved = _this5.aInsightsApps.splice(iDragItemIndex, 1)[0];
-        _this5.aInsightsApps.splice(iDropItemIndex, 0, oItemMoved);
+        const oDisplacedItem = _this6.aInsightsApps[iDropItemIndex],
+          oItemMoved = _this6.aInsightsApps.splice(iDragItemIndex, 1)[0];
+        _this6.aInsightsApps.splice(iDropItemIndex, 0, oItemMoved);
         const moveConfigs = {
           pageId: MYHOME_PAGE_ID,
           sourceSectionIndex: oItemMoved.persConfig?.sectionIndex,
@@ -611,12 +710,12 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
           targetSectionIndex: oDisplacedItem.persConfig?.sectionIndex,
           targetVisualizationIndex: oDisplacedItem.persConfig?.visualizationIndex
         };
-        _this5._controlModel.setProperty("/tiles", _this5.aInsightsApps);
-        return Promise.resolve(_this5.appManagerInstance.moveVisualization(moveConfigs)).then(function () {
-          return Promise.resolve(_this5.refreshData(true)).then(function () {
+        _this6._controlModel.setProperty("/tiles", _this6.aInsightsApps);
+        return Promise.resolve(_this6.appManagerInstance.moveVisualization(moveConfigs)).then(function () {
+          return Promise.resolve(_this6.refreshData(true)).then(function () {
             // Ensures focus on tile after Panel refresh during DnD.
             setTimeout(() => {
-              focusDraggedItem(_this5.tilesContainer, iDropItemIndex);
+              focusDraggedItem(_this6.tilesDesktopContainer, iDropItemIndex);
             }, 0);
           });
         });
@@ -630,32 +729,14 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
      * @param {Event} event - The event object.
      */
     handleEditTiles: function _handleEditTiles(event) {
-      /* If called from Panel Header event.source() will return TilesPanel, if called from Insights Container event.source() will return InsightsContainer.
+      /* If called from Panel Header event.source() will return TilesPanel, if called from Insights Container event.source() will return TilesContainer.
       _getLayout is available at Container Level*/
       let parent = event.getSource().getParent() || this;
-      if (parent instanceof TilesPanel) {
+      if (parent instanceof TilesPanel || parent instanceof ErrorPanel) {
         parent = parent.getParent();
       }
       parent?._getLayout().openSettingsDialog(SETTINGS_PANELS_KEYS.INSIGHTS_TILES);
     },
-    /**
-     * Hides the header of the tiles panel.
-     * @private
-     */
-    handleHideHeader: function _handleHideHeader() {
-      this._headerVisible = false;
-      this.setProperty("title", "");
-      this._toggleHeaderActions(false);
-    },
-    /**
-     * Adds the header to the tiles panel.
-     * @private
-     */
-    handleAddHeader: function _handleAddHeader() {
-      this._headerVisible = true;
-      this.setProperty("title", `${this._i18nBundle?.getText("insightsTiles")} (${this.aInsightsApps.length})`);
-      this._toggleHeaderActions(true);
-    },
     /**
      * Closes the "Add from Favorites" dialog.
      *
@@ -682,7 +763,9 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
             target: {
               shellHash: `Shell-appfinder?&/catalog/${JSON.stringify(navigationObject)}`
             }
-          })).then(function () {});
+          })).then(function () {
+            addFESRNavigationSource(FESRNavigationSource.AppFinder);
+          });
         });
       } catch (e) {
         return Promise.reject(e);
@@ -704,11 +787,11 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
      */
     _handleAddFromFavApps: function _handleAddFromFavApps() {
       try {
-        const _this6 = this;
-        return Promise.resolve(_this6._getFavToAdd()).then(function (appsToAdd) {
-          const dialog = _this6._generateAddFromFavAppsDialog();
-          _this6._controlMap.get(`${_this6._addFromFavDialogId}-errorMessage`)?.setVisible(appsToAdd.length === 0);
-          _this6._generateAddFromFavAppsListItems(appsToAdd);
+        const _this7 = this;
+        return Promise.resolve(_this7._getFavToAdd()).then(function (appsToAdd) {
+          const dialog = _this7._generateAddFromFavAppsDialog();
+          _this7._controlMap.get(`${_this7._addFromFavDialogId}-errorMessage`)?.setVisible(appsToAdd.length === 0);
+          _this7._generateAddFromFavAppsListItems(appsToAdd);
           dialog.open();
         });
       } catch (e) {
@@ -724,13 +807,13 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
      */
     _getFavToAdd: function _getFavToAdd() {
       try {
-        const _this7 = this;
-        return Promise.resolve(_this7.appManagerInstance.fetchFavVizs(false, true)).then(function (aFavApps) {
+        const _this8 = this;
+        return Promise.resolve(_this8.appManagerInstance.fetchFavVizs(false, true)).then(function (aFavApps) {
           const aDynamicApps = aFavApps.filter(function (oDynApp) {
             return oDynApp.isCount || oDynApp.isSmartBusinessTile;
           });
           const aFilteredFavApps = aDynamicApps.filter(oDynApp => {
-            const iAppIndex = _this7.aInsightsApps.findIndex(function (oInsightApps) {
+            const iAppIndex = _this8.aInsightsApps.findIndex(function (oInsightApps) {
               return !oDynApp.visualization?.isBookmark && oInsightApps.visualization?.vizId === oDynApp.visualization?.vizId || oDynApp.visualization?.isBookmark && oInsightApps.visualization?.targetURL === oDynApp.visualization?.targetURL;
             });
             return iAppIndex === -1;
@@ -881,11 +964,11 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
      */
     _addFromFavApps: function _addFromFavApps() {
       try {
-        const _this8 = this;
-        const dialog = _this8._controlMap.get(_this8._addFromFavDialogId);
+        const _this9 = this;
+        const dialog = _this9._controlMap.get(_this9._addFromFavDialogId);
         dialog.setBusy(true);
-        const selectedItems = _this8._getSelectedInsights();
-        return Promise.resolve(_this8.appManagerInstance._getSections()).then(function (sections) {
+        const selectedItems = _this9._getSelectedInsights();
+        return Promise.resolve(_this9.appManagerInstance._getSections()).then(function (sections) {
           return Promise.resolve(selectedItems.reduce(function (promise, oApp) {
             return Promise.resolve(promise).then(function () {
               const app = oApp.data("app");
@@ -893,7 +976,7 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
                 pageId: MYHOME_PAGE_ID,
                 sourceSectionIndex: app.persConfig?.sectionIndex,
                 sourceVisualizationIndex: app.persConfig?.visualizationIndex,
-                targetSectionIndex: _this8.appManagerInstance.insightsSectionIndex,
+                targetSectionIndex: _this9.appManagerInstance.insightsSectionIndex,
                 targetVisualizationIndex: -1
               };
 
@@ -908,11 +991,11 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
                 if (recentAppSectionIndex === -1) {
                   oMovingConfig.sourceSectionIndex = 0;
                   oMovingConfig.sourceVisualizationIndex = 0;
-                  oMovingConfig.targetSectionIndex = _this8.appManagerInstance.insightsSectionIndex + 1;
+                  oMovingConfig.targetSectionIndex = _this9.appManagerInstance.insightsSectionIndex + 1;
                 } else {
                   oMovingConfig.sourceSectionIndex = recentAppSectionIndex;
                   oMovingConfig.sourceVisualizationIndex = sections[recentAppSectionIndex]?.visualizations?.length || 0;
-                  oMovingConfig.targetSectionIndex = _this8.appManagerInstance.insightsSectionIndex;
+                  oMovingConfig.targetSectionIndex = _this9.appManagerInstance.insightsSectionIndex;
                 }
               }
               if (app.visualization?.displayFormatHint !== "standard" && app.visualization?.displayFormatHint !== "standardWide") {
@@ -925,17 +1008,17 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
               if (!app.visualization?.vizId) {
                 app.visualization.vizId = app.visualization?.targetURL ?? "";
               }
-              const _temp7 = function () {
+              const _temp8 = function () {
                 if (app.visualization?.isBookmark === true) {
-                  return Promise.resolve(_this8.appManagerInstance.addBookMark(app.visualization, oMovingConfig)).then(function () {});
+                  return Promise.resolve(_this9.appManagerInstance.addBookMark(app.visualization, oMovingConfig)).then(function () {});
                 } else {
-                  return Promise.resolve(_this8.appManagerInstance.addVisualization(app.visualization?.vizId, MYINSIGHT_SECTION_ID)).then(function () {});
+                  return Promise.resolve(_this9.appManagerInstance.addVisualization(app.visualization?.vizId, MYINSIGHT_SECTION_ID)).then(function () {});
                 }
               }();
-              if (_temp7 && _temp7.then) return _temp7.then(function () {});
+              if (_temp8 && _temp8.then) return _temp8.then(function () {});
             });
           }, Promise.resolve())).then(function () {
-            return Promise.resolve(_this8.refreshData()).then(function () {
+            return Promise.resolve(_this9.refreshData()).then(function () {
               dialog.setBusy(false);
               dialog.close();
             });
@@ -953,7 +1036,7 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
      * @returns {number} - The number of visible tiles.
      */
     _calculateVisibleTileCount: function _calculateVisibleTileCount(insightsApps) {
-      const layout = this._getInsightsContainer()?._getLayout();
+      const layout = this._getTilesContainer()?._getLayout();
       const layoutDomRef = layout?.getDomRef();
       const apps = insightsApps || [];
       let count = 0;
@@ -976,7 +1059,7 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
       return count || 1;
     },
     _calculatePlaceholderTileCount: function _calculatePlaceholderTileCount() {
-      const layoutDomRef = this._getInsightsContainer()?._getLayout()?.getDomRef();
+      const layoutDomRef = this._getTilesContainer()?._getLayout()?.getDomRef();
       let count = 0;
       if (layoutDomRef) {
         const sectionDomRef = layoutDomRef.childNodes[0];
@@ -994,7 +1077,7 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
      * @override
      */
     _adjustLayout: function _adjustLayout() {
-      const layout = this._getInsightsContainer()?._getLayout();
+      const layout = this._getTilesContainer()?._getLayout();
       const isMobileDevice = this.getDeviceType() === DeviceType.Mobile;
       if (layout) {
         const visibleTileCount = isMobileDevice ? this.aInsightsApps?.length : this._calculateVisibleTileCount(this.aInsightsApps);
@@ -1004,73 +1087,28 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
         this._updateTilesActivity();
         //Show/Hide Full Screen Button if panel header is visible otherwise update visibility of container Full Screen Button
         const showFullScreenButton = isElementExpanded || this.aInsightsApps.length > visibleTileCount;
-        if (this._headerVisible) {
-          if (!isMobileDevice) {
-            this.getAggregation("actionButtons")?.forEach(actionButton => {
-              if (actionButton.getId().includes(tilesActionButtons.ADD_TILES)) {
-                this._getInsightsContainer().toggleActionButton(actionButton, true);
-              }
-            });
-          }
-          this._getInsightsContainer()?.toggleFullScreenElements(this, showFullScreenButton);
-        } else {
-          const fullScreenButton = getAssociatedFullScreenMenuItem(this);
-          const fullScreenText = fullScreenButton?.getTitle() ?? "";
-          this._getInsightsContainer()?.updateMenuItem(this._controlMap.get(`${this.getId()}-${tilesContainerMenuItems.SHOW_MORE}`), showFullScreenButton, fullScreenText);
-          this._getInsightsContainer()?.updateActionButton(this._controlMap.get(`${this.getId()}-${tilesContainerActionButtons.SHOW_MORE}`), showFullScreenButton, fullScreenText);
-        }
-      }
-    },
-    /**
-     * Retrieves the InsightsContainer instance associated with this TilesPanel.
-     *
-     * @private
-     * @returns {InsightsContainer} The InsightsContainer instance.
-     */
-    _getInsightsContainer: function _getInsightsContainer() {
-      if (!this.insightsContainer) {
-        this.insightsContainer = this.getParent();
-      }
-      return this.insightsContainer;
-    },
-    /**
-     * Retrieves the menu items for the container.
-     *
-     * @private
-     * @returns {MenuItem[]} An array of MenuItem instances.
-     */
-    getContainerMenuItems: function _getContainerMenuItems() {
-      if (!this._containerMenuItems) {
-        const containerRefresh = this._createRefreshMenuItem(tilesContainerMenuItems.REFRESH, "containerTilesRefresh");
-        const containerEditTiles = this._createEditTilesMenuItem(tilesContainerMenuItems.EDIT_TILES, "containerManageTiles");
-        const containerShowMore = createShowMoreMenuItem(this, tilesContainerMenuItems.SHOW_MORE, "containerTilesShowMore");
-        const container = this.getParent();
-        this._controlMap.set(`${this.getId()}-${tilesContainerMenuItems.SHOW_MORE}`, containerShowMore);
-        this._containerMenuItems = [containerRefresh, containerEditTiles, containerShowMore];
-        if (checkPanelExists(container, appsConatinerlName, favAppPanelName)) {
-          const containerAddFromFav = this._createAddFromFavMenuItem(tilesContainerMenuItems.ADD_APPS, "containerSmartAppsDialog");
-          this._containerMenuItems.splice(1, 0, containerAddFromFav);
-        }
+        const fullScreenButton = getAssociatedFullScreenMenuItem(this);
+        const fullScreenText = fullScreenButton?.getTitle() ?? "";
+
+        //update the panel menu-item show more button and show more action button in panel header
+        fullScreenButton?.setVisible(showFullScreenButton);
+        fullScreenButton?.setTitle(fullScreenText);
+        const fullScreenActionButton = getAssociatedFullScreenButton(this);
+        fullScreenActionButton?.setVisible(showFullScreenButton);
+        fullScreenActionButton?.setText(fullScreenText);
       }
-      return this._containerMenuItems;
     },
     /**
-     * Retrieves the action buttons for the container.
+     * Retrieves the TilesContainer instance associated with this TilesPanel.
      *
      * @private
-     * @returns {Button[]} An array of Button instances.
+     * @returns {TilesContainer} The TilesContainer instance.
      */
-    getContainerActionButtons: function _getContainerActionButtons() {
-      if (!this._containerActionButtons) {
-        this._containerActionButtons = [];
-        this._containerActionButtons.push(this._createAddTilesButton(tilesContainerActionButtons.ADD_TILES, "containerSmartAppsDialog"));
-        const containerFullScreenActionButton = createShowMoreActionButton(this, tilesContainerActionButtons.SHOW_MORE, "containerTilesShowMore");
-        if (containerFullScreenActionButton) {
-          this._controlMap.set(`${this.getId()}-${tilesContainerActionButtons.SHOW_MORE}`, containerFullScreenActionButton);
-          this._containerActionButtons.push(containerFullScreenActionButton);
-        }
+    _getTilesContainer: function _getTilesContainer() {
+      if (!this.tilesContainer) {
+        this.tilesContainer = this.getParent();
       }
-      return this._containerActionButtons;
+      return this.tilesContainer;
     },
     /**
      * Creates a refresh menu item.
@@ -1146,23 +1184,23 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
      * @returns {Button} The created Button instance.
      */
     _createAddTilesButton: function _createAddTilesButton(id, fesrId) {
-      const _this9 = this;
+      const _this0 = this;
       const actionButton = new Button(`${this.getId()}-${id}`, {
         text: this._i18nBundle.getText("appFinderLink"),
         tooltip: this._i18nBundle.getText("appFinderLink"),
         press: function () {
           try {
-            const container = _this9._getInsightsContainer();
-            const _temp8 = function () {
+            const container = _this0._getTilesContainer();
+            const _temp9 = function () {
               if (checkPanelExists(container, appsConatinerlName, favAppPanelName)) {
                 // Favorite App Panel is visible, proceed as usual
-                void _this9._handleAddFromFavApps();
+                void _this0._handleAddFromFavApps();
               } else {
                 // Favorite App Panel is NOT visible, navigate to App Finder
-                return Promise.resolve(_this9.navigateToAppFinder()).then(function () {});
+                return Promise.resolve(_this0.navigateToAppFinder()).then(function () {});
               }
             }();
-            return Promise.resolve(_temp8 && _temp8.then ? _temp8.then(function () {}) : void 0);
+            return Promise.resolve(_temp9 && _temp9.then ? _temp9.then(function () {}) : void 0);
           } catch (e) {
             return Promise.reject(e);
           }
@@ -1173,24 +1211,12 @@ sap.ui.define(["sap/base/Log", "sap/f/GridContainer", "sap/f/GridContainerItemLa
         addFESRId(actionButton, fesrId);
       }
       return actionButton;
-    },
-    /**
-     * Toggles the visibility of the header actions.
-     *
-     * @param {boolean} bShow - Whether to show or hide the header actions.
-     * @private
-     */
-    _toggleHeaderActions: function _toggleHeaderActions(bShow) {
-      this.getAggregation("menuItems")?.forEach(menuItem => {
-        this._getInsightsContainer()?.toggleMenuListItem(menuItem, bShow);
-      });
-      this.getAggregation("actionButtons")?.forEach(actionButton => this._getInsightsContainer()?.toggleActionButton(actionButton, bShow));
     }
   });
   TilesPanel.tilesMenuItems = tilesMenuItems;
-  TilesPanel.tilesContainerMenuItems = tilesContainerMenuItems;
   TilesPanel.tilesActionButtons = tilesActionButtons;
-  TilesPanel.tilesContainerActionButtons = tilesContainerActionButtons;
+  TilesPanel.errorPanelMenuItems = errorPanelMenuItems;
+  TilesPanel.errorPanelActionButtons = errorPanelActionButtons;
   TilesPanel.DisplayFormat = DisplayFormat;
   return TilesPanel;
 });