@sap-ux/preview-middleware 0.8.7 → 0.10.0

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

@@ -1,7 +1,7 @@
 import type {
     ExternalAction,
+    PendingChange,
     SavedPropertyChange,
-    PendingPropertyChange,
     UnknownSavedChange
 } from '@sap-ux-private/control-property-editor-common';
 import {
@@ -39,6 +39,7 @@ interface Change {
     selector: ChangeSelector;
     content: ChangeContent;
     creation: string;
+    changeType: string;
 }
 
 type Properties<T extends object> = { [K in keyof T]-?: K extends string ? K : never }[keyof T];
@@ -91,10 +92,7 @@ export class ChangeService {
      * @param ui5 facade for ui5 framework methods.
      * @param selectionService selection service instance.
      */
-    constructor(
-        private readonly options: UI5AdaptationOptions,
-        private readonly selectionService: SelectionService
-    ) {}
+    constructor(private readonly options: UI5AdaptationOptions, private readonly selectionService: SelectionService) {}
 
     /**
      *
@@ -144,6 +142,9 @@ export class ChangeService {
                         ) {
                             throw new Error('Invalid change, missing new value in the change file');
                         }
+                        if (change.changeType !== 'propertyChange' && change.changeType !== 'propertyBindingChange') {
+                            throw new Error('Unknown Change Type');
+                        }
                         return {
                             type: 'saved',
                             kind: 'valid',
@@ -152,7 +153,8 @@ export class ChangeService {
                             propertyName: change.content.property,
                             value: change.content.newValue ?? change.content.newBinding,
                             timestamp: new Date(change.creation).getTime(),
-                            controlName: change.selector.type.split('.').pop()
+                            controlName: change.selector.type ? (change.selector.type.split('.').pop() as string) : '',
+                            changeType: change.changeType
                         };
                     } catch (error) {
                         // Gracefully handle change files with invalid content
@@ -160,7 +162,8 @@ export class ChangeService {
                             const unknownChange: UnknownSavedChange = {
                                 type: 'saved',
                                 kind: 'unknown',
-                                fileName: change.fileName
+                                fileName: change.fileName,
+                                controlId: change.selector?.id // some changes may not have selector
                             };
                             if (change.creation) {
                                 unknownChange.timestamp = new Date(change.creation).getTime();
@@ -220,38 +223,23 @@ export class ChangeService {
             const allCommands = stack.getCommands();
             const executedCommands = stack.getAllExecutedCommands();
             const inactiveCommandCount = allCommands.length - executedCommands.length;
-
-            const activeChanges = allCommands
-                .map((command: BaseCommand, i): PendingPropertyChange | undefined => {
-                    let result: PendingPropertyChange | undefined;
-                    try {
-                        const selector = command.getProperty('selector');
-                        const changeType = command.getProperty('changeType');
-                        let value = '';
-                        switch (changeType) {
-                            case 'propertyChange':
-                                value = command.getProperty('newValue');
-                                break;
-                            case 'propertyBindingChange':
-                                value = command.getProperty('newBinding');
-                                break;
-                            default:
-                                throw new Error(`Invalid changeType ${changeType}`);
-                        }
-                        result = {
-                            type: 'pending',
-                            controlId: selector.id,
-                            propertyName: command.getProperty('propertyName'),
-                            isActive: i >= inactiveCommandCount,
-                            value,
-                            controlName: command.getElement().getMetadata().getName().split('.').pop() ?? ''
-                        };
-                    } catch (error) {
-                        Log.error('Failed: ', error);
+            let activeChanges: PendingChange[] = [];
+            allCommands.forEach((command: BaseCommand, i): void => {
+                try {
+                    if (typeof command.getCommands === 'function') {
+                        const subCommands = command.getCommands();
+                        subCommands.forEach((command) => {
+                            activeChanges.push(this.prepareChangeType(command, inactiveCommandCount, i));
+                        });
+                    } else {
+                        activeChanges.push(this.prepareChangeType(command, inactiveCommandCount, i));
                     }
-                    return result;
-                })
-                .filter((change): boolean => !!change) as PendingPropertyChange[];
+                } catch (error) {
+                    Log.error('CPE: Change creation Failed', error);
+                }
+            });
+
+            activeChanges = activeChanges.filter((change): boolean => !!change);
             sendAction(
                 changeStackModified({
                     saved: this.savedChanges,
@@ -260,4 +248,40 @@ export class ChangeService {
             );
         };
     }
+
+    private prepareChangeType(command: BaseCommand, inactiveCommandCount: number, index: number): PendingChange {
+        let result: PendingChange;
+        let value = '';
+        const selector = command.getSelector();
+        const changeType = command.getChangeType();
+        switch (changeType) {
+            case 'propertyChange':
+                value = command.getProperty('newValue');
+                break;
+            case 'propertyBindingChange':
+                value = command.getProperty('newBinding');
+                break;
+        }
+        if (changeType === 'propertyChange' || changeType === 'propertyBindingChange') {
+            result = {
+                type: 'pending',
+                changeType,
+                controlId: selector.id,
+                propertyName: command.getProperty('propertyName'),
+                isActive: index >= inactiveCommandCount,
+                value,
+                controlName: command.getElement().getMetadata().getName().split('.').pop() ?? ''
+            };
+        } else {
+            result = {
+                type: 'pending',
+                controlId: selector.id,
+                changeType,
+                isActive: index >= inactiveCommandCount,
+                controlName: command.getElement().getMetadata().getName().split('.').pop() ?? ''
+            };
+        }
+
+        return result;
+    }
 }

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

@@ -9,10 +9,11 @@ sap.ui.define([
     const transformNodes = ___nodes['transformNodes'];
     async function initOutline(rta, sendAction) {
         const outline = await rta.getService('outline');
+        const scenario = rta.getFlexSettings().scenario;
         async function syncOutline() {
             try {
                 const viewNodes = await outline.get();
-                const outlineNodes = await transformNodes(viewNodes);
+                const outlineNodes = await transformNodes(viewNodes, scenario);
                 sendAction(outlineChanged(outlineNodes));
             } catch (error) {
                 Log.error('Outline sync failed!', error);

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

@@ -14,10 +14,11 @@ 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();
-            const outlineNodes = await transformNodes(viewNodes);
+            const outlineNodes = await transformNodes(viewNodes, scenario);
 
             sendAction(outlineChanged(outlineNodes));
         } catch (error) {

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

@@ -4,6 +4,12 @@ sap.ui.define(["./utils"], function (___utils) {
   "use strict";
 
   const isEditable = ___utils["isEditable"];
+  /**
+   * 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
+   */
   function getAdditionalData(id) {
     const control = sap.ui.getCore().byId(id);
     if (control?.getMetadata().getProperty('text')) {
@@ -17,31 +23,54 @@ sap.ui.define(["./utils"], function (___utils) {
     return {};
   }
 
+  /**
+   * Gets the children nodes of an aggregation type node.
+   *
+   * @param current The current node to retrieve children from
+   * @returns An array of children nodes, or an empty array if none are found
+   */
+  function getChildren(current) {
+    return (current.elements ?? []).flatMap(element => element.type === 'aggregation' ? element.elements ?? [] : []);
+  }
+
   /**
    * Transform node.
    *
    * @param input outline view node
-   * @param getAdditionalData gets additional data for give control id.
+   * @param scenario type of project
    * @returns Promise<OutlineNode[]>
    */
-  async function transformNodes(input) {
+  async function transformNodes(input, scenario) {
     const stack = [...input];
     const items = [];
     while (stack.length) {
       const current = stack.shift();
       const editable = await isEditable(current?.id);
       if (current?.type === 'element') {
-        const children = (current.elements ?? []).flatMap(element => element.type === 'aggregation' ? element.elements ?? [] : []);
+        const children = getChildren(current);
         const {
           text
         } = getAdditionalData(current.id);
+        const technicalName = current.technicalName.split('.').slice(-1)[0];
+        const node = {
+          controlId: current.id,
+          controlType: current.technicalName,
+          name: text ?? technicalName,
+          editable,
+          visible: current.visible ?? true,
+          children: await transformNodes(children, scenario)
+        };
+        items.push(node);
+      }
+      if (scenario === 'ADAPTATION_PROJECT' && current?.type === 'extensionPoint') {
         const node = {
           controlId: current.id,
           controlType: current.technicalName,
-          name: text ?? current.technicalName.split('.').slice(-1)[0],
+          name: current.name,
           editable,
           visible: current.visible ?? true,
-          children: await transformNodes(children)
+          children: [],
+          icon: current.icon
         };
         items.push(node);
       }

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

@@ -1,7 +1,16 @@
 import type { OutlineNode } from '@sap-ux-private/control-property-editor-common';
-import { isEditable } from './utils';
+
 import type { OutlineViewNode } from 'sap/ui/rta/command/OutlineService';
+import type { Scenario } from 'sap/ui/fl/Scenario';
+
+import { isEditable } from './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
+ */
 function getAdditionalData(id: string): { text?: string } {
     const control = sap.ui.getCore().byId(id);
     if (control?.getMetadata().getProperty('text')) {
@@ -15,32 +24,57 @@ function getAdditionalData(id: string): { text?: string } {
     return {};
 }
 
+/**
+ * Gets the children nodes of an aggregation type node.
+ *
+ * @param current The current node to retrieve children from
+ * @returns An array of children nodes, or an empty array if none are found
+ */
+function getChildren(current: OutlineViewNode): OutlineViewNode[] {
+    return (current.elements ?? []).flatMap((element: OutlineViewNode) =>
+        element.type === 'aggregation' ? element.elements ?? [] : []
+    );
+}
+
 /**
  * Transform node.
  *
  * @param input outline view node
- * @param getAdditionalData gets additional data for give control id.
+ * @param scenario type of project
  * @returns Promise<OutlineNode[]>
  */
-export async function transformNodes(input: OutlineViewNode[]): Promise<OutlineNode[]> {
+export async function transformNodes(input: OutlineViewNode[], scenario: Scenario): Promise<OutlineNode[]> {
     const stack = [...input];
     const items: OutlineNode[] = [];
     while (stack.length) {
         const current = stack.shift();
         const editable = await isEditable(current?.id);
         if (current?.type === 'element') {
-            const children = (current.elements ?? []).flatMap((element: OutlineViewNode) =>
-                element.type === 'aggregation' ? element.elements ?? [] : []
-            );
+            const children = getChildren(current);
             const { text } = getAdditionalData(current.id);
+            const technicalName = current.technicalName.split('.').slice(-1)[0];
+
+            const node: OutlineNode = {
+                controlId: current.id,
+                controlType: current.technicalName,
+                name: text ?? technicalName,
+                editable,
+                visible: current.visible ?? true,
+                children: await transformNodes(children, scenario)
+            };
+
+            items.push(node);
+        }
 
+        if (scenario === 'ADAPTATION_PROJECT' && current?.type === 'extensionPoint') {
             const node: OutlineNode = {
                 controlId: current.id,
                 controlType: current.technicalName,
-                name: text ?? current.technicalName.split('.').slice(-1)[0],
+                name: current.name!,
                 editable,
                 visible: current.visible ?? true,
-                children: await transformNodes(children)
+                children: [],
+                icon: current.icon
             };
 
             items.push(node);

package/dist/client/thirdparty/@sap-ux-private/control-property-editor-common.js

@@ -8,7 +8,7 @@ sap.ui.define((function () { 'use strict';
 
 	(function (exports) {
 		Object.defineProperty(exports, "__esModule", { value: true });
-		exports.changeStackModified = exports.propertyChangeFailed = exports.propertyChanged = exports.changeProperty = exports.outlineChanged = exports.deletePropertyChanges = exports.selectControl = exports.controlSelected = exports.iconsLoaded = exports.EXTERNAL_ACTION_PREFIX = exports.CHECKBOX_EDITOR_TYPE = exports.DROPDOWN_EDITOR_TYPE = exports.INPUT_EDITOR_TYPE = exports.STRING_VALUE_TYPE = exports.FLOAT_VALUE_TYPE = exports.INTEGER_VALUE_TYPE = exports.BOOLEAN_VALUE_TYPE = void 0;
+		exports.changeStackModified = exports.propertyChangeFailed = exports.propertyChanged = exports.changeProperty = exports.outlineChanged = exports.deletePropertyChanges = exports.addExtensionPoint = exports.selectControl = exports.controlSelected = exports.iconsLoaded = exports.EXTERNAL_ACTION_PREFIX = exports.CHECKBOX_EDITOR_TYPE = exports.DROPDOWN_EDITOR_TYPE = exports.INPUT_EDITOR_TYPE = exports.STRING_VALUE_TYPE = exports.FLOAT_VALUE_TYPE = exports.INTEGER_VALUE_TYPE = exports.BOOLEAN_VALUE_TYPE = void 0;
 		exports.BOOLEAN_VALUE_TYPE = 'boolean';
 		exports.INTEGER_VALUE_TYPE = 'integer';
 		exports.FLOAT_VALUE_TYPE = 'float';
@@ -57,6 +57,7 @@ sap.ui.define((function () { 'use strict';
 		exports.iconsLoaded = createExternalAction('icons-loaded');
 		exports.controlSelected = createExternalAction('control-selected');
 		exports.selectControl = createExternalAction('select-control');
+		exports.addExtensionPoint = createExternalAction('add-extension-point');
 		exports.deletePropertyChanges = createExternalAction('delete-property-changes');
 		exports.outlineChanged = createExternalAction('outline-changed');
 		exports.changeProperty = createExternalAction('change-property');
@@ -224,9 +225,47 @@ sap.ui.define((function () { 'use strict';
 	(function (exports) {
 		Object.defineProperty(exports, "__esModule", { value: true });
 		exports.FlexChangesEndPoints = exports.convertCamelCaseToPascalCase = void 0;
+		const isUpperCase = (code) => code >= 65 && code <= 90;
+		const isLowerCase = (code) => code >= 97 && code <= 122;
+		const isWordDelimiter = (code) => code === 45 || code === 95 || code === 32; // - or _ or space
 		const convertCamelCaseToPascalCase = (text) => {
-		    const string = text.replace(/([A-Z])/g, ' $1');
-		    return string.charAt(0).toUpperCase() + string.slice(1);
+		    const words = [];
+		    let word = '';
+		    let lookForUpperCase = true;
+		    for (let i = 0; i < text.length; i++) {
+		        const character = text[i];
+		        if (lookForUpperCase) {
+		            // make sure that the first letter is capitalized
+		            word += word.length === 0 ? character.toUpperCase() : character;
+		            if (isLowerCase(text.charCodeAt(i + 1))) {
+		                // First lower case character after upper case character -> switch mode to collect only lower case characters
+		                lookForUpperCase = false;
+		            }
+		            else if (isUpperCase(text.charCodeAt(i + 1)) && isLowerCase(text.charCodeAt(i + 2))) {
+		                // Next character is the last uppercase character after a sequence of upper case character -> create an abbreviated word
+		                words.push(word);
+		                word = '';
+		            }
+		        }
+		        else if (isUpperCase(text.charCodeAt(i))) {
+		            // Upper case character indicates the beginning of a new word -> switch mode to detect abbreviated word
+		            words.push(word);
+		            lookForUpperCase = true;
+		            word = character;
+		        }
+		        else if (isWordDelimiter(text.charCodeAt(i))) {
+		            words.push(word);
+		            lookForUpperCase = true;
+		            word = '';
+		        }
+		        else {
+		            word += character;
+		        }
+		    }
+		    if (word.length) {
+		        words.push(word);
+		    }
+		    return words.join(' ');
 		};
 		exports.convertCamelCaseToPascalCase = convertCamelCaseToPascalCase;
 		(function (FlexChangesEndPoints) {

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.8.7",
+  "version": "0.10.0",
   "license": "Apache-2.0",
   "author": "@SAP/ux-tools-team",
   "main": "dist/index.js",
@@ -25,7 +25,7 @@
     "ejs": "3.1.9",
     "@sap-ux/logger": "0.4.0",
     "@sap-ux/adp-tooling": "0.5.3",
-    "@sap-ux/control-property-editor-sources": "npm:@sap-ux/control-property-editor@0.2.4"
+    "@sap-ux/control-property-editor-sources": "npm:@sap-ux/control-property-editor@0.4.0"
   },
   "devDependencies": {
     "@types/ejs": "3.1.2",
@@ -36,7 +36,7 @@
     "npm-run-all": "4.1.5",
     "nock": "13.2.1",
     "supertest": "6.3.3",
-    "@private/preview-middleware-client": "npm:@sap-ux-private/preview-middleware-client@0.5.1",
+    "@private/preview-middleware-client": "npm:@sap-ux-private/preview-middleware-client@0.7.0",
     "@sap-ux/project-access": "1.14.0",
     "@sap-ux/store": "0.4.0"
   },