@sap-ux/preview-middleware 0.16.97 → 0.16.100

package/dist/client/adp/command-executor.js

@@ -37,6 +37,23 @@ sap.ui.define(["sap/m/MessageToast", "sap/ui/rta/command/CommandFactory", "../ut
       }
     }
 
+    /**
+     * Creates composite command without nested commands
+     *
+     * @param runtimeControl Managed object
+     */
+    async createCompositeCommand(runtimeControl) {
+      try {
+        return await CommandFactory.getCommandFor(runtimeControl, 'composite');
+      } catch (e) {
+        const error = getError(e);
+        const msgToastErrorMsg = `Could not get composite command'. ${error.message}`;
+        error.message = msgToastErrorMsg;
+        MessageToast.show(msgToastErrorMsg);
+        throw error;
+      }
+    }
+
     /**
      * Pushed and executes the provided command
      *

package/dist/client/adp/command-executor.ts

@@ -2,6 +2,7 @@ import MessageToast from 'sap/m/MessageToast';
 import type ManagedObject from 'sap/ui/base/ManagedObject';
 import CommandFactory from 'sap/ui/rta/command/CommandFactory';
 import type RuntimeAuthoring from 'sap/ui/rta/RuntimeAuthoring';
+import type CompositeCommand from 'sap/ui/rta/command/CompositeCommand';
 import type { FlexSettings } from 'sap/ui/rta/RuntimeAuthoring';
 import type DesignTimeMetadata from 'sap/ui/dt/DesignTimeMetadata';
 import type FlexCommand from 'sap/ui/rta/command/FlexCommand';
@@ -52,12 +53,29 @@ export default class CommandExecutor {
         }
     }
 
+    /**
+     * Creates composite command without nested commands
+     *
+     * @param runtimeControl Managed object
+     */
+    public async createCompositeCommand(runtimeControl: ManagedObject): Promise<CompositeCommand> {
+        try {
+            return await CommandFactory.getCommandFor<CompositeCommand>(runtimeControl, 'composite');
+        } catch (e) {
+            const error = getError(e);
+            const msgToastErrorMsg = `Could not get composite command'. ${error.message}`;
+            error.message = msgToastErrorMsg;
+            MessageToast.show(msgToastErrorMsg);
+            throw error;
+        }
+    }
+
     /**
      * Pushed and executes the provided command
      *
      * @param command Command
      */
-    public async pushAndExecuteCommand(command: FlexCommand): Promise<void> {
+    public async pushAndExecuteCommand(command: FlexCommand | CompositeCommand): Promise<void> {
         try {
             /**
              * The change will have pending state and will only be saved to the workspace when the user clicks save icon

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

@@ -10,8 +10,8 @@ sap.ui.define([
     '../api-handler',
     './BaseDialog.controller',
     '../utils',
-    '../../utils/core'
-], function (JSONModel, OverlayRegistry, ___sap_ux_private_control_property_editor_common, ____i18n, ____cpe_communication_service, __ControlUtils, __CommandExecutor, ___api_handler, __BaseDialog, ___utils, ____utils_core) {
+    '../quick-actions/table-quick-action-base'
+], function (JSONModel, OverlayRegistry, ___sap_ux_private_control_property_editor_common, ____i18n, ____cpe_communication_service, __ControlUtils, __CommandExecutor, ___api_handler, __BaseDialog, ___utils, ___quick_actions_table_quick_action_base) {
     'use strict';
     function _interopRequireDefault(obj) {
         return obj && obj.__esModule && typeof obj.default !== 'undefined' ? obj.default : obj;
@@ -25,7 +25,9 @@ sap.ui.define([
     const getFragments = ___api_handler['getFragments'];
     const BaseDialog = _interopRequireDefault(__BaseDialog);
     const notifyUser = ___utils['notifyUser'];
-    const getControlById = ____utils_core['getControlById'];
+    const ANALYTICAL_TABLE_TYPE = ___quick_actions_table_quick_action_base['ANALYTICAL_TABLE_TYPE'];
+    const GRID_TABLE_TYPE = ___quick_actions_table_quick_action_base['GRID_TABLE_TYPE'];
+    const TREE_TABLE_TYPE = ___quick_actions_table_quick_action_base['TREE_TABLE_TYPE'];
     const radix = 10;
     const AddFragment = BaseDialog.extend('open.ux.preview.client.adp.controllers.AddFragment', {
         constructor: function _constructor(name, overlays, rta, options) {
@@ -49,20 +51,6 @@ sap.ui.define([
             this.dialog.setModel(this.model);
             this.dialog.open();
         },
-        specialIndexHandling: function _specialIndexHandling(specialIndexAggregation) {
-            const overlay = OverlayRegistry.getOverlay(this.runtimeControl);
-            const aggregations = overlay.getDesignTimeMetadata().getData().aggregations;
-            if (specialIndexAggregation in aggregations && 'specialIndexHandling' in aggregations[specialIndexAggregation]) {
-                const controlType = this.runtimeControl.getMetadata().getName();
-                this.model.setProperty('/indexHandlingFlag', false);
-                this.model.setProperty('/specialIndexHandlingIcon', true);
-                this.model.setProperty('/iconTooltip', `Index is defined by special logic of ${ controlType } and can't be set here`);
-            } else {
-                this.model.setProperty('/indexHandlingFlag', true);
-                this.model.setProperty('/specialIndexHandlingIcon', false);
-                this.model.setProperty('/specialIndexHandlingIconPressed', false);
-            }
-        },
         onAggregationChanged: function _onAggregationChanged(event) {
             const source = event.getSource();
             const selectedKey = source.getSelectedKey();
@@ -100,27 +88,7 @@ sap.ui.define([
             this.handleDialogClose();
         },
         buildDialogData: async function _buildDialogData() {
-            const selectorId = this.overlays.getId();
-            let controlMetadata;
-            const overlayControl = getControlById(selectorId);
-            if (overlayControl) {
-                this.runtimeControl = ControlUtils.getRuntimeControl(overlayControl);
-                controlMetadata = this.runtimeControl.getMetadata();
-            } else {
-                throw new Error('Cannot get overlay control');
-            }
-            const allAggregations = Object.keys(controlMetadata.getAllAggregations());
-            const hiddenAggregations = [
-                'customData',
-                'layoutData',
-                'dependents'
-            ];
-            const targetAggregation = allAggregations.filter(item => {
-                if (hiddenAggregations.indexOf(item) === -1) {
-                    return item;
-                }
-                return false;
-            });
+            const {controlMetadata, targetAggregation} = this.getControlMetadata();
             const defaultAggregation = this.options.aggregation ?? controlMetadata.getDefaultAggregationName();
             const selectedControlName = controlMetadata.getName();
             let selectedControlChildren = Object.keys(ControlUtils.getControlAggregationByName(this.runtimeControl, defaultAggregation));
@@ -160,31 +128,6 @@ sap.ui.define([
             this.model.setProperty('/targetAggregation', controlAggregation);
             this.model.setProperty('/index', indexArray);
         },
-        fillIndexArray: function _fillIndexArray(selectedControlChildren) {
-            let indexArray = [];
-            if (selectedControlChildren.length === 0) {
-                indexArray.push({
-                    key: 0,
-                    value: 0
-                });
-            } else {
-                indexArray = selectedControlChildren.map((elem, index) => {
-                    return {
-                        key: index + 1,
-                        value: elem + 1
-                    };
-                });
-                indexArray.unshift({
-                    key: 0,
-                    value: 0
-                });
-                indexArray.push({
-                    key: selectedControlChildren.length + 1,
-                    value: selectedControlChildren.length + 1
-                });
-            }
-            return indexArray;
-        },
         createFragmentChange: async function _createFragmentChange(fragmentData) {
             const {fragmentName, index, targetAggregation} = fragmentData;
             const flexSettings = this.rta.getFlexSettings();
@@ -218,6 +161,14 @@ sap.ui.define([
                 return 'CUSTOM_ACTION';
             } else if (this.isObjectPageHeaderField(currentControlName, targetAggregation)) {
                 return 'OBJECT_PAGE_HEADER_FIELD';
+            } else if (currentControlName === 'sap.ui.mdc.Table' && targetAggregation === 'columns') {
+                return 'V4_MDC_TABLE_COLUMN';
+            } else if ([
+                    TREE_TABLE_TYPE,
+                    GRID_TABLE_TYPE,
+                    ANALYTICAL_TABLE_TYPE
+                ].includes(currentControlName) && targetAggregation === 'columns') {
+                return 'ANALYTICAL_TABLE_COLUMN';
             } else if (currentControlName === 'sap.ui.mdc.ActionToolbar' && targetAggregation === 'actions') {
                 return 'TABLE_ACTION';
             }

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

@@ -8,7 +8,6 @@ import type UI5Element from 'sap/ui/core/Element';
 
 /** sap.ui.base */
 import type Event from 'sap/ui/base/Event';
-import type ManagedObjectMetadata from 'sap/ui/base/ManagedObjectMetadata';
 
 /** sap.ui.model */
 import JSONModel from 'sap/ui/model/json/JSONModel';
@@ -18,7 +17,6 @@ import type RuntimeAuthoring from 'sap/ui/rta/RuntimeAuthoring';
 
 /** sap.ui.dt */
 import OverlayRegistry from 'sap/ui/dt/OverlayRegistry';
-import type ElementOverlay from 'sap/ui/dt/ElementOverlay';
 
 /** sap.ui.fl */
 import { type AddFragmentChangeContentType } from 'sap/ui/fl/Change';
@@ -33,7 +31,7 @@ import CommandExecutor from '../command-executor';
 import { getFragments } from '../api-handler';
 import BaseDialog from './BaseDialog.controller';
 import { notifyUser } from '../utils';
-import { getControlById } from '../../utils/core';
+import { ANALYTICAL_TABLE_TYPE, GRID_TABLE_TYPE, TREE_TABLE_TYPE } from '../quick-actions/table-quick-action-base';
 
 interface CreateFragmentProps {
     fragmentName: string;
@@ -43,7 +41,7 @@ interface CreateFragmentProps {
 
 const radix = 10;
 
-type AddFragmentModel = JSONModel & {
+export type AddFragmentModel = JSONModel & {
     getProperty(sPath: '/title'): string;
     getProperty(sPath: '/completeView'): boolean;
     getProperty(sPath: '/newFragmentName'): string;
@@ -91,33 +89,6 @@ export default class AddFragment extends BaseDialog<AddFragmentModel> {
         this.dialog.open();
     }
 
-    /**
-     * Handles the index field whenever a specific aggregation is chosen
-     *
-     * @param specialIndexAggregation string | number
-     */
-    private specialIndexHandling(specialIndexAggregation: string | number): void {
-        const overlay = OverlayRegistry.getOverlay(this.runtimeControl as UI5Element);
-        const aggregations = overlay.getDesignTimeMetadata().getData().aggregations;
-
-        if (
-            specialIndexAggregation in aggregations &&
-            'specialIndexHandling' in aggregations[specialIndexAggregation]
-        ) {
-            const controlType = this.runtimeControl.getMetadata().getName();
-            this.model.setProperty('/indexHandlingFlag', false);
-            this.model.setProperty('/specialIndexHandlingIcon', true);
-            this.model.setProperty(
-                '/iconTooltip',
-                `Index is defined by special logic of ${controlType} and can't be set here`
-            );
-        } else {
-            this.model.setProperty('/indexHandlingFlag', true);
-            this.model.setProperty('/specialIndexHandlingIcon', false);
-            this.model.setProperty('/specialIndexHandlingIconPressed', false);
-        }
-    }
-
     /**
      * Handles the change in aggregations
      *
@@ -184,26 +155,7 @@ export default class AddFragment extends BaseDialog<AddFragmentModel> {
      * Builds data that is used in the dialog
      */
     async buildDialogData(): Promise<void> {
-        const selectorId = this.overlays.getId();
-
-        let controlMetadata: ManagedObjectMetadata;
-
-        const overlayControl = getControlById(selectorId) as unknown as ElementOverlay;
-        if (overlayControl) {
-            this.runtimeControl = ControlUtils.getRuntimeControl(overlayControl);
-            controlMetadata = this.runtimeControl.getMetadata();
-        } else {
-            throw new Error('Cannot get overlay control');
-        }
-
-        const allAggregations = Object.keys(controlMetadata.getAllAggregations());
-        const hiddenAggregations = ['customData', 'layoutData', 'dependents'];
-        const targetAggregation = allAggregations.filter((item) => {
-            if (hiddenAggregations.indexOf(item) === -1) {
-                return item;
-            }
-            return false;
-        });
+        const { controlMetadata, targetAggregation } = this.getControlMetadata();
         const defaultAggregation = this.options.aggregation ?? controlMetadata.getDefaultAggregationName();
         const selectedControlName = controlMetadata.getName();
 
@@ -254,29 +206,6 @@ export default class AddFragment extends BaseDialog<AddFragmentModel> {
         this.model.setProperty('/index', indexArray);
     }
 
-    /**
-     * Fills indexArray from selected control children
-     *
-     * @param selectedControlChildren Array of numbers
-     * @returns Array of key value pairs
-     */
-    private fillIndexArray(selectedControlChildren: number[]) {
-        let indexArray: { key: number; value: number }[] = [];
-        if (selectedControlChildren.length === 0) {
-            indexArray.push({ key: 0, value: 0 });
-        } else {
-            indexArray = selectedControlChildren.map((elem, index) => {
-                return { key: index + 1, value: elem + 1 };
-            });
-            indexArray.unshift({ key: 0, value: 0 });
-            indexArray.push({
-                key: selectedControlChildren.length + 1,
-                value: selectedControlChildren.length + 1
-            });
-        }
-        return indexArray;
-    }
-
     /**
      * Creates an addXML fragment command and pushes it to the command stack
      *
@@ -329,6 +258,13 @@ export default class AddFragment extends BaseDialog<AddFragmentModel> {
             return 'CUSTOM_ACTION';
         } else if (this.isObjectPageHeaderField(currentControlName, targetAggregation)) {
             return 'OBJECT_PAGE_HEADER_FIELD';
+        } else if (currentControlName === 'sap.ui.mdc.Table' && targetAggregation === 'columns') {
+            return 'V4_MDC_TABLE_COLUMN';
+        } else if (
+            [TREE_TABLE_TYPE, GRID_TABLE_TYPE, ANALYTICAL_TABLE_TYPE].includes(currentControlName) &&
+            targetAggregation === 'columns'
+        ) {
+            return 'ANALYTICAL_TABLE_COLUMN';
         } else if (currentControlName === 'sap.ui.mdc.ActionToolbar' && targetAggregation === 'actions') {
             return 'TABLE_ACTION';
         }

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

@@ -0,0 +1,179 @@
+'use strict';
+sap.ui.define([
+    'sap/ui/model/json/JSONModel',
+    'sap/ui/dt/OverlayRegistry',
+    'open/ux/preview/client/thirdparty/@sap-ux-private/control-property-editor-common',
+    '../../i18n',
+    '../../cpe/communication-service',
+    '../control-utils',
+    '../command-executor',
+    '../api-handler',
+    './BaseDialog.controller',
+    '../utils',
+    'sap/ui/core/library'
+], function (JSONModel, OverlayRegistry, ___sap_ux_private_control_property_editor_common, ____i18n, ____cpe_communication_service, __ControlUtils, __CommandExecutor, ___api_handler, __BaseDialog, ___utils, sap_ui_core_library) {
+    'use strict';
+    function _interopRequireDefault(obj) {
+        return obj && obj.__esModule && typeof obj.default !== 'undefined' ? obj.default : obj;
+    }
+    const setApplicationRequiresReload = ___sap_ux_private_control_property_editor_common['setApplicationRequiresReload'];
+    const getResourceModel = ____i18n['getResourceModel'];
+    const getTextBundle = ____i18n['getTextBundle'];
+    const CommunicationService = ____cpe_communication_service['CommunicationService'];
+    const ControlUtils = _interopRequireDefault(__ControlUtils);
+    const CommandExecutor = _interopRequireDefault(__CommandExecutor);
+    const getFragments = ___api_handler['getFragments'];
+    const BaseDialog = _interopRequireDefault(__BaseDialog);
+    const notifyUser = ___utils['notifyUser'];
+    const ValueState = sap_ui_core_library['ValueState'];
+    const radix = 10;
+    const COLUMNS_AGGREGATION = 'columns';
+    const ITEMS_AGGREGATION = 'items';
+    const CELLS_AGGREGATION = 'cells';
+    const AddTableColumnFragments = BaseDialog.extend('open.ux.preview.client.adp.controllers.AddTableColumnFragments', {
+        constructor: function _constructor(name, overlays, rta, options) {
+            BaseDialog.prototype.constructor.call(this, name);
+            this.options = options;
+            this.rta = rta;
+            this.overlays = overlays;
+            this.model = new JSONModel({ title: options.title });
+            this.ui5Version = sap.ui.version;
+            this.commandExecutor = new CommandExecutor(this.rta);
+        },
+        setup: async function _setup(dialog) {
+            this.dialog = dialog;
+            this.setEscapeHandler();
+            await this.buildDialogData();
+            const resourceModel = await getResourceModel('open.ux.preview.client');
+            this.dialog.setModel(resourceModel, 'i18n');
+            this.dialog.setModel(this.model);
+            this.dialog.open();
+        },
+        onCreateBtnPress: async function _onCreateBtnPress(event) {
+            const source = event.getSource();
+            source.setEnabled(false);
+            const columnFragmentName = this.model.getProperty('/newColumnFragmentName');
+            const cellFragmentName = this.model.getProperty('/newCellFragmentName');
+            const index = this.model.getProperty('/selectedIndex');
+            const fragmentData = {
+                index,
+                fragments: [
+                    {
+                        fragmentName: columnFragmentName,
+                        targetAggregation: this.model.getProperty('/selectedColumnsAggregation')
+                    },
+                    {
+                        fragmentName: cellFragmentName,
+                        targetAggregation: this.model.getProperty('/selectedItemsAggregation')
+                    }
+                ]
+            };
+            await this.createFragmentChange(fragmentData);
+            const textKey = 'ADP_ADD_TWO_FRAGMENTS_WITH_TEMPLATE_NOTIFICATION';
+            const bundle = await getTextBundle();
+            notifyUser(bundle.getText(textKey, fragmentData.fragments.map(item => item.fragmentName)), 8000);
+            this.handleDialogClose();
+        },
+        buildDialogData: async function _buildDialogData() {
+            const {controlMetadata, targetAggregation} = this.getControlMetadata();
+            const defaultAggregation = this.options.aggregation ?? controlMetadata.getDefaultAggregationName();
+            const selectedControlName = controlMetadata.getName();
+            let selectedControlChildren = Object.keys(ControlUtils.getControlAggregationByName(this.runtimeControl, defaultAggregation));
+            selectedControlChildren = selectedControlChildren.map(key => {
+                return parseInt(key, radix);
+            });
+            this.model.setProperty('/selectedControlName', selectedControlName);
+            const indexArray = this.fillIndexArray(selectedControlChildren);
+            if (!targetAggregation.includes(COLUMNS_AGGREGATION)) {
+                throw new Error(`Selected control does not have "${ COLUMNS_AGGREGATION }" aggregation`);
+            }
+            this.model.setProperty('/selectedColumnsAggregation', COLUMNS_AGGREGATION);
+            this.specialIndexHandling(COLUMNS_AGGREGATION);
+            if (!targetAggregation.includes(ITEMS_AGGREGATION)) {
+                throw new Error(`Selected control does not have "${ ITEMS_AGGREGATION }" aggregation`);
+            }
+            this.model.setProperty('/selectedItemsAggregation', ITEMS_AGGREGATION);
+            try {
+                const {fragments} = await getFragments();
+                this.model.setProperty('/fragmentList', fragments);
+            } catch (e) {
+                this.handleError(e);
+            }
+            this.model.setProperty('/index', indexArray);
+            this.model.setProperty('/selectedIndex', indexArray.length - 1);
+        },
+        updateFormState: function _updateFormState() {
+            const form = this.dialog.getContent()[0];
+            const formContent = form.getContent();
+            const inputs = formContent.filter(item => item.isA('sap.m.Input'));
+            const value1 = inputs[0].getValue();
+            const value2 = inputs[1].getValue();
+            if (value1 === value2 && value1.length) {
+                inputs.forEach(input => {
+                    if (input.getValueState() === ValueState.Success) {
+                        input.setValueState(ValueState.Error).setValueStateText('Duplicate name');
+                    }
+                });
+            } else {
+                inputs.forEach(input => {
+                    if (input.getValueState() === ValueState.Error && input.getValueStateText() === 'Duplicate name') {
+                        input.setValueState(ValueState.Success);
+                    }
+                });
+            }
+            const beginBtn = this.dialog.getBeginButton();
+            beginBtn.setEnabled(inputs.every(input => input.getValueState() === ValueState.Success));
+        },
+        onColumnFragmentNameInputChange: function _onColumnFragmentNameInputChange(event) {
+            BaseDialog.prototype.onFragmentNameInputChange.call(this, event);
+            const input = event.getSource();
+            let modelValue = input.getValue();
+            if (modelValue.length < 1) {
+                modelValue = null;
+            }
+            this.model.setProperty('/newColumnFragmentName', modelValue);
+            this.updateFormState();
+        },
+        onCellFragmentNameInputChange: function _onCellFragmentNameInputChange(event) {
+            BaseDialog.prototype.onFragmentNameInputChange.call(this, event);
+            const input = event.getSource();
+            let modelValue = input.getValue();
+            if (input.getValue().length < 1) {
+                modelValue = null;
+            }
+            this.model.setProperty('/newCellFragmentName', modelValue);
+            this.updateFormState();
+        },
+        createFragmentChange: async function _createFragmentChange(fragmentData) {
+            const {fragments, index} = fragmentData;
+            const flexSettings = this.rta.getFlexSettings();
+            const overlay = OverlayRegistry.getOverlay(this.runtimeControl);
+            const designMetadata = overlay.getDesignTimeMetadata();
+            const result = [];
+            const compositeCommand = await this.commandExecutor.createCompositeCommand(this.runtimeControl);
+            for (const fragment of fragments) {
+                const modifiedValue = {
+                    fragment: `<core:FragmentDefinition xmlns:core='sap.ui.core'></core:FragmentDefinition>`,
+                    fragmentPath: `fragments/${ fragment.fragmentName }.fragment.xml`,
+                    index: index ?? 0,
+                    targetAggregation: fragment.targetAggregation === ITEMS_AGGREGATION ? CELLS_AGGREGATION : fragment.targetAggregation
+                };
+                const targetObject = fragment.targetAggregation === COLUMNS_AGGREGATION ? this.runtimeControl : this.runtimeControl.getAggregation(ITEMS_AGGREGATION)[0];
+                const command = await this.commandExecutor.getCommand(targetObject, 'addXML', modifiedValue, designMetadata, flexSettings);
+                const templateName = fragment.targetAggregation === COLUMNS_AGGREGATION ? `V2_SMART_TABLE_COLUMN` : 'V2_SMART_TABLE_CELL';
+                const preparedChange = command.getPreparedChange();
+                const content = {
+                    ...preparedChange.getContent(),
+                    templateName
+                };
+                preparedChange.setContent(content);
+                compositeCommand.addCommand(command, false);
+                result.push(templateName);
+            }
+            await this.commandExecutor.pushAndExecuteCommand(compositeCommand);
+            CommunicationService.sendAction(setApplicationRequiresReload(true));
+            return result;
+        }
+    });
+    return AddTableColumnFragments;
+});