@sap-ux/preview-middleware 0.16.58 → 0.16.60

package/dist/client/adp/utils.ts

@@ -1,5 +1,14 @@
 import MessageToast from 'sap/m/MessageToast';
+import Element from 'sap/ui/core/Element';
 import type FlexCommand from 'sap/ui/rta/command/FlexCommand';
+import type DTElement from 'sap/ui/dt/Element';
+import type ManagedObject from 'sap/ui/base/ManagedObject';
+import type ElementOverlay from 'sap/ui/dt/ElementOverlay';
+import Log from 'sap/base/Log';
+import FlexUtils from 'sap/ui/fl/Utils';
+
+import { getError } from '../utils/error';
+import { isLowerThanMinimalUi5Version, Ui5VersionInfo } from '../utils/version';
 
 export interface Deferred<T> {
     promise: Promise<T>;
@@ -63,3 +72,77 @@ export function notifyUser(message: string, duration: number = 5000) {
         duration
     });
 }
+
+/**
+ * Check if element is sync view
+ *
+ * @param element Design time Element
+ * @returns boolean if element is sync view or not
+ */
+function isSyncView(element: DTElement): boolean {
+    return element?.getMetadata()?.getName()?.includes('XMLView') && element?.oAsyncState === undefined;
+}
+
+/**
+ * Get Ids for all sync views
+ *
+ * @param ui5VersionInfo UI5 Version Information
+ *
+ * @returns array of Ids for application sync views
+ */
+export async function getAllSyncViewsIds(ui5VersionInfo: Ui5VersionInfo): Promise<string[]> {
+    const syncViewIds: string[] = [];
+    try {
+        if (isLowerThanMinimalUi5Version(ui5VersionInfo, { major: 1, minor: 120 })) {
+            const elements = Element.registry.filter(() => true) as DTElement[];
+            elements.forEach((ui5Element) => {
+                if (isSyncView(ui5Element)) {
+                    syncViewIds.push(ui5Element.getId());
+                }
+            });
+        } else {
+            const ElementRegistry = (await import('sap/ui/core/ElementRegistry')).default;
+            const elements = ElementRegistry.all() as Record<string, DTElement>;
+            Object.entries(elements).forEach(([key, ui5Element]) => {
+                if (isSyncView(ui5Element)) {
+                    syncViewIds.push(key);
+                }
+            });
+        }
+    } catch (error) {
+        Log.error('Could not get application sync views', getError(error));
+    }
+
+    return syncViewIds;
+}
+
+interface ControllerInfo {
+    controllerName: string;
+    viewId: string;
+}
+
+/**
+ * Gets controller name and view ID for the given UI5 control.
+ *
+ * @param control UI5 control.
+ * @returns The controller name and view ID.
+ */
+
+export function getControllerInfoForControl(control: ManagedObject): ControllerInfo {
+    const view = FlexUtils.getViewForControl(control);
+    const controllerName = view.getController().getMetadata().getName();
+    const viewId = view.getId();
+    return { controllerName, viewId };
+}
+
+/**
+ * Gets controller name and view ID for the given overlay control.
+ *
+ * @param overlayControl The overlay control.
+ * @returns The controller name and view ID.
+ */
+
+export function getControllerInfo(overlayControl: ElementOverlay): ControllerInfo {
+    const control = overlayControl.getElement();
+    return getControllerInfoForControl(control);
+}

package/dist/client/cpe/changes/service.js

@@ -153,8 +153,8 @@ sap.ui.define([
                     try {
                         if (typeof command.getCommands === 'function') {
                             const subCommands = command.getCommands();
-                            subCommands.forEach(command => {
-                                const pendingChange = this.prepareChangeType(command, inactiveCommandCount, i);
+                            subCommands.forEach(subCommand => {
+                                const pendingChange = this.prepareChangeType(subCommand, inactiveCommandCount, i);
                                 if (pendingChange) {
                                     activeChanges.push(pendingChange);
                                 }

package/dist/client/cpe/changes/service.ts

@@ -265,8 +265,8 @@ export class ChangeService {
                 try {
                     if (typeof command.getCommands === 'function') {
                         const subCommands = command.getCommands();
-                        subCommands.forEach((command) => {
-                            const pendingChange = this.prepareChangeType(command, inactiveCommandCount, i);
+                        subCommands.forEach((subCommand) => {
+                            const pendingChange = this.prepareChangeType(subCommand, inactiveCommandCount, i);
                             if (pendingChange) {
                                 activeChanges.push(pendingChange);
                             }

package/dist/client/cpe/control-data.js

@@ -27,7 +27,7 @@ sap.ui.define([
         const analyzedType = {
             primitiveType: 'any',
             ui5Type: null,
-            enumValues: null,
+            enumValues: undefined,
             isArray: false
         };
         const propertyType = property?.getType();
@@ -63,8 +63,8 @@ sap.ui.define([
                 analyzedType.primitiveType = name;
             }
             analyzedType.ui5Type = typeName;
-            if (analyzedType.primitiveType === 'enum') {
-                analyzedType.enumValues = sap.ui.require(analyzedType.ui5Type.split('.').join('/'));
+            if (analyzedType.primitiveType === 'enum' && typeof propertyDataType?.getEnumValues === 'function') {
+                analyzedType.enumValues = propertyDataType.getEnumValues();
             }
         }
         return analyzedType;

package/dist/client/cpe/control-data.ts

@@ -18,9 +18,7 @@ import { UI5ControlProperty } from './types';
 import DataType from 'sap/ui/base/DataType';
 
 type AnalyzedType = Pick<UI5ControlProperty, 'isArray' | 'primitiveType' | 'ui5Type' | 'enumValues'>;
-interface Name {
-    getName(): string;
-}
+
 /**
  * A property is disabled if it is an array or the type is 'any'
  * - since  we currently don't have a good editor for it Otherwise, it is enabled.
@@ -73,7 +71,7 @@ function analyzePropertyType(property: ManagedObjectMetadataProperties): Analyze
     const analyzedType: AnalyzedType = {
         primitiveType: 'any',
         ui5Type: null,
-        enumValues: null,
+        enumValues: undefined,
         isArray: false
     };
     const propertyType = property?.getType();
@@ -105,8 +103,11 @@ function analyzePropertyType(property: ManagedObjectMetadataProperties): Analyze
         if (propertyDataType && !(propertyDataType instanceof DataType)) {
             return analyzedType;
         }
+        // enum values are created differently and use DataType as prototype, which only has stubs for instance functions -> getName returns undefined
+        // array and base types also return undefined, but we have already handled those above
+        // https://github.com/SAP/openui5/blob/203ce22763a76e28b7a422f6c635a42480f733f1/src/sap.ui.core/src/sap/ui/base/DataType.js#L430
         // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-        const name = (Object.getPrototypeOf(propertyDataType) as Name).getName();
+        const name = (Object.getPrototypeOf(propertyDataType) as DataType).getName();
         if (!name) {
             analyzedType.primitiveType = 'enum';
         } else {
@@ -115,8 +116,8 @@ function analyzePropertyType(property: ManagedObjectMetadataProperties): Analyze
         analyzedType.ui5Type = typeName;
 
         // Determine base type for SAP types
-        if (analyzedType.primitiveType === 'enum') {
-            analyzedType.enumValues = sap.ui.require(analyzedType.ui5Type.split('.').join('/'));
+        if (analyzedType.primitiveType === 'enum' && typeof propertyDataType?.getEnumValues === 'function') {
+            analyzedType.enumValues = propertyDataType.getEnumValues();
         }
     }
 

package/dist/client/cpe/init.js

@@ -1,23 +1,24 @@
 'use strict';
 sap.ui.define([
+    'sap/base/Log',
     'open/ux/preview/client/thirdparty/@sap-ux-private/control-property-editor-common',
-    './outline/index',
+    './outline/service',
     './selection',
     './changes/service',
     './documentation',
-    'sap/base/Log',
     './logger',
     './ui5-utils',
     './connector-service',
     './rta-service',
-    '../utils/error'
-], function (___sap_ux_private_control_property_editor_common, ___outline_index, ___selection, ___changes_service, ___documentation, Log, ___logger, ___ui5_utils, ___connector_service, ___rta_service, ___utils_error) {
+    '../utils/error',
+    './quick-actions/quick-action-service'
+], function (Log, ___sap_ux_private_control_property_editor_common, ___outline_service, ___selection, ___changes_service, ___documentation, ___logger, ___ui5_utils, ___connector_service, ___rta_service, ___utils_error, ___quick_actions_quick_action_service) {
     'use strict';
     const startPostMessageCommunication = ___sap_ux_private_control_property_editor_common['startPostMessageCommunication'];
     const iconsLoaded = ___sap_ux_private_control_property_editor_common['iconsLoaded'];
     const enableTelemetry = ___sap_ux_private_control_property_editor_common['enableTelemetry'];
     const appLoaded = ___sap_ux_private_control_property_editor_common['appLoaded'];
-    const initOutline = ___outline_index['initOutline'];
+    const OutlineService = ___outline_service['OutlineService'];
     const SelectionService = ___selection['SelectionService'];
     const ChangeService = ___changes_service['ChangeService'];
     const loadDefaultLibraries = ___documentation['loadDefaultLibraries'];
@@ -26,7 +27,9 @@ sap.ui.define([
     const WorkspaceConnectorService = ___connector_service['WorkspaceConnectorService'];
     const RtaService = ___rta_service['RtaService'];
     const getError = ___utils_error['getError'];
+    const QuickActionService = ___quick_actions_quick_action_service['QuickActionService'];
     function init(rta) {
+        let registries = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
         Log.info('Initializing Control Property Editor');
         const flexSettings = rta.getFlexSettings();
         if (flexSettings.telemetry === true) {
@@ -40,11 +43,15 @@ sap.ui.define([
         const changesService = new ChangeService({ rta }, selectionService);
         const connectorService = new WorkspaceConnectorService();
         const rtaService = new RtaService(rta);
+        const outlineService = new OutlineService(rta);
+        const quickActionService = new QuickActionService(rta, outlineService, registries);
         const services = [
             selectionService,
             changesService,
             connectorService,
-            rtaService
+            outlineService,
+            rtaService,
+            quickActionService
         ];
         try {
             loadDefaultLibraries();
@@ -58,9 +65,8 @@ sap.ui.define([
                 }
             }, logger);
             for (const service of services) {
-                service.init(sendAction, subscribe);
+                service.init(sendAction, subscribe)?.catch(reason => Log.error('Service Initalization Failed: ', getError(reason)));
             }
-            initOutline(rta, sendAction).catch(error => Log.error('Error during initialization of Control Property Editor', getError(error)));
             const icons = getIcons();
             sendAction(iconsLoaded(icons));
             sendAction(appLoaded());

package/dist/client/cpe/init.ts

@@ -1,3 +1,6 @@
+import Log from 'sap/base/Log';
+import type RuntimeAuthoring from 'sap/ui/rta/RuntimeAuthoring';
+
 import type { ExternalAction } from '@sap-ux-private/control-property-editor-common';
 import {
     startPostMessageCommunication,
@@ -5,21 +8,24 @@ import {
     enableTelemetry,
     appLoaded
 } from '@sap-ux-private/control-property-editor-common';
-import type RuntimeAuthoring from 'sap/ui/rta/RuntimeAuthoring';
 
 import type { ActionHandler, Service } from './types';
-import { initOutline } from './outline/index';
+import { OutlineService } from './outline/service';
 import { SelectionService } from './selection';
 import { ChangeService } from './changes/service';
 import { loadDefaultLibraries } from './documentation';
-import Log from 'sap/base/Log';
 import { logger } from './logger';
 import { getIcons } from './ui5-utils';
 import { WorkspaceConnectorService } from './connector-service';
 import { RtaService } from './rta-service';
 import { getError } from '../utils/error';
+import { QuickActionService } from './quick-actions/quick-action-service';
+import type { QuickActionDefinitionRegistry } from './quick-actions/registry';
 
-export default function init(rta: RuntimeAuthoring): Promise<void> {
+export default function init(
+    rta: RuntimeAuthoring,
+    registries: QuickActionDefinitionRegistry<string>[] = []
+): Promise<void> {
     Log.info('Initializing Control Property Editor');
 
     // enable telemetry if requested
@@ -42,7 +48,17 @@ export default function init(rta: RuntimeAuthoring): Promise<void> {
     const changesService = new ChangeService({ rta }, selectionService);
     const connectorService = new WorkspaceConnectorService();
     const rtaService = new RtaService(rta);
-    const services: Service[] = [selectionService, changesService, connectorService, rtaService];
+    const outlineService = new OutlineService(rta);
+    const quickActionService = new QuickActionService(rta, outlineService, registries);
+    const services: Service[] = [
+        selectionService,
+        changesService,
+        connectorService,
+        outlineService,
+        rtaService,
+        quickActionService
+    ];
+
     try {
         loadDefaultLibraries();
         const { sendAction } = startPostMessageCommunication<ExternalAction>(
@@ -60,13 +76,11 @@ export default function init(rta: RuntimeAuthoring): Promise<void> {
         );
 
         for (const service of services) {
-            service.init(sendAction, subscribe);
+            service
+                .init(sendAction, subscribe)
+                ?.catch((reason) => Log.error('Service Initalization Failed: ', getError(reason)));
         }
-        // For initOutline to complete the RTA needs to already running (to access RTA provided services).
-        // That can only happen if the plugin initialization has completed.
-        initOutline(rta, sendAction).catch((error) =>
-            Log.error('Error during initialization of Control Property Editor', getError(error))
-        );
+
         const icons = getIcons();
 
         sendAction(iconsLoaded(icons));

package/dist/client/cpe/outline/{utils.js → editable.js}

@@ -1,12 +1,11 @@
 "use strict";
 
-sap.ui.define(["../control-data", "../utils", "sap/ui/dt/OverlayUtil", "sap/ui/dt/OverlayRegistry", "../ui5-utils", "sap/ui/core/Component", "../../utils/version"], function (___control_data, ___utils, OverlayUtil, OverlayRegistry, ___ui5_utils, Component, ____utils_version) {
+sap.ui.define(["../control-data", "../utils", "sap/ui/dt/OverlayUtil", "sap/ui/dt/OverlayRegistry", "../../utils/core"], function (___control_data, ___utils, OverlayUtil, OverlayRegistry, ____utils_core) {
   "use strict";
 
   const buildControlData = ___control_data["buildControlData"];
   const getRuntimeControl = ___utils["getRuntimeControl"];
-  const getComponent = ___ui5_utils["getComponent"];
-  const isLowerThanMinimalUi5Version = ____utils_version["isLowerThanMinimalUi5Version"];
+  const getComponent = ____utils_core["getComponent"];
   const isEditable = function () {
     let id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
     let editable = false;
@@ -31,36 +30,10 @@ sap.ui.define(["../control-data", "../utils", "sap/ui/dt/OverlayUtil", "sap/ui/d
     }
     return editable;
   };
-
-  /**
-   * Function that checks if control is reuse component
-   *
-   * @param controlId id control
-   * @param ui5VersionInfo UI5 version information
-   * @returns boolean if control is from reused component view
-   */
-  const isReuseComponent = (controlId, ui5VersionInfo) => {
-    if (isLowerThanMinimalUi5Version(ui5VersionInfo, {
-      major: 1,
-      minor: 115
-    })) {
-      return false;
-    }
-    const component = Component.getComponentById(controlId);
-    if (!component) {
-      return false;
-    }
-    const manifest = component.getManifest();
-    if (!manifest) {
-      return false;
-    }
-    return manifest['sap.app']?.type === 'component';
-  };
   var __exports = {
     __esModule: true
   };
   __exports.isEditable = isEditable;
-  __exports.isReuseComponent = isReuseComponent;
   return __exports;
 });
-//# sourceMappingURL=utils.js.map
+//# sourceMappingURL=editable.js.map

package/dist/client/cpe/outline/{utils.ts → editable.ts}

@@ -2,10 +2,7 @@ import { buildControlData } from '../control-data';
 import { getRuntimeControl } from '../utils';
 import OverlayUtil from 'sap/ui/dt/OverlayUtil';
 import OverlayRegistry from 'sap/ui/dt/OverlayRegistry';
-import { getComponent } from '../ui5-utils';
-import Component from 'sap/ui/core/Component';
-import { Manifest } from 'sap/ui/rta/RuntimeAuthoring';
-import { isLowerThanMinimalUi5Version, Ui5VersionInfo } from '../../utils/version';
+import { getComponent } from '../../utils/core';
 
 export const isEditable = (id = ''): boolean => {
     let editable = false;
@@ -30,28 +27,3 @@ export const isEditable = (id = ''): boolean => {
     }
     return editable;
 };
-
-/**
- * Function that checks if control is reuse component
- *
- * @param controlId id control
- * @param ui5VersionInfo UI5 version information
- * @returns boolean if control is from reused component view
- */
-export const isReuseComponent = (controlId: string, ui5VersionInfo: Ui5VersionInfo): boolean => {
-    if (isLowerThanMinimalUi5Version(ui5VersionInfo, { major: 1, minor: 115 })) {
-        return false;
-    }
-
-    const component = Component.getComponentById(controlId);
-    if (!component) {
-        return false;
-    }
-
-    const manifest = component.getManifest() as Manifest;
-    if (!manifest) {
-        return false;
-    }
-
-    return manifest['sap.app']?.type === 'component';
-};

package/dist/client/cpe/outline/nodes.js

@@ -1,11 +1,12 @@
 "use strict";
 
-sap.ui.define(["./utils", "../../utils/version"], function (___utils, ____utils_version) {
+sap.ui.define(["../../utils/version", "../../utils/core", "../utils", "./editable"], function (____utils_version, ____utils_core, ___utils, ___editable) {
   "use strict";
 
-  const isEditable = ___utils["isEditable"];
-  const isReuseComponent = ___utils["isReuseComponent"];
   const getUi5Version = ____utils_version["getUi5Version"];
+  const getControlById = ____utils_core["getControlById"];
+  const isReuseComponent = ___utils["isReuseComponent"];
+  const isEditable = ___editable["isEditable"];
   /**
    * Retrieves additional data for a given control ID.
    *
@@ -13,7 +14,7 @@ sap.ui.define(["./utils", "../../utils/version"], function (___utils, ____utils_
    * @returns An object containing the text and the technical name of the control.
    */
   function getAdditionalData(id) {
-    const control = sap.ui.getCore().byId(id);
+    const control = getControlById(id);
     if (!control) {
       return {};
     }
@@ -64,6 +65,20 @@ sap.ui.define(["./utils", "../../utils/version"], function (___utils, ____utils_
       hasDefaultContent: false
     });
   }
+  /**
+   * Creates conrol index for all controls in the app.
+   *
+   * @param {ControlTreeIndex} controlIndex - Control index for the ui5 app.
+   * @param {OutlineNode} node - control node added to the outline.
+   */
+  function indexNode(controlIndex, node) {
+    const indexedControls = controlIndex[node.controlType];
+    if (indexedControls) {
+      indexedControls.push(node);
+    } else {
+      controlIndex[node.controlType] = [node];
+    }
+  }
 
   /**
    * Transform node.
@@ -71,9 +86,10 @@ sap.ui.define(["./utils", "../../utils/version"], function (___utils, ____utils_
    * @param input outline view node
    * @param scenario type of project
    * @param reuseComponentsIds ids of reuse components that are filled when outline nodes are transformed
-   * @returns {Promise<OutlineNode[]>} transformed outline tree nodes
+   * @param controlIndex Control tree index
+   * @returns transformed outline tree nodes
    */
-  async function transformNodes(input, scenario, reuseComponentsIds) {
+  async function transformNodes(input, scenario, reuseComponentsIds, controlIndex) {
     const stack = [...input];
     const items = [];
     const ui5VersionInfo = await getUi5Version();
@@ -88,7 +104,7 @@ sap.ui.define(["./utils", "../../utils/version"], function (___utils, ____utils_
           text
         } = getAdditionalData(current.id);
         const technicalName = current.technicalName.split('.').slice(-1)[0];
-        const transformedChildren = isAdp ? await handleDuplicateNodes(children, scenario, reuseComponentsIds) : await transformNodes(children, scenario, reuseComponentsIds);
+        const transformedChildren = isAdp ? await handleDuplicateNodes(children, scenario, reuseComponentsIds, controlIndex) : await transformNodes(children, scenario, reuseComponentsIds, controlIndex);
         const node = {
           controlId: current.id,
           controlType: current.technicalName,
@@ -97,6 +113,7 @@ sap.ui.define(["./utils", "../../utils/version"], function (___utils, ____utils_
           visible: current.visible ?? true,
           children: transformedChildren
         };
+        indexNode(controlIndex, node);
         fillReuseComponents(reuseComponentsIds, current, scenario, ui5VersionInfo);
         items.push(node);
       }
@@ -145,9 +162,10 @@ sap.ui.define(["./utils", "../../utils/version"], function (___utils, ____utils_
    * @param children outline view node children
    * @param scenario type of project
    * @param reuseComponentsIds ids of reuse components that are filled when outline nodes are transformed
+   * @param controlIndex Control tree index
    * @returns transformed outline tree nodes
    */
-  async function handleDuplicateNodes(children, scenario, reuseComponentsIds) {
+  async function handleDuplicateNodes(children, scenario, reuseComponentsIds, controlIndex) {
     const extPointIDs = new Set();
     children.forEach(child => {
       if (child.type === 'extensionPoint') {
@@ -159,7 +177,7 @@ sap.ui.define(["./utils", "../../utils/version"], function (___utils, ____utils_
       }
     });
     const uniqueChildren = children.filter(child => !extPointIDs.has(child.id));
-    return transformNodes(uniqueChildren, scenario, reuseComponentsIds);
+    return transformNodes(uniqueChildren, scenario, reuseComponentsIds, controlIndex);
   }
   var __exports = {
     __esModule: true

package/dist/client/cpe/outline/nodes.ts

@@ -1,8 +1,14 @@
 import type { OutlineNode } from '@sap-ux-private/control-property-editor-common';
 import type { OutlineViewNode } from 'sap/ui/rta/command/OutlineService';
 import type { Scenario } from 'sap/ui/fl/Scenario';
-import { isEditable, isReuseComponent } from './utils';
+
 import { getUi5Version, Ui5VersionInfo } from '../../utils/version';
+import { getControlById } from '../../utils/core';
+
+import type { ControlTreeIndex } from '../types';
+import { isReuseComponent } from '../utils';
+
+import { isEditable } from './editable';
 
 interface AdditionalData {
     text?: string;
@@ -16,7 +22,7 @@ interface AdditionalData {
  * @returns An object containing the text and the technical name of the control.
  */
 function getAdditionalData(id: string): AdditionalData {
-    const control = sap.ui.getCore().byId(id);
+    const control = getControlById(id);
     if (!control) {
         return {};
     }
@@ -71,6 +77,20 @@ function addChildToExtensionPoint(id: string, children: OutlineNode[]) {
         hasDefaultContent: false
     });
 }
+/**
+ * Creates conrol index for all controls in the app.
+ *
+ * @param {ControlTreeIndex} controlIndex - Control index for the ui5 app.
+ * @param {OutlineNode} node - control node added to the outline.
+ */
+function indexNode(controlIndex: ControlTreeIndex, node: OutlineNode): void {
+    const indexedControls = controlIndex[node.controlType];
+    if (indexedControls) {
+        indexedControls.push(node);
+    } else {
+        controlIndex[node.controlType] = [node];
+    }
+}
 
 /**
  * Transform node.
@@ -78,12 +98,14 @@ function addChildToExtensionPoint(id: string, children: OutlineNode[]) {
  * @param input outline view node
  * @param scenario type of project
  * @param reuseComponentsIds ids of reuse components that are filled when outline nodes are transformed
- * @returns {Promise<OutlineNode[]>} transformed outline tree nodes
+ * @param controlIndex Control tree index
+ * @returns transformed outline tree nodes
  */
 export async function transformNodes(
     input: OutlineViewNode[],
     scenario: Scenario,
-    reuseComponentsIds: Set<string>
+    reuseComponentsIds: Set<string>,
+    controlIndex: ControlTreeIndex
 ): Promise<OutlineNode[]> {
     const stack = [...input];
     const items: OutlineNode[] = [];
@@ -100,8 +122,8 @@ export async function transformNodes(
             const technicalName = current.technicalName.split('.').slice(-1)[0];
 
             const transformedChildren = isAdp
-                ? await handleDuplicateNodes(children, scenario, reuseComponentsIds)
-                : await transformNodes(children, scenario, reuseComponentsIds);
+                ? await handleDuplicateNodes(children, scenario, reuseComponentsIds, controlIndex)
+                : await transformNodes(children, scenario, reuseComponentsIds, controlIndex);
 
             const node: OutlineNode = {
                 controlId: current.id,
@@ -112,6 +134,7 @@ export async function transformNodes(
                 children: transformedChildren
             };
 
+            indexNode(controlIndex, node);
             fillReuseComponents(reuseComponentsIds, current, scenario, ui5VersionInfo);
 
             items.push(node);
@@ -167,12 +190,14 @@ function fillReuseComponents(
  * @param children outline view node children
  * @param scenario type of project
  * @param reuseComponentsIds ids of reuse components that are filled when outline nodes are transformed
+ * @param controlIndex Control tree index
  * @returns transformed outline tree nodes
  */
 export async function handleDuplicateNodes(
     children: OutlineViewNode[],
     scenario: Scenario,
-    reuseComponentsIds: Set<string>
+    reuseComponentsIds: Set<string>,
+    controlIndex: ControlTreeIndex
 ): Promise<OutlineNode[]> {
     const extPointIDs = new Set<string>();
 
@@ -185,5 +210,5 @@ export async function handleDuplicateNodes(
 
     const uniqueChildren = children.filter((child) => !extPointIDs.has(child.id));
 
-    return transformNodes(uniqueChildren, scenario, reuseComponentsIds);
+    return transformNodes(uniqueChildren, scenario, reuseComponentsIds, controlIndex);
 }