@sap-ux/preview-middleware 0.11.20 → 0.11.21

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

@@ -13,10 +13,10 @@ sap.ui.define(["sap/m/MessageToast", "sap/ui/model/json/JSONModel", "../api-hand
    * @namespace open.ux.preview.client.adp.controllers
    */
   const ExtensionPoint = BaseDialog.extend("open.ux.preview.client.adp.controllers.ExtensionPoint", {
-    constructor: function _constructor(name, _overlays, _rta, extensionPointData) {
+    constructor: function _constructor(name, _overlays, _rta, data) {
       BaseDialog.prototype.constructor.call(this, name);
       this.model = new JSONModel();
-      this.extensionPointData = extensionPointData;
+      this.data = data;
     },
     onInit: async function _onInit() {
       this.dialog = this.byId('addFragmentAtExtPointDialog');
@@ -32,8 +32,33 @@ sap.ui.define(["sap/m/MessageToast", "sap/ui/model/json/JSONModel", "../api-hand
       await this.createNewFragment(fragmentName);
       this.handleDialogClose();
     },
+    onExtensionPointHandler: function _onExtensionPointHandler(event) {
+      const source = event.getSource();
+      const selectedItem = source.getSelectedItem();
+      let extensionPointName = '';
+      if (selectedItem) {
+        extensionPointName = selectedItem.getText();
+      }
+      this.model.setProperty('/extensionPointName', extensionPointName);
+    },
     buildDialogData: async function _buildDialogData() {
-      this.model.setProperty('/extensionPointName', this.extensionPointData?.name);
+      const name = this.data?.name;
+      if (name) {
+        const extensionPointList = [{
+          key: 0,
+          value: name
+        }];
+        this.updateModel(name, 0, extensionPointList, false);
+      } else {
+        const extensionPointList = this.data.info.map((v, idx) => {
+          return {
+            key: idx,
+            value: v.name
+          };
+        });
+        const enabled = extensionPointList.length > 1;
+        this.updateModel(extensionPointList[0].value, 0, extensionPointList, enabled);
+      }
       try {
         const {
           fragments
@@ -44,6 +69,12 @@ sap.ui.define(["sap/m/MessageToast", "sap/ui/model/json/JSONModel", "../api-hand
         throw new Error(e.message);
       }
     },
+    updateModel: function _updateModel(name, key, list, enabled) {
+      this.model.setProperty('/extensionPointName', name);
+      this.model.setProperty('/extensionPointKey', key);
+      this.model.setProperty('/extensionPointList', list);
+      this.model.setProperty('/extensionListEnabled', enabled);
+    },
     createNewFragment: async function _createNewFragment(fragmentName) {
       try {
         await writeFragment({
@@ -58,11 +89,12 @@ sap.ui.define(["sap/m/MessageToast", "sap/ui/model/json/JSONModel", "../api-hand
       await this.createExtensionPointFragmentChange(fragmentName);
     },
     createExtensionPointFragmentChange: async function _createExtensionPointFragmentChange(fragmentName) {
+      const extensionPointName = this.model.getProperty('/extensionPointName');
       const modifiedValue = {
         fragmentPath: `fragments/${fragmentName}.fragment.xml`,
-        extensionPointName: this.extensionPointData.name
+        extensionPointName
       };
-      this.extensionPointData.deffered.resolve(modifiedValue);
+      this.data.deferred.resolve(modifiedValue);
     }
   });
   return ExtensionPoint;

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

@@ -1,5 +1,6 @@
 /** sap.m */
-import Button from 'sap/m/Button';
+import type Button from 'sap/m/Button';
+import type Select from 'sap/m/Select';
 import type Dialog from 'sap/m/Dialog';
 import MessageToast from 'sap/m/MessageToast';
 
@@ -17,18 +18,18 @@ import type RuntimeAuthoring from 'sap/ui/rta/RuntimeAuthoring';
 
 import { getFragments, writeFragment } from '../api-handler';
 import BaseDialog from './BaseDialog.controller';
-import { ExtensionPointData } from '../extension-point';
+import { ExtensionPointData, ExtensionPointInfo } from '../extension-point';
 
 /**
  * @namespace open.ux.preview.client.adp.controllers
  */
 export default class ExtensionPoint extends BaseDialog {
-    public readonly extensionPointData: ExtensionPointData;
+    public readonly data: ExtensionPointData;
 
-    constructor(name: string, _overlays: UI5Element, _rta: RuntimeAuthoring, extensionPointData: ExtensionPointData) {
+    constructor(name: string, _overlays: UI5Element, _rta: RuntimeAuthoring, data: ExtensionPointData) {
         super(name);
         this.model = new JSONModel();
-        this.extensionPointData = extensionPointData;
+        this.data = data;
     }
 
     /**
@@ -51,7 +52,7 @@ export default class ExtensionPoint extends BaseDialog {
      *
      * @param event Event
      */
-    async onCreateBtnPress(event: Event) {
+    async onCreateBtnPress(event: Event): Promise<void> {
         const source = event.getSource<Button>();
         source.setEnabled(false);
 
@@ -62,11 +63,42 @@ export default class ExtensionPoint extends BaseDialog {
         this.handleDialogClose();
     }
 
+    /**
+     * Handler for extension point select control
+     *
+     * @param event Select control change event
+     */
+    onExtensionPointHandler(event: Event): void {
+        const source = event.getSource<Select>();
+
+        const selectedItem = source.getSelectedItem();
+
+        let extensionPointName = '';
+        if (selectedItem) {
+            extensionPointName = selectedItem.getText();
+        }
+
+        this.model.setProperty('/extensionPointName', extensionPointName);
+    }
+
     /**
      * Builds data that is used in the dialog
      */
     async buildDialogData(): Promise<void> {
-        this.model.setProperty('/extensionPointName', this.extensionPointData?.name);
+        const name = this.data?.name;
+        if (name) {
+            const extensionPointList = [{ key: 0, value: name }];
+            this.updateModel(name, 0, extensionPointList, false);
+        } else {
+            const extensionPointList = this.data.info.map((v: ExtensionPointInfo, idx: number) => {
+                return {
+                    key: idx,
+                    value: v.name
+                };
+            });
+            const enabled = extensionPointList.length > 1;
+            this.updateModel(extensionPointList[0].value, 0, extensionPointList, enabled);
+        }
 
         try {
             const { fragments } = await getFragments();
@@ -78,6 +110,21 @@ export default class ExtensionPoint extends BaseDialog {
         }
     }
 
+    /**
+     * Updates the Select control according to provided values
+     * 
+     * @param name Extension point name
+     * @param key Selected extension point key
+     * @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 {
+        this.model.setProperty('/extensionPointName', name);
+        this.model.setProperty('/extensionPointKey', key);
+        this.model.setProperty('/extensionPointList', list);
+        this.model.setProperty('/extensionListEnabled', enabled);
+    }
+
     /**
      * Creates a new fragment for the specified extension point
      *
@@ -102,11 +149,12 @@ export default class ExtensionPoint extends BaseDialog {
      * @param fragmentName Fragment name
      */
     private async createExtensionPointFragmentChange(fragmentName: string): Promise<void> {
+        const extensionPointName = this.model.getProperty('/extensionPointName');
         const modifiedValue = {
             fragmentPath: `fragments/${fragmentName}.fragment.xml`,
-            extensionPointName: this.extensionPointData.name
+            extensionPointName
         };
 
-        this.extensionPointData.deffered.resolve(modifiedValue);
+        this.data.deferred.resolve(modifiedValue);
     }
 }

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

@@ -21,9 +21,10 @@ sap.ui.define([
             subscribe(async action => {
                 if (addExtensionPoint.match(action)) {
                     try {
-                        const {controlId} = action.payload;
+                        const {controlId, name} = action.payload;
                         const service = await this.rta.getService('action');
                         service.execute(controlId, this.actionId);
+                        this.selectedExtensionPointName = name;
                     } catch (e) {
                         throw new Error(`Failed to execute service with actionId: ${ this.actionId }`);
                     }
@@ -35,19 +36,22 @@ sap.ui.define([
             const commandFactory = new CommandFactory({ flexSettings });
             const plugin = new AddXMLAtExtensionPoint({
                 commandFactory,
-                fragmentHandler: async (overlay, info) => await this.fragmentHandler(overlay, info[0])
+                fragmentHandler: async (overlay, info) => await this.fragmentHandler(overlay, info)
             });
             const defaultPlugins = this.rta.getDefaultPlugins();
             defaultPlugins.addXMLAtExtensionPoint = plugin;
             this.rta.setPlugins(defaultPlugins);
         }
         async fragmentHandler(overlay, info) {
-            let deffered = createDeferred();
+            let deferred = createDeferred();
+            const name = this.selectedExtensionPointName;
             await handler(overlay, this.rta, DialogNames.ADD_FRAGMENT_AT_EXTENSION_POINT, {
-                name: info.name,
-                deffered
+                name,
+                info,
+                deferred
             });
-            return deffered.promise;
+            this.selectedExtensionPointName = '';
+            return deferred.promise;
         }
     }
     return ExtensionPointService;

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

@@ -20,9 +20,8 @@ type DeferredExtPointData = {
     extensionPointName: string | undefined;
 };
 
-export interface ExtensionPointData {
+export interface ExtensionPointInfo {
     name: string;
-    deffered: Deferred<DeferredExtPointData>;
     index?: number;
     view?: View;
     createdControls?: [];
@@ -33,8 +32,15 @@ export interface ExtensionPointData {
     targetControl?: UI5Element;
 }
 
+export interface ExtensionPointData {
+    name: string;
+    deferred: Deferred<DeferredExtPointData>;
+    info: ExtensionPointInfo[];
+}
+
 export default class ExtensionPointService {
     private readonly actionId = 'CTX_ADDXML_AT_EXTENSIONPOINT';
+    private selectedExtensionPointName: string;
 
     /**
      * @param rta Runtime Authoring
@@ -51,11 +57,12 @@ export default class ExtensionPointService {
         subscribe(async (action: ExternalAction): Promise<void> => {
             if (addExtensionPoint.match(action)) {
                 try {
-                    const { controlId } = action.payload;
+                    const { controlId, name } = action.payload;
 
                     const service = await this.rta.getService<ActionService>('action');
 
                     service.execute(controlId, this.actionId);
+                    this.selectedExtensionPointName = name;
                 } catch (e) {
                     throw new Error(`Failed to execute service with actionId: ${this.actionId}`);
                 }
@@ -75,7 +82,7 @@ export default class ExtensionPointService {
         const plugin = new AddXMLAtExtensionPoint({
             commandFactory,
             fragmentHandler: async (overlay: UI5Element, info: ExtensionPointData[]) =>
-                await this.fragmentHandler(overlay, info[0])
+                await this.fragmentHandler(overlay, info)
         });
 
         const defaultPlugins = this.rta.getDefaultPlugins();
@@ -88,16 +95,19 @@ export default class ExtensionPointService {
      *
      * @param overlay UI5 Element overlay
      * @param info Extension point data from the plugin
-     * @returns Deffered extension point data that is provided to the plugin
+     * @returns Deferred extension point data that is provided to the plugin
      */
-    public async fragmentHandler(overlay: UI5Element, info: ExtensionPointData): Promise<DeferredExtPointData> {
-        let deffered = createDeferred<DeferredExtPointData>();
+    public async fragmentHandler(overlay: UI5Element, info: ExtensionPointData[]): Promise<DeferredExtPointData> {
+        let deferred = createDeferred<DeferredExtPointData>();
+        const name = this.selectedExtensionPointName;
 
         await handler(overlay, this.rta, DialogNames.ADD_FRAGMENT_AT_EXTENSION_POINT, {
-            name: info.name,
-            deffered
+            name,
+            info,
+            deferred
         } as ExtensionPointData);
 
-        return deffered.promise;
+        this.selectedExtensionPointName = '';
+        return deferred.promise;
     }
 }

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

@@ -11,7 +11,16 @@
                     singleContainerFullSize="false">
                     <f:content>
                         <Label text="Extension Point" />
-                        <Text text="{/extensionPointName}" />
+                        <Select
+                            enabled="{/extensionListEnabled}"
+                            change="onExtensionPointHandler"
+                            selectedKey='{/extensionPointKey}'
+                            items="{
+                                path: '/extensionPointList',
+                                sorter: { path: 'text' }
+                            }">
+                            <core:Item key="{key}" text="{value}" />
+                        </Select>
                         <Label text="Fragment Name" />
                         <Input 
                             description=".fragment.xml" 

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.11.20",
+  "version": "0.11.21",
   "license": "Apache-2.0",
   "author": "@SAP/ux-tools-team",
   "main": "dist/index.js",
@@ -24,8 +24,8 @@
   "dependencies": {
     "ejs": "3.1.9",
     "@sap-ux/logger": "0.4.0",
-    "@sap-ux/control-property-editor-sources": "npm:@sap-ux/control-property-editor@0.4.6",
-    "@sap-ux/adp-tooling": "0.7.2"
+    "@sap-ux/adp-tooling": "0.7.2",
+    "@sap-ux/control-property-editor-sources": "npm:@sap-ux/control-property-editor@0.4.7"
   },
   "devDependencies": {
     "@types/ejs": "3.1.2",
@@ -38,8 +38,8 @@
     "supertest": "6.3.3",
     "@sap-ux-private/playwright": "0.0.1",
     "dotenv": "16.3.1",
-    "@private/preview-middleware-client": "npm:@sap-ux-private/preview-middleware-client@0.8.11",
-    "@sap-ux/project-access": "1.16.1",
+    "@private/preview-middleware-client": "npm:@sap-ux-private/preview-middleware-client@0.8.12",
+    "@sap-ux/project-access": "1.16.2",
     "@sap-ux/store": "0.4.0"
   },
   "peerDependencies": {