@sap-ux/preview-middleware 0.13.42 → 0.13.43

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

@@ -57,6 +57,18 @@ sap.ui.define(["sap/m/MessageToast", "sap/ui/model/json/JSONModel", "../api-hand
         extensionPointName = selectedItem.getText();
       }
       this.model.setProperty('/extensionPointName', extensionPointName);
+      const hasDefaultContent = this.hasDefaultContentForName(extensionPointName);
+      this.model.setProperty('/hasDefaultContent', hasDefaultContent);
+    },
+    /**
+     * Determines whether there is default content associated with the given name.
+     *
+     * @param {string} name - The name to check for associated default content.
+     * @returns {boolean} - True if there is non-empty default content associated with the name, false otherwise.
+     */
+    hasDefaultContentForName: function _hasDefaultContentForName(name) {
+      const defaultContent = this.data?.info.find(v => v.name === name)?.defaultContent;
+      return defaultContent ? defaultContent.length > 0 : false;
     },
     /**
      * Builds data that is used in the dialog
@@ -64,20 +76,24 @@ sap.ui.define(["sap/m/MessageToast", "sap/ui/model/json/JSONModel", "../api-hand
     buildDialogData: async function _buildDialogData() {
       const name = this.data?.name;
       if (name) {
+        const hasDefaultContent = this.hasDefaultContentForName(name);
         const extensionPointList = [{
           key: 0,
           value: name
         }];
-        this.updateModel(name, 0, extensionPointList, false);
+        this.updateModel(name, 0, extensionPointList, false, hasDefaultContent);
       } else {
+        // In this case we are selecting from the application. There can be many extension points under one control.
         const extensionPointList = this.data.info.map((v, idx) => {
           return {
             key: idx,
             value: v.name
           };
         });
+        const firstElName = extensionPointList[0].value;
         const enabled = extensionPointList.length > 1;
-        this.updateModel(extensionPointList[0].value, 0, extensionPointList, enabled);
+        const hasDefaultContent = this.hasDefaultContentForName(firstElName);
+        this.updateModel(firstElName, 0, extensionPointList, enabled, hasDefaultContent);
       }
       try {
         const {
@@ -97,11 +113,12 @@ sap.ui.define(["sap/m/MessageToast", "sap/ui/model/json/JSONModel", "../api-hand
      * @param list All of the extension points that are under a view
      * @param enabled Enables the select control
      */
-    updateModel: function _updateModel(name, key, list, enabled) {
+    updateModel: function _updateModel(name, key, list, enabled, hasDefaultContent) {
       this.model.setProperty('/extensionPointName', name);
       this.model.setProperty('/extensionPointKey', key);
       this.model.setProperty('/extensionPointList', list);
       this.model.setProperty('/extensionListEnabled', enabled);
+      this.model.setProperty('/hasDefaultContent', hasDefaultContent);
     },
     /**
      * Creates add xml at extension point changes

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

@@ -85,6 +85,19 @@ export default class ExtensionPoint extends BaseDialog {
         }
 
         this.model.setProperty('/extensionPointName', extensionPointName);
+        const hasDefaultContent = this.hasDefaultContentForName(extensionPointName);
+        this.model.setProperty('/hasDefaultContent', hasDefaultContent);
+    }
+
+    /**
+     * Determines whether there is default content associated with the given name.
+     *
+     * @param {string} name - The name to check for associated default content.
+     * @returns {boolean} - True if there is non-empty default content associated with the name, false otherwise.
+     */
+    private hasDefaultContentForName(name: string): boolean {
+        const defaultContent = this.data?.info.find((v) => v.name === name)?.defaultContent;
+        return defaultContent ? defaultContent.length > 0 : false;
     }
 
     /**
@@ -92,18 +105,26 @@ export default class ExtensionPoint extends BaseDialog {
      */
     async buildDialogData(): Promise<void> {
         const name = this.data?.name;
+
         if (name) {
+            const hasDefaultContent = this.hasDefaultContentForName(name);
+
             const extensionPointList = [{ key: 0, value: name }];
-            this.updateModel(name, 0, extensionPointList, false);
+
+            this.updateModel(name, 0, extensionPointList, false, hasDefaultContent);
         } else {
+            // In this case we are selecting from the application. There can be many extension points under one control.
             const extensionPointList = this.data.info.map((v: ExtensionPointInfo, idx: number) => {
                 return {
                     key: idx,
                     value: v.name
                 };
             });
+            const firstElName = extensionPointList[0].value;
             const enabled = extensionPointList.length > 1;
-            this.updateModel(extensionPointList[0].value, 0, extensionPointList, enabled);
+            const hasDefaultContent = this.hasDefaultContentForName(firstElName);
+
+            this.updateModel(firstElName, 0, extensionPointList, enabled, hasDefaultContent);
         }
 
         try {
@@ -124,11 +145,18 @@ export default class ExtensionPoint extends BaseDialog {
      * @param list All of the extension points that are under a view
      * @param enabled Enables the select control
      */
-    private updateModel(name: string, key: number, list: { key: number; value: string }[], enabled: boolean): void {
+    private updateModel(
+        name: string,
+        key: number,
+        list: { key: number; value: string }[],
+        enabled: boolean,
+        hasDefaultContent: boolean
+    ): void {
         this.model.setProperty('/extensionPointName', name);
         this.model.setProperty('/extensionPointKey', key);
         this.model.setProperty('/extensionPointList', list);
         this.model.setProperty('/extensionListEnabled', enabled);
+        this.model.setProperty('/hasDefaultContent', hasDefaultContent);
     }
 
     /**

package/dist/client/adp/extension-point.ts

@@ -24,11 +24,11 @@ export interface ExtensionPointInfo {
     name: string;
     index?: number;
     view?: View;
-    createdControls?: [];
+    createdControls: string[];
     fragmentId?: string;
     aggregation?: string[];
     aggregationName?: string;
-    defaultContent?: string[];
+    defaultContent: UI5Element[];
     targetControl?: UI5Element;
 }
 
@@ -81,7 +81,7 @@ export default class ExtensionPointService {
 
         const plugin = new AddXMLAtExtensionPoint({
             commandFactory,
-            fragmentHandler: async (overlay: UI5Element, info: ExtensionPointData[]) =>
+            fragmentHandler: async (overlay: UI5Element, info: ExtensionPointInfo[]) =>
                 await this.fragmentHandler(overlay, info)
         });
 
@@ -97,7 +97,7 @@ export default class ExtensionPointService {
      * @param info Extension point data from the plugin
      * @returns Deferred extension point data that is provided to the plugin
      */
-    public async fragmentHandler(overlay: UI5Element, info: ExtensionPointData[]): Promise<DeferredExtPointData> {
+    public async fragmentHandler(overlay: UI5Element, info: ExtensionPointInfo[]): Promise<DeferredExtPointData> {
         let deferred = createDeferred<DeferredExtPointData>();
         const name = this.selectedExtensionPointName;
 
@@ -105,7 +105,7 @@ export default class ExtensionPointService {
             name,
             info,
             deferred
-        } as ExtensionPointData);
+        });
 
         this.selectedExtensionPointName = '';
         return deferred.promise;

package/dist/client/adp/ui/ExtensionPoint.fragment.xml

@@ -13,6 +13,14 @@
             labelSpanS="4"
             singleContainerFullSize="false">
             <f:content>
+                <MessageStrip
+                    text="Have in mind that the selected extension point has a default content and by adding fragment it will no longer be visible."
+                    id="extensionPointDefaultContentMessage"
+                    class="sapUiTinyMarginBottom"
+                    showIcon="true"
+                    type="Information"
+                    visible="{/hasDefaultContent}">
+                </MessageStrip>
                 <Label text="Extension Point" />
                 <Select
                     enabled="{/extensionListEnabled}"

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

@@ -15,6 +15,7 @@ import Log from 'sap/base/Log';
 export async function initOutline(rta: RuntimeAuthoring, sendAction: (action: ExternalAction) => void): Promise<void> {
     const outline = await rta.getService<OutlineService>('outline');
     const scenario = rta.getFlexSettings().scenario;
+
     async function syncOutline() {
         try {
             const viewNodes = await outline.get();

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

@@ -7,20 +7,27 @@ sap.ui.define(["./utils"], function (___utils) {
   /**
    * Retrieves additional data for a given control ID.
    *
-   * @param id The control ID for which to retrieve additional data
-   * @returns An object containing additional data, including an optional 'text' property
+   * @param id The unique identifier of the control.
+   * @returns An object containing the text and the technical name of the control.
    */
   function getAdditionalData(id) {
     const control = sap.ui.getCore().byId(id);
-    if (control?.getMetadata().getProperty('text')) {
+    if (!control) {
+      return {};
+    }
+    const metadata = control.getMetadata();
+    let details = {};
+    const technicalName = metadata.getElementName();
+    if (technicalName) {
+      details.technicalName = technicalName;
+    }
+    if (metadata.getProperty('text')) {
       const text = control.getProperty('text');
       if (typeof text === 'string' && text.trim() !== '') {
-        return {
-          text
-        };
+        details.text = text;
       }
     }
-    return {};
+    return details;
   }
 
   /**
@@ -33,12 +40,36 @@ sap.ui.define(["./utils"], function (___utils) {
     return (current.elements ?? []).flatMap(element => element.type === 'aggregation' ? element.elements ?? [] : []);
   }
 
+  /**
+   * Adds a new child node to the extension point's children array based on the given control ID.
+   *
+   * @param {string} id - The unique identifier of the control to be added as a child node.
+   * @param {OutlineNode[]} children - The array of children nodes to which the new node will be added.
+   */
+  function addChildToExtensionPoint(id, children) {
+    const {
+      text,
+      technicalName
+    } = getAdditionalData(id);
+    const editable = isEditable(id);
+    children.push({
+      controlId: id,
+      controlType: technicalName ?? 'sap.ui.extensionpoint.child',
+      name: text ?? id,
+      visible: true,
+      editable,
+      children: [],
+      hasDefaultContent: false
+    });
+  }
+
   /**
    * Transform node.
    *
    * @param input outline view node
    * @param scenario type of project
-   * @returns Promise<OutlineNode[]>
+   * @param extPointIDs ids that need are filled when extension point has default content or created controls inside
+   * @returns {Promise<OutlineNode[]>} transformed outline tree nodes
    */
   async function transformNodes(input, scenario) {
     const stack = [...input];
@@ -46,41 +77,77 @@ sap.ui.define(["./utils"], function (___utils) {
     while (stack.length) {
       const current = stack.shift();
       const editable = isEditable(current?.id);
+      const isAdp = scenario === 'ADAPTATION_PROJECT';
+      const isExtPoint = current?.type === 'extensionPoint';
       if (current?.type === 'element') {
         const children = getChildren(current);
         const {
           text
         } = getAdditionalData(current.id);
         const technicalName = current.technicalName.split('.').slice(-1)[0];
+        const transformedChildren = isAdp ? await handleDuplicateNodes(children, scenario) : await transformNodes(children, scenario);
         const node = {
           controlId: current.id,
           controlType: current.technicalName,
           name: text ?? technicalName,
           editable,
           visible: current.visible ?? true,
-          children: await transformNodes(children, scenario)
+          children: transformedChildren
         };
         items.push(node);
       }
-      if (scenario === 'ADAPTATION_PROJECT' && current?.type === 'extensionPoint') {
+      if (isAdp && isExtPoint) {
+        const {
+          defaultContent,
+          createdControls
+        } = current.extensionPointInfo;
+        let children = [];
+        // We can combine both because there can only be either defaultContent or createdControls for one extension point node.
+        [...defaultContent, ...createdControls].forEach(id => {
+          addChildToExtensionPoint(id, children);
+        });
         const node = {
           controlId: current.id,
           controlType: current.technicalName,
-          name: current.name,
+          name: current.name ?? '',
           editable,
           visible: current.visible ?? true,
-          children: [],
-          icon: current.icon
+          children,
+          hasDefaultContent: defaultContent.length > 0
         };
         items.push(node);
       }
     }
     return items;
   }
+
+  /**
+   * Handles duplicate nodes that are retrieved from extension point default content and created controls,
+   * if they exist under an extension point these controls are removed from the children array
+   *
+   * @param children outline view node children
+   * @param scenario type of project
+   * @returns transformed outline tree nodes
+   */
+  async function handleDuplicateNodes(children, scenario) {
+    const extPointIDs = new Set();
+    children.forEach(child => {
+      if (child.type === 'extensionPoint') {
+        const {
+          defaultContent,
+          createdControls
+        } = child.extensionPointInfo;
+        [...defaultContent, ...createdControls].forEach(id => extPointIDs.add(id));
+      }
+    });
+    const uniqueChildren = children.filter(child => !extPointIDs.has(child.id));
+    return transformNodes(uniqueChildren, scenario);
+  }
   var __exports = {
     __esModule: true
   };
   __exports.transformNodes = transformNodes;
+  __exports.handleDuplicateNodes = handleDuplicateNodes;
   return __exports;
 });
 //# sourceMappingURL=nodes.js.map

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

@@ -5,23 +5,39 @@ import type { Scenario } from 'sap/ui/fl/Scenario';
 
 import { isEditable } from './utils';
 
+interface AdditionalData {
+    text?: string;
+    technicalName?: string;
+}
+
 /**
  * Retrieves additional data for a given control ID.
  *
- * @param id The control ID for which to retrieve additional data
- * @returns An object containing additional data, including an optional 'text' property
+ * @param id The unique identifier of the control.
+ * @returns An object containing the text and the technical name of the control.
  */
-function getAdditionalData(id: string): { text?: string } {
+function getAdditionalData(id: string): AdditionalData {
     const control = sap.ui.getCore().byId(id);
-    if (control?.getMetadata().getProperty('text')) {
+    if (!control) {
+        return {};
+    }
+
+    const metadata = control.getMetadata();
+    let details: AdditionalData = {};
+
+    const technicalName = metadata.getElementName();
+    if (technicalName) {
+        details.technicalName = technicalName;
+    }
+
+    if (metadata.getProperty('text')) {
         const text = control.getProperty('text');
         if (typeof text === 'string' && text.trim() !== '') {
-            return {
-                text
-            };
+            details.text = text;
         }
     }
-    return {};
+
+    return details;
 }
 
 /**
@@ -36,12 +52,34 @@ function getChildren(current: OutlineViewNode): OutlineViewNode[] {
     );
 }
 
+/**
+ * Adds a new child node to the extension point's children array based on the given control ID.
+ *
+ * @param {string} id - The unique identifier of the control to be added as a child node.
+ * @param {OutlineNode[]} children - The array of children nodes to which the new node will be added.
+ */
+function addChildToExtensionPoint(id: string, children: OutlineNode[]) {
+    const { text, technicalName } = getAdditionalData(id);
+    const editable = isEditable(id);
+
+    children.push({
+        controlId: id,
+        controlType: technicalName ?? 'sap.ui.extensionpoint.child',
+        name: text ?? id,
+        visible: true,
+        editable,
+        children: [],
+        hasDefaultContent: false
+    });
+}
+
 /**
  * Transform node.
  *
  * @param input outline view node
  * @param scenario type of project
- * @returns Promise<OutlineNode[]>
+ * @param extPointIDs ids that need are filled when extension point has default content or created controls inside
+ * @returns {Promise<OutlineNode[]>} transformed outline tree nodes
  */
 export async function transformNodes(input: OutlineViewNode[], scenario: Scenario): Promise<OutlineNode[]> {
     const stack = [...input];
@@ -49,32 +87,47 @@ export async function transformNodes(input: OutlineViewNode[], scenario: Scenari
     while (stack.length) {
         const current = stack.shift();
         const editable = isEditable(current?.id);
+        const isAdp = scenario === 'ADAPTATION_PROJECT';
+        const isExtPoint = current?.type === 'extensionPoint';
+
         if (current?.type === 'element') {
             const children = getChildren(current);
             const { text } = getAdditionalData(current.id);
             const technicalName = current.technicalName.split('.').slice(-1)[0];
 
+            const transformedChildren = isAdp
+                ? await handleDuplicateNodes(children, scenario)
+                : await transformNodes(children, scenario);
+
             const node: OutlineNode = {
                 controlId: current.id,
                 controlType: current.technicalName,
                 name: text ?? technicalName,
                 editable,
                 visible: current.visible ?? true,
-                children: await transformNodes(children, scenario)
+                children: transformedChildren
             };
 
             items.push(node);
         }
 
-        if (scenario === 'ADAPTATION_PROJECT' && current?.type === 'extensionPoint') {
+        if (isAdp && isExtPoint) {
+            const { defaultContent, createdControls } = current.extensionPointInfo;
+
+            let children: OutlineNode[] = [];
+            // We can combine both because there can only be either defaultContent or createdControls for one extension point node.
+            [...defaultContent, ...createdControls].forEach((id: string) => {
+                addChildToExtensionPoint(id, children);
+            });
+
             const node: OutlineNode = {
                 controlId: current.id,
                 controlType: current.technicalName,
-                name: current.name!,
+                name: current.name ?? '',
                 editable,
                 visible: current.visible ?? true,
-                children: [],
-                icon: current.icon
+                children,
+                hasDefaultContent: defaultContent.length > 0
             };
 
             items.push(node);
@@ -82,3 +135,26 @@ export async function transformNodes(input: OutlineViewNode[], scenario: Scenari
     }
     return items;
 }
+
+/**
+ * Handles duplicate nodes that are retrieved from extension point default content and created controls,
+ * if they exist under an extension point these controls are removed from the children array
+ *
+ * @param children outline view node children
+ * @param scenario type of project
+ * @returns transformed outline tree nodes
+ */
+export async function handleDuplicateNodes(children: OutlineViewNode[], scenario: Scenario): Promise<OutlineNode[]> {
+    const extPointIDs = new Set<string>();
+
+    children.forEach((child: OutlineViewNode) => {
+        if (child.type === 'extensionPoint') {
+            const { defaultContent, createdControls } = child.extensionPointInfo;
+            [...defaultContent, ...createdControls].forEach((id) => extPointIDs.add(id));
+        }
+    });
+
+    const uniqueChildren = children.filter((child) => !extPointIDs.has(child.id));
+
+    return transformNodes(uniqueChildren, scenario);
+}

package/package.json

@@ -9,7 +9,7 @@
   "bugs": {
     "url": "https://github.com/SAP/open-ux-tools/issues?q=is%3Aopen+is%3Aissue+label%3Abug+label%3Apreview-middleware"
   },
-  "version": "0.13.42",
+  "version": "0.13.43",
   "license": "Apache-2.0",
   "author": "@SAP/ux-tools-team",
   "main": "dist/index.js",
@@ -28,7 +28,7 @@
     "@sap-ux/logger": "0.5.1",
     "@sap-ux/btp-utils": "0.14.4",
     "@sap-ux/adp-tooling": "0.10.7",
-    "@sap-ux/control-property-editor-sources": "npm:@sap-ux/control-property-editor@0.4.20",
+    "@sap-ux/control-property-editor-sources": "npm:@sap-ux/control-property-editor@0.4.21",
     "@sap-ux/project-access": "1.20.0"
   },
   "devDependencies": {
@@ -45,7 +45,7 @@
     "supertest": "6.3.3",
     "@sap-ux-private/playwright": "0.0.3",
     "dotenv": "16.3.1",
-    "@private/preview-middleware-client": "npm:@sap-ux-private/preview-middleware-client@0.9.12",
+    "@private/preview-middleware-client": "npm:@sap-ux-private/preview-middleware-client@0.9.13",
     "@sap-ux/axios-extension": "1.12.4",
     "@sap-ux/store": "0.5.0",
     "@sap-ux/ui5-info": "0.5.0",