@sap-ux/preview-middleware 0.19.7 → 0.19.9

package/dist/client/adp/controllers/AddSubpage.controller.js

@@ -6,8 +6,9 @@ sap.ui.define([
     './BaseDialog.controller',
     'sap/ui/rta/command/CommandFactory',
     '../../cpe/communication-service',
-    'open/ux/preview/client/thirdparty/@sap-ux-private/control-property-editor-common'
-], function (JSONModel, ____i18n, __CommandExecutor, __BaseDialog, CommandFactory, ____cpe_communication_service, ___sap_ux_private_control_property_editor_common) {
+    'open/ux/preview/client/thirdparty/@sap-ux-private/control-property-editor-common',
+    '../quick-actions/fe-v4/utils'
+], function (JSONModel, ____i18n, __CommandExecutor, __BaseDialog, CommandFactory, ____cpe_communication_service, ___sap_ux_private_control_property_editor_common, ___quick_actions_fe_v4_utils) {
     'use strict';
     function _interopRequireDefault(obj) {
         return obj && obj.__esModule && typeof obj.default !== 'undefined' ? obj.default : obj;
@@ -17,6 +18,7 @@ sap.ui.define([
     const BaseDialog = _interopRequireDefault(__BaseDialog);
     const CommunicationService = ____cpe_communication_service['CommunicationService'];
     const setApplicationRequiresReload = ___sap_ux_private_control_property_editor_common['setApplicationRequiresReload'];
+    const generateRoutePattern = ___quick_actions_fe_v4_utils['generateRoutePattern'];
     const AddSubpage = BaseDialog.extend('open.ux.preview.client.adp.controllers.AddSubpage', {
         constructor: function _constructor(name, overlays, rta, options, telemetryData) {
             BaseDialog.prototype.constructor.call(this, name, telemetryData);
@@ -24,12 +26,8 @@ sap.ui.define([
             this.rta = rta;
             this.overlays = overlays;
             this.model = new JSONModel({
-                appType: options.appType,
-                appReference: options.appReference,
-                pageType: options.pageDescriptor.pageType,
                 title: options.title,
-                navigationData: options.pageDescriptor.navProperties,
-                currentEntitySet: options.pageDescriptor.entitySet
+                navigationData: options.navProperties
             });
             this.commandExecutor = new CommandExecutor(this.rta);
         },
@@ -57,43 +55,54 @@ sap.ui.define([
             const navProperty = this.model.getProperty('/selectedNavigation/key');
             const navigation = this.model.getProperty('/navigationData').find(item => item.navProperty = navProperty);
             const targetEntitySet = navigation?.entitySet ?? '';
-            const appType = this.model.getProperty('/appType');
-            const pageType = this.model.getProperty('/pageType');
-            const modifiedValue = appType === 'fe-v2' ? {
-                changeType: 'appdescr_ui_generic_app_addNewObjectPage',
-                reference: this.model.getProperty('/appReference'),
-                parameters: {
-                    parentPage: {
-                        component: pageType,
-                        entitySet: this.model.getProperty('/currentEntitySet')
-                    },
-                    childPage: {
-                        id: `ObjectPage|${ navProperty }`,
-                        definition: {
-                            entitySet: targetEntitySet,
-                            navigationProperty: navProperty
+            const pageDescriptor = this.options.pageDescriptor;
+            let modifiedValue;
+            if (pageDescriptor.appType === 'fe-v2') {
+                modifiedValue = {
+                    appComponent: pageDescriptor.appComponent,
+                    changeType: 'appdescr_ui_generic_app_addNewObjectPage',
+                    reference: this.options.appReference,
+                    parameters: {
+                        parentPage: {
+                            component: pageDescriptor.pageType,
+                            entitySet: pageDescriptor.entitySet
+                        },
+                        childPage: {
+                            id: `ObjectPage|${ navProperty }`,
+                            definition: {
+                                entitySet: targetEntitySet,
+                                navigationProperty: navProperty
+                            }
                         }
                     }
-                }
-            } : {
-                changeType: 'appdescr_fe_addNewPage',
-                parameters: {
-                    sourcePage: {
-                        id: this.runtimeControl.getId(),
-                        navigationSource: targetEntitySet
-                    },
-                    targetPage: {
-                        type: 'Component',
-                        id: `${ targetEntitySet }ObjectPage`,
-                        name: 'sap.fe.templates.ObjectPage',
-                        routePattern: `${ targetEntitySet }({key}):?query:`,
-                        settings: {
-                            contextPath: `/${ targetEntitySet }`,
-                            editableHeaderContent: false
+                };
+            } else {
+                const routePattern = generateRoutePattern(pageDescriptor.routePattern, navProperty, targetEntitySet);
+                modifiedValue = {
+                    appComponent: pageDescriptor.appComponent,
+                    changeType: 'appdescr_fe_addNewPage',
+                    reference: this.options.appReference,
+                    parameters: {
+                        sourcePage: {
+                            id: pageDescriptor.pageId,
+                            navigationSource: navProperty
+                        },
+                        targetPage: {
+                            type: 'Component',
+                            id: `${ targetEntitySet }ObjectPage`,
+                            name: 'sap.fe.templates.ObjectPage',
+                            routePattern,
+                            settings: {
+                                contextPath: `/${ targetEntitySet }`,
+                                editableHeaderContent: false,
+                                entitySet: targetEntitySet,
+                                pageLayout: '',
+                                controlConfiguration: {}
+                            }
                         }
                     }
-                }
-            };
+                };
+            }
             const command = await CommandFactory.getCommandFor(this.runtimeControl, 'appDescriptor', modifiedValue, null, flexSettings);
             await this.commandExecutor.pushAndExecuteCommand(command);
             CommunicationService.sendAction(setApplicationRequiresReload(true));

package/dist/client/adp/controllers/AddSubpage.controller.ts

@@ -15,6 +15,12 @@ import JSONModel from 'sap/ui/model/json/JSONModel';
 /** sap.ui.rta */
 import type RuntimeAuthoring from 'sap/ui/rta/RuntimeAuthoring';
 
+/** sap.fe.core */
+import type AppComponentV4 from 'sap/fe/core/AppComponent';
+
+/** sap.suite.ui.generic */
+import type AppComponentV2 from 'sap/suite/ui/generic/template/lib/AppComponent';
+
 import { getResourceModel } from '../../i18n';
 
 import CommandExecutor from '../command-executor';
@@ -22,35 +28,41 @@ import CommandExecutor from '../command-executor';
 import BaseDialog from './BaseDialog.controller';
 
 import CommandFactory from 'sap/ui/rta/command/CommandFactory';
-import { ApplicationType } from '../../utils/application';
 import { CommunicationService } from '../../cpe/communication-service';
 import { setApplicationRequiresReload } from '@sap-ux-private/control-property-editor-common';
+import { generateRoutePattern } from '../quick-actions/fe-v4/utils';
 import { QuickActionTelemetryData } from '../../cpe/quick-actions/quick-action-definition';
 
 type SubpageType = 'ObjectPage' | 'CustomPage';
 
+export interface PageDescriptorV2 {
+    appType: 'fe-v2';
+    appComponent: AppComponentV2;
+    entitySet: string;
+    pageType: string;
+}
+
+export interface PageDescriptorV4 {
+    appType: 'fe-v4';
+    appComponent: AppComponentV4;
+    pageId: string;
+    routePattern: string;
+}
+
+export interface AddSubpageOptions {
+    appReference: string;
+    title: string;
+    navProperties: { navProperty: string; entitySet: string }[];
+    pageDescriptor: PageDescriptorV2 | PageDescriptorV4;
+}
+
 export type AddSubpageModel = JSONModel & {
-    getProperty(sPath: '/appType'): ApplicationType;
-    getProperty(sPath: '/pageType'): string;
-    getProperty(sPath: '/appReference'): string;
-    getProperty(sPath: '/currentEntitySet'): string;
     getProperty(sPath: '/title'): string;
     getProperty(sPath: '/navigationData'): { navProperty: string; entitySet: string }[];
     getProperty(sPath: '/selectedPageType/key'): SubpageType;
     getProperty(sPath: '/selectedNavigation/key'): string;
 };
 
-export interface AddSubpageOptions {
-    appType: ApplicationType;
-    appReference: string;
-    title: string;
-    pageDescriptor: {
-        pageType: string;
-        entitySet: string;
-        navProperties: { navProperty: string; entitySet: string }[];
-    };
-}
-
 /**
  * @namespace open.ux.preview.client.adp.controllers
  */
@@ -66,12 +78,8 @@ export default class AddSubpage extends BaseDialog<AddSubpageModel> {
         this.rta = rta;
         this.overlays = overlays;
         this.model = new JSONModel({
-            appType: options.appType,
-            appReference: options.appReference,
-            pageType: options.pageDescriptor.pageType,
             title: options.title,
-            navigationData: options.pageDescriptor.navProperties,
-            currentEntitySet: options.pageDescriptor.entitySet
+            navigationData: options.navProperties
         });
         this.commandExecutor = new CommandExecutor(this.rta);
     }
@@ -119,47 +127,56 @@ export default class AddSubpage extends BaseDialog<AddSubpageModel> {
         const navProperty = this.model.getProperty('/selectedNavigation/key');
         const navigation = this.model.getProperty('/navigationData').find((item) => (item.navProperty = navProperty));
         const targetEntitySet = navigation?.entitySet ?? '';
-        const appType = this.model.getProperty('/appType');
-        const pageType = this.model.getProperty('/pageType');
-
-        const modifiedValue =
-            appType === 'fe-v2'
-                ? {
-                      changeType: 'appdescr_ui_generic_app_addNewObjectPage',
-                      reference: this.model.getProperty('/appReference'),
-                      parameters: {
-                          parentPage: {
-                              component: pageType,
-                              entitySet: this.model.getProperty('/currentEntitySet')
-                          },
-                          childPage: {
-                              id: `ObjectPage|${navProperty}`,
-                              definition: {
-                                  entitySet: targetEntitySet,
-                                  navigationProperty: navProperty
-                              }
-                          }
-                      }
-                  }
-                : {
-                      changeType: 'appdescr_fe_addNewPage',
-                      parameters: {
-                          sourcePage: {
-                              id: this.runtimeControl.getId(),
-                              navigationSource: targetEntitySet
-                          },
-                          targetPage: {
-                              type: 'Component',
-                              id: `${targetEntitySet}ObjectPage`,
-                              name: 'sap.fe.templates.ObjectPage',
-                              routePattern: `${targetEntitySet}({key}):?query:`,
-                              settings: {
-                                  contextPath: `/${targetEntitySet}`,
-                                  editableHeaderContent: false
-                              }
-                          }
-                      }
-                  };
+
+        const pageDescriptor = this.options.pageDescriptor;
+
+        let modifiedValue;
+        if (pageDescriptor.appType === 'fe-v2') {
+            modifiedValue = {
+                appComponent: pageDescriptor.appComponent,
+                changeType: 'appdescr_ui_generic_app_addNewObjectPage',
+                reference: this.options.appReference,
+                parameters: {
+                    parentPage: {
+                        component: pageDescriptor.pageType,
+                        entitySet: pageDescriptor.entitySet
+                    },
+                    childPage: {
+                        id: `ObjectPage|${navProperty}`,
+                        definition: {
+                            entitySet: targetEntitySet,
+                            navigationProperty: navProperty
+                        }
+                    }
+                }
+            };
+        } else {
+            const routePattern = generateRoutePattern(pageDescriptor.routePattern, navProperty, targetEntitySet);
+            modifiedValue = {
+                appComponent: pageDescriptor.appComponent,
+                changeType: 'appdescr_fe_addNewPage',
+                reference: this.options.appReference,
+                parameters: {
+                    sourcePage: {
+                        id: pageDescriptor.pageId,
+                        navigationSource: navProperty
+                    },
+                    targetPage: {
+                        type: 'Component',
+                        id: `${targetEntitySet}ObjectPage`,
+                        name: 'sap.fe.templates.ObjectPage',
+                        routePattern,
+                        settings: {
+                            contextPath: `/${targetEntitySet}`,
+                            editableHeaderContent: false,
+                            entitySet: targetEntitySet,
+                            pageLayout: '',
+                            controlConfiguration: {}
+                        }
+                    }
+                }
+            };
+        }
 
         const command = await CommandFactory.getCommandFor(
             this.runtimeControl,

package/dist/client/adp/init-dialogs.js

@@ -1,26 +1,27 @@
 "use strict";
 
-sap.ui.define(["sap/ui/rta/util/hasStableId", "sap/ui/fl/Utils", "../cpe/utils", "./dialog-factory"], function (hasStableId, FlUtils, ___cpe_utils, ___dialog_factory) {
+sap.ui.define(["sap/ui/rta/util/hasStableId", "sap/ui/fl/Utils", "./dialog-factory", "../i18n", "./utils"], function (hasStableId, FlUtils, ___dialog_factory, ___i18n, ___utils) {
   "use strict";
 
-  const isReuseComponent = ___cpe_utils["isReuseComponent"];
   const DialogFactory = ___dialog_factory["DialogFactory"];
   const DialogNames = ___dialog_factory["DialogNames"];
+  const getTextBundle = ___i18n["getTextBundle"];
+  const getReuseComponentChecker = ___utils["getReuseComponentChecker"];
   /**
    * Handler for enablement of Extend With Controller context menu entry
    *
    * @param control UI5 control.
    * @param syncViewsIds Runtime Authoring
-   * @param ui5VersionInfo UI5 version information
+   * @param isReuseComponent Function to check if the control is a reuse component.
    * @param isCloud Whether the application is running in the cloud
    *
    * @returns boolean whether menu item is enabled or not
    */
-  function isControllerExtensionEnabledForControl(control, syncViewsIds, ui5VersionInfo, isCloud) {
-    const clickedControlId = FlUtils.getViewForControl(control).getId();
-    const isControlInSyncView = syncViewsIds.includes(clickedControlId);
+  function isControllerExtensionEnabledForControl(control, syncViewsIds, isReuseComponent, isCloud) {
+    const viewId = FlUtils.getViewForControl(control).getId();
+    const isControlInSyncView = syncViewsIds.includes(viewId);
     if (isCloud) {
-      const isClickedControlReuseComponent = isReuseComponent(clickedControlId, ui5VersionInfo);
+      const isClickedControlReuseComponent = isReuseComponent(control.getId());
       return !isControlInSyncView && !isClickedControlReuseComponent;
     }
     return !isControlInSyncView;
@@ -31,44 +32,71 @@ sap.ui.define(["sap/ui/rta/util/hasStableId", "sap/ui/fl/Utils", "../cpe/utils",
    *
    * @param overlays Control overlays
    * @param syncViewsIds Runtime Authoring
-   * @param ui5VersionInfo UI5 version information
+   * @param isReuseComponent Function to check if the control is a reuse component.
    * @param isCloud Whether the application is running in the cloud
    *
    * @returns boolean whether menu item is enabled or not
    */
-  const isControllerExtensionEnabled = (overlays, syncViewsIds, ui5VersionInfo, isCloud) => {
+  const isControllerExtensionEnabled = (overlays, syncViewsIds, isReuseComponent, isCloud) => {
     if (overlays.length === 0 || overlays.length > 1) {
       return false;
     }
-    return isControllerExtensionEnabledForControl(overlays[0].getElement(), syncViewsIds, ui5VersionInfo, isCloud);
+    return isControllerExtensionEnabledForControl(overlays[0].getElement(), syncViewsIds, isReuseComponent, isCloud);
   };
 
   /**
    * Determines whether the fragment command should be enabled based on the provided overlays.
    *
    * @param {ElementOverlay[]} overlays - An array of ElementOverlay objects representing the UI overlays.
-   * @param ui5VersionInfo UI5 version information
+   * @param {isReuseComponentApi} isReuseComponent - Function to check if the control is a reuse component.
+   * @param {boolean} isCloud - Whether the application is running in the cloud.
    * @returns {boolean} True if the fragment command is enabled, false otherwise.
    */
-  const isFragmentCommandEnabled = (overlays, ui5VersionInfo) => {
+  const isFragmentCommandEnabled = (overlays, isReuseComponent, isCloud) => {
     if (overlays.length === 0 || overlays.length > 1) {
       return false;
     }
     const control = overlays[0].getElement();
-    return hasStableId(overlays[0]) && !isReuseComponent(control.getId(), ui5VersionInfo);
+    const stableId = hasStableId(overlays[0]);
+    if (isCloud) {
+      return stableId && !isReuseComponent(control.getId());
+    }
+    return stableId;
   };
 
   /**
    * Determines the text that should be displayed for the Add Fragment context menu item.
    *
    * @param {ElementOverlay} overlay - An ElementOverlay object representing the UI overlay.
+   * @param {isReuseComponentApi} isReuseComponentChecker - Function to check if the control is a reuse component.
+   * @param {boolean} isCloud - Whether the application is running in the cloud.
+   * @param {TextBundle} resources - The text bundle.
    * @returns {string} The text of the Add Fragment context menu item.
    */
-  const getAddFragmentItemText = overlay => {
+  const getAddFragmentItemText = (overlay, isReuseComponentChecker, isCloud, resources) => {
+    if (isCloud && isReuseComponentChecker(overlay.getElement().getId())) {
+      return resources.getText('ADP_ADD_FRAGMENT_MENU_ITEM_REUSE_COMPONENT');
+    }
     if (!hasStableId(overlay)) {
-      return 'Add: Fragment (Unavailable due to unstable ID of the control or its parent control)';
+      return resources.getText('ADP_ADD_FRAGMENT_MENU_ITEM_UNSTABLE_ID');
+    }
+    return resources.getText('ADP_ADD_FRAGMENT_MENU_ITEM');
+  };
+
+  /**
+   * Determines the text that should be displayed for Controller Extension context menu item.
+   *
+   * @param {ElementOverlay} overlay - An ElementOverlay object representing the UI overlay.
+   * @param {isReuseComponentApi} isReuseComponentChecker - Function to check if the control is a reuse component.
+   * @param {boolean} isCloud - Whether the application is running in the cloud.
+   * @param {TextBundle} resources - The text bundle.
+   * @returns {string} The text of the Add Fragment context menu item.
+   */
+  const getExtendControllerItemText = (overlay, isReuseComponentChecker, isCloud, resources) => {
+    if (isCloud && isReuseComponentChecker(overlay.getElement().getId())) {
+      return resources.getText('ADP_ADD_CONTROLLER_EXTENSION_MENU_ITEM_REUSE_COMPONENT');
     }
-    return 'Add: Fragment';
+    return resources.getText('ADP_ADD_CONTROLLER_EXTENSION_MENU_ITEM');
   };
 
   /**
@@ -78,22 +106,24 @@ sap.ui.define(["sap/ui/rta/util/hasStableId", "sap/ui/fl/Utils", "../cpe/utils",
    * @param syncViewsIds Ids of all application sync views
    * @param ui5VersionInfo UI5 version information
    */
-  const initDialogs = (rta, syncViewsIds, ui5VersionInfo) => {
+  const initDialogs = async (rta, syncViewsIds, ui5VersionInfo) => {
     const contextMenu = rta.getDefaultPlugins().contextMenu;
     const isCloud = rta.getFlexSettings().isCloud;
+    const resources = await getTextBundle();
+    const isReuseComponentChecker = await getReuseComponentChecker(ui5VersionInfo);
     contextMenu.addMenuItem({
       id: 'ADD_FRAGMENT',
-      text: getAddFragmentItemText,
+      text: overlay => getAddFragmentItemText(overlay, isReuseComponentChecker, isCloud, resources),
       handler: async overlays => await DialogFactory.createDialog(overlays[0], rta, DialogNames.ADD_FRAGMENT),
       icon: 'sap-icon://attachment-html',
-      enabled: overlays => isFragmentCommandEnabled(overlays, ui5VersionInfo)
+      enabled: overlays => isFragmentCommandEnabled(overlays, isReuseComponentChecker, isCloud)
     });
     contextMenu.addMenuItem({
       id: 'EXTEND_CONTROLLER',
-      text: 'Extend With Controller',
+      text: overlay => getExtendControllerItemText(overlay, isReuseComponentChecker, isCloud, resources),
       handler: async overlays => await DialogFactory.createDialog(overlays[0], rta, DialogNames.CONTROLLER_EXTENSION),
       icon: 'sap-icon://create-form',
-      enabled: overlays => isControllerExtensionEnabled(overlays, syncViewsIds, ui5VersionInfo, isCloud)
+      enabled: overlays => isControllerExtensionEnabled(overlays, syncViewsIds, isReuseComponentChecker, isCloud)
     });
   };
   var __exports = {
@@ -103,6 +133,7 @@ sap.ui.define(["sap/ui/rta/util/hasStableId", "sap/ui/fl/Utils", "../cpe/utils",
   __exports.isControllerExtensionEnabled = isControllerExtensionEnabled;
   __exports.isFragmentCommandEnabled = isFragmentCommandEnabled;
   __exports.getAddFragmentItemText = getAddFragmentItemText;
+  __exports.getExtendControllerItemText = getExtendControllerItemText;
   __exports.initDialogs = initDialogs;
   return __exports;
 });

package/dist/client/adp/init-dialogs.ts

@@ -12,16 +12,18 @@ import FlUtils from 'sap/ui/fl/Utils';
 import type ElementOverlay from 'sap/ui/dt/ElementOverlay';
 
 import ManagedObject from 'sap/ui/base/ManagedObject';
-import { isReuseComponent } from '../cpe/utils';
-import { Ui5VersionInfo } from '../utils/version';
 import { DialogFactory, DialogNames } from './dialog-factory';
+import type { IsReuseComponentApi } from '../cpe/types';
+import { getTextBundle, type TextBundle } from '../i18n';
+import { getReuseComponentChecker } from './utils';
+import type { Ui5VersionInfo } from '../utils/version';
 
 /**
  * Handler for enablement of Extend With Controller context menu entry
  *
  * @param control UI5 control.
  * @param syncViewsIds Runtime Authoring
- * @param ui5VersionInfo UI5 version information
+ * @param isReuseComponent Function to check if the control is a reuse component.
  * @param isCloud Whether the application is running in the cloud
  *
  * @returns boolean whether menu item is enabled or not
@@ -29,14 +31,14 @@ import { DialogFactory, DialogNames } from './dialog-factory';
 export function isControllerExtensionEnabledForControl(
     control: ManagedObject,
     syncViewsIds: string[],
-    ui5VersionInfo: Ui5VersionInfo,
+    isReuseComponent: IsReuseComponentApi,
     isCloud: boolean
 ): boolean {
-    const clickedControlId = FlUtils.getViewForControl(control).getId();
-    const isControlInSyncView = syncViewsIds.includes(clickedControlId);
+    const viewId = FlUtils.getViewForControl(control).getId();
+    const isControlInSyncView = syncViewsIds.includes(viewId);
 
     if(isCloud) {
-        const isClickedControlReuseComponent = isReuseComponent(clickedControlId, ui5VersionInfo);
+        const isClickedControlReuseComponent = isReuseComponent(control.getId());
         return !isControlInSyncView && !isClickedControlReuseComponent;
     }
     return !isControlInSyncView;
@@ -47,7 +49,7 @@ export function isControllerExtensionEnabledForControl(
  *
  * @param overlays Control overlays
  * @param syncViewsIds Runtime Authoring
- * @param ui5VersionInfo UI5 version information
+ * @param isReuseComponent Function to check if the control is a reuse component.
  * @param isCloud Whether the application is running in the cloud
  *
  * @returns boolean whether menu item is enabled or not
@@ -55,44 +57,72 @@ export function isControllerExtensionEnabledForControl(
 export const isControllerExtensionEnabled = (
     overlays: ElementOverlay[],
     syncViewsIds: string[],
-    ui5VersionInfo: Ui5VersionInfo,
+    isReuseComponent: IsReuseComponentApi,
     isCloud: boolean
 ): boolean => {
     if (overlays.length === 0 || overlays.length > 1) {
         return false;
     }
-    return isControllerExtensionEnabledForControl(overlays[0].getElement(), syncViewsIds, ui5VersionInfo, isCloud);
+    return isControllerExtensionEnabledForControl(overlays[0].getElement(), syncViewsIds, isReuseComponent, isCloud);
 };
 
 /**
  * Determines whether the fragment command should be enabled based on the provided overlays.
  *
  * @param {ElementOverlay[]} overlays - An array of ElementOverlay objects representing the UI overlays.
- * @param ui5VersionInfo UI5 version information
+ * @param {isReuseComponentApi} isReuseComponent - Function to check if the control is a reuse component.
+ * @param {boolean} isCloud - Whether the application is running in the cloud.
  * @returns {boolean} True if the fragment command is enabled, false otherwise.
  */
-export const isFragmentCommandEnabled = (overlays: ElementOverlay[], ui5VersionInfo: Ui5VersionInfo): boolean => {
+export const isFragmentCommandEnabled = (overlays: ElementOverlay[], isReuseComponent: IsReuseComponentApi, isCloud: boolean): boolean => {
     if (overlays.length === 0 || overlays.length > 1) {
         return false;
     }
 
     const control = overlays[0].getElement();
+    const stableId = hasStableId(overlays[0]);
+    if (isCloud) {
+        return stableId && !isReuseComponent(control.getId());
+    }
 
-    return hasStableId(overlays[0]) && !isReuseComponent(control.getId(), ui5VersionInfo);
+    return stableId;
 };
 
 /**
  * Determines the text that should be displayed for the Add Fragment context menu item.
  *
  * @param {ElementOverlay} overlay - An ElementOverlay object representing the UI overlay.
+ * @param {isReuseComponentApi} isReuseComponentChecker - Function to check if the control is a reuse component.
+ * @param {boolean} isCloud - Whether the application is running in the cloud.
+ * @param {TextBundle} resources - The text bundle.
  * @returns {string} The text of the Add Fragment context menu item.
  */
-export const getAddFragmentItemText = (overlay: ElementOverlay) => {
+export const getAddFragmentItemText = (overlay: ElementOverlay, isReuseComponentChecker: IsReuseComponentApi, isCloud: boolean, resources: TextBundle) => {
+    if (isCloud && isReuseComponentChecker(overlay.getElement().getId())) {
+        return resources.getText('ADP_ADD_FRAGMENT_MENU_ITEM_REUSE_COMPONENT');
+    }
     if (!hasStableId(overlay)) {
-        return 'Add: Fragment (Unavailable due to unstable ID of the control or its parent control)';
+        return resources.getText('ADP_ADD_FRAGMENT_MENU_ITEM_UNSTABLE_ID');
+    }
+
+    return resources.getText('ADP_ADD_FRAGMENT_MENU_ITEM');
+};
+
+/**
+ * Determines the text that should be displayed for Controller Extension context menu item.
+ *
+ * @param {ElementOverlay} overlay - An ElementOverlay object representing the UI overlay.
+ * @param {isReuseComponentApi} isReuseComponentChecker - Function to check if the control is a reuse component.
+ * @param {boolean} isCloud - Whether the application is running in the cloud.
+ * @param {TextBundle} resources - The text bundle.
+ * @returns {string} The text of the Add Fragment context menu item.
+ */
+export const getExtendControllerItemText = (overlay: ElementOverlay, isReuseComponentChecker: IsReuseComponentApi, isCloud: boolean, resources: TextBundle) => {
+    if (isCloud && isReuseComponentChecker(overlay.getElement().getId())) {
+        return resources.getText('ADP_ADD_CONTROLLER_EXTENSION_MENU_ITEM_REUSE_COMPONENT');
     }
 
-    return 'Add: Fragment';
+    return resources.getText('ADP_ADD_CONTROLLER_EXTENSION_MENU_ITEM');
 };
 
 /**
@@ -102,25 +132,27 @@ export const getAddFragmentItemText = (overlay: ElementOverlay) => {
  * @param syncViewsIds Ids of all application sync views
  * @param ui5VersionInfo UI5 version information
  */
-export const initDialogs = (rta: RuntimeAuthoring, syncViewsIds: string[], ui5VersionInfo: Ui5VersionInfo): void => {
+export const initDialogs = async (rta: RuntimeAuthoring, syncViewsIds: string[], ui5VersionInfo: Ui5VersionInfo): Promise<void> => {
     const contextMenu = rta.getDefaultPlugins().contextMenu;
     const isCloud = rta.getFlexSettings().isCloud;
+    const resources = await getTextBundle();
+    const isReuseComponentChecker = await getReuseComponentChecker(ui5VersionInfo);
 
     contextMenu.addMenuItem({
         id: 'ADD_FRAGMENT',
-        text: getAddFragmentItemText,
+        text: (overlay: ElementOverlay) => getAddFragmentItemText(overlay, isReuseComponentChecker, isCloud, resources),
         handler: async (overlays: UI5Element[]) =>
             await DialogFactory.createDialog(overlays[0], rta, DialogNames.ADD_FRAGMENT),
         icon: 'sap-icon://attachment-html',
-        enabled: (overlays: ElementOverlay[]) => isFragmentCommandEnabled(overlays, ui5VersionInfo)
+        enabled: (overlays: ElementOverlay[]) => isFragmentCommandEnabled(overlays, isReuseComponentChecker, isCloud)
     });
 
     contextMenu.addMenuItem({
         id: 'EXTEND_CONTROLLER',
-        text: 'Extend With Controller',
+        text: (overlay: ElementOverlay) => getExtendControllerItemText(overlay, isReuseComponentChecker, isCloud, resources),
         handler: async (overlays: UI5Element[]) =>
             await DialogFactory.createDialog(overlays[0], rta, DialogNames.CONTROLLER_EXTENSION),
         icon: 'sap-icon://create-form',
-        enabled: (overlays: ElementOverlay[]) => isControllerExtensionEnabled(overlays, syncViewsIds, ui5VersionInfo, isCloud)
+        enabled: (overlays: ElementOverlay[]) => isControllerExtensionEnabled(overlays, syncViewsIds, isReuseComponentChecker, isCloud)
     });
 };

package/dist/client/adp/init.js

@@ -47,7 +47,7 @@ sap.ui.define([
         }
         const ui5VersionInfo = await getUi5Version();
         const syncViewsIds = await getAllSyncViewsIds(ui5VersionInfo);
-        initDialogs(rta, syncViewsIds, ui5VersionInfo);
+        await initDialogs(rta, syncViewsIds, ui5VersionInfo);
         if (!isLowerThanMinimalUi5Version(ui5VersionInfo, {
                 major: 1,
                 minor: 78

package/dist/client/adp/init.ts

@@ -22,7 +22,8 @@ export default async function (rta: RuntimeAuthoring) {
 
     const ui5VersionInfo = await getUi5Version();
     const syncViewsIds = await getAllSyncViewsIds(ui5VersionInfo);
-    initDialogs(rta, syncViewsIds, ui5VersionInfo);
+
+    await initDialogs(rta, syncViewsIds, ui5VersionInfo);
 
     if (!isLowerThanMinimalUi5Version(ui5VersionInfo, { major: 1, minor: 78 })) {
         const ExtensionPointService = (await import('open/ux/preview/client/adp/extension-point')).default;