@sap/ux-ui5-tooling 1.20.4 → 1.22.0

package/dist/preview-middleware/dist/client/adp/control-utils.js

@@ -0,0 +1,46 @@
+"use strict";
+
+sap.ui.define([], function () {
+  "use strict";
+
+  /**
+   * Handles calling control specific functions for retrieving control data
+   */
+  class ControlUtils {
+    /**
+     * Returns ManagedObject runtime control
+     *
+     * @param overlayControl Overlay
+     * @returns {ManagedObject} Managed Object instance
+     */
+    static getRuntimeControl(overlayControl) {
+      let runtimeControl;
+      if (overlayControl.getElementInstance) {
+        runtimeControl = overlayControl.getElementInstance();
+      } else {
+        runtimeControl = overlayControl.getElement();
+      }
+      return runtimeControl;
+    }
+
+    /**
+     * Returns control aggregation names in an array
+     *
+     * @param control Managed Object runtime control
+     * @param name Aggregation name
+     * @returns Array of control aggregations
+     */
+    static getControlAggregationByName(control, name) {
+      let result = [];
+      const aggregation = (control ? control.getMetadata().getAllAggregations() : {})[name];
+      if (aggregation) {
+        // This executes a _sGetter function that can vary from control to control (_sGetter can be: getContent, getItems, etc)
+        const names = aggregation._sGetter && control[aggregation._sGetter]() || [];
+        result = Array.isArray(names) ? names : [names];
+      }
+      return result;
+    }
+  }
+  return ControlUtils;
+});
+//# sourceMappingURL=control-utils.js.map

package/dist/preview-middleware/dist/client/adp/control-utils.ts

@@ -0,0 +1,48 @@
+import type ElementOverlay from 'sap/ui/dt/ElementOverlay';
+import type ManagedObject from 'sap/ui/base/ManagedObject';
+
+/**
+ * Handles calling control specific functions for retrieving control data
+ */
+export default class ControlUtils {
+    /**
+     * Returns ManagedObject runtime control
+     *
+     * @param overlayControl Overlay
+     * @returns {ManagedObject} Managed Object instance
+     */
+    public static getRuntimeControl(overlayControl: ElementOverlay): ManagedObject {
+        let runtimeControl;
+        if (overlayControl.getElementInstance) {
+            runtimeControl = overlayControl.getElementInstance();
+        } else {
+            runtimeControl = overlayControl.getElement();
+        }
+        return runtimeControl;
+    }
+
+    /**
+     * Returns control aggregation names in an array
+     *
+     * @param control Managed Object runtime control
+     * @param name Aggregation name
+     * @returns Array of control aggregations
+     */
+    public static getControlAggregationByName(control: ManagedObject, name: string): unknown[] {
+        let result: unknown[] = [];
+        const aggregation = (control ? control.getMetadata().getAllAggregations() : {})[name] as unknown as object & {
+            _sGetter: string;
+        };
+
+        if (aggregation) {
+            // This executes a _sGetter function that can vary from control to control (_sGetter can be: getContent, getItems, etc)
+            const names =
+                (aggregation._sGetter &&
+                    (control as ManagedObject & { [key: string]: () => unknown })[aggregation._sGetter]()) ||
+                [];
+
+            result = Array.isArray(names) ? names : [names];
+        }
+        return result;
+    }
+}

package/dist/preview-middleware/dist/client/adp/controllers/AddActionFragment.controller.js

@@ -0,0 +1,198 @@
+"use strict";
+
+sap.ui.define(["./BaseDialog.controller", "sap/ui/model/json/JSONModel", "../../i18n", "open/ux/preview/client/thirdparty/@sap-ux-private/control-property-editor-common", "../../utils/info-center-message", "../command-executor", "../../utils/error", "sap/ui/core/library"], function (__BaseDialog, JSONModel, ____i18n, ___sap_ux_private_control_property_editor_common, ____utils_info_center_message, __CommandExecutor, ____utils_error, sap_ui_core_library) {
+  "use strict";
+
+  function _interopRequireDefault(obj) {
+    return obj && obj.__esModule && typeof obj.default !== "undefined" ? obj.default : obj;
+  }
+  const BaseDialog = _interopRequireDefault(__BaseDialog);
+  const getResourceModel = ____i18n["getResourceModel"];
+  const getTextBundle = ____i18n["getTextBundle"];
+  const MessageBarType = ___sap_ux_private_control_property_editor_common["MessageBarType"];
+  const sendInfoCenterMessage = ____utils_info_center_message["sendInfoCenterMessage"];
+  const CommandExecutor = _interopRequireDefault(__CommandExecutor);
+  const getError = ____utils_error["getError"];
+  const ValueState = sap_ui_core_library["ValueState"];
+  /**
+   * Validates Action ID input.
+   *
+   * @param input control of action ID to validate
+   * @param resource text bundle for messages
+   * @param validateForDuplicateId custom validation function
+   * @return validation result
+   */
+  function validateActionId(input, resource, validateForDuplicateId) {
+    const actionId = input.getValue();
+    // Check if empty
+    if (!actionId || actionId.trim().length === 0) {
+      return {
+        isValid: false,
+        errorMessage: resource.getText('ACTION_ID_REQUIRED')
+      };
+    }
+    if (typeof validateForDuplicateId === 'function' && !validateForDuplicateId(actionId)) {
+      return {
+        isValid: false,
+        errorMessage: resource.getText('ACTION_WITH_GIVEN_ID_ALREADY_EXISTS', [actionId])
+      };
+    }
+
+    // Check starts and only allowed characters
+    if (!/(^([A-Za-z_][-A-Za-z0-9_.:]*)$)/.test(actionId)) {
+      return {
+        isValid: false,
+        errorMessage: resource.getText('ID_INVALID_FORMAT', ['Action'])
+      };
+    }
+    return {
+      isValid: true,
+      errorMessage: ''
+    };
+  }
+  const AddActionFragment = BaseDialog.extend("src.adp.controllers.AddActionFragment", {
+    constructor: function _constructor(name, overlays, rta, options, telemetryData) {
+      BaseDialog.prototype.constructor.call(this, name, telemetryData);
+      this.options = options;
+      this.rta = rta;
+      this.overlays = overlays;
+      this.model = new JSONModel({
+        title: options.title
+      });
+      this.commandExecutor = new CommandExecutor(this.rta);
+    },
+    /**
+     * Setups the Dialog and the JSON Model
+     *
+     * @param {Dialog} dialog - Dialog instance
+     */
+    setup: async function _setup(dialog) {
+      this.dialog = dialog;
+      this.setEscapeHandler();
+      this.bundle = await getTextBundle();
+      await this.buildDialogData();
+      const resourceModel = await getResourceModel('open.ux.preview.client');
+      this.dialog.setModel(resourceModel, 'i18n');
+      this.dialog.setModel(this.model);
+      this.dialog.open();
+    },
+    /**
+     * Handles create button press
+     *
+     * @param event Event
+     */
+    onCreateBtnPress: async function _onCreateBtnPress(event) {
+      const source = event.getSource();
+      source.setEnabled(false);
+      await BaseDialog.prototype.onCreateBtnPressHandler.call(this);
+      const actionId = this.model.getProperty('/actionId');
+      const buttonText = this.model.getProperty('/buttonText');
+      await this.createAppDescriptorChangeForV4(`${this.options.propertyPath}${actionId}`, buttonText);
+      this.handleDialogClose();
+    },
+    /**
+     * Builds data that is used in the dialog
+     */
+    buildDialogData: async function _buildDialogData() {
+      try {
+        let hasController = false;
+        if (this.options.controllerReference) {
+          this.model.setProperty('/handlerReference', this.options.controllerReference);
+          hasController = true;
+        }
+        this.model.setProperty('/hasController', hasController);
+      } catch (e) {
+        const error = getError(e);
+        await sendInfoCenterMessage({
+          title: {
+            key: 'ADP_GET_FRAGMENTS_FAILURE_TITLE'
+          },
+          description: error.message,
+          type: MessageBarType.error
+        });
+        throw error;
+      }
+    },
+    /**
+     * Checks input values for duplicates and updates confirmation button state based on input validation states
+     */
+    updateFormState: function _updateFormState() {
+      const form = this.dialog.getContent()[0];
+      const formContent = form.getContent();
+      const inputs = formContent.filter(item => item.isA('sap.m.Input'));
+      const beginBtn = this.dialog.getBeginButton();
+      // Exclude the last input (display-only) from validation
+      // Only validate inputs that are visible and editable
+      const validatableInputs = inputs.filter(input => input.getVisible() && input.getEditable());
+      beginBtn.setEnabled(validatableInputs.every(input => input.getValueState() === ValueState.Success));
+    },
+    /**
+     * Handles action id input change
+     *
+     * @param event Event
+     */
+    onActionIdInputChange: function _onActionIdInputChange(event) {
+      // update model value
+      const input = event.getSource();
+      let modelValue = input.getValue();
+      if (modelValue.length < 1) {
+        modelValue = null;
+      }
+      this.model.setProperty('/actionId', modelValue);
+      const result = validateActionId(input, this.bundle, this.options.validateActionId);
+      if (result.isValid) {
+        input.setValueState(ValueState.Success).setValueStateText('');
+      } else {
+        input.setValueState(ValueState.Error).setValueStateText(result.errorMessage);
+      }
+      this.updateFormState();
+    },
+    onButtonTextInputChange: function _onButtonTextInputChange(event) {
+      // update model value
+      const input = event.getSource();
+      let modelValue = input.getValue();
+      if (modelValue.length < 1) {
+        modelValue = null;
+      }
+      this.model.setProperty('/buttonText', modelValue);
+      if (modelValue && modelValue.length > 0) {
+        input.setValueState(ValueState.Success).setValueStateText('');
+      } else {
+        input.setValueState(ValueState.Error).setValueStateText(this.bundle.getText('BUTTON_TEXT_REQUIRED'));
+      }
+      this.updateFormState();
+    },
+    createAppDescriptorChangeForV4: async function _createAppDescriptorChangeForV(propertyPath, actionLabel) {
+      const flexSettings = this.rta.getFlexSettings();
+      const modifiedValue = {
+        reference: this.options.appDescriptor?.projectId,
+        appComponent: this.options.appDescriptor?.appComponent,
+        changeType: 'appdescr_fe_changePageConfiguration',
+        parameters: {
+          page: this.options.appDescriptor?.pageId,
+          entityPropertyChange: {
+            propertyPath: `${propertyPath}`,
+            // e.g. 'content/body/sections/test'
+            operation: 'UPSERT',
+            propertyValue: {
+              press: this.options.controllerReference,
+              visible: true,
+              enabled: true,
+              text: actionLabel,
+              ...(this.options.actionType === 'tableAction' ? {
+                requiresSelection: false
+              } : {}),
+              ...(this.options.position && {
+                position: this.options.position
+              })
+            }
+          }
+        }
+      };
+      const command = await this.commandExecutor.getCommand(this.getRuntimeControl(), 'appDescriptor', modifiedValue, flexSettings);
+      await this.commandExecutor.pushAndExecuteCommand(command);
+    }
+  });
+  return AddActionFragment;
+});
+//# sourceMappingURL=AddActionFragment.controller.js.map

package/dist/preview-middleware/dist/client/adp/controllers/AddActionFragment.controller.ts

@@ -0,0 +1,232 @@
+import RuntimeAuthoring from 'sap/ui/rta/RuntimeAuthoring';
+import { PageDescriptorV4 } from './types';
+import UI5Element from 'sap/ui/core/Element';
+import BaseDialog from './BaseDialog.controller';
+import { QuickActionTelemetryData } from '../../cpe/quick-actions/quick-action-definition';
+import JSONModel from 'sap/ui/model/json/JSONModel';
+import Dialog from 'sap/m/Dialog';
+import { getResourceModel, getTextBundle, TextBundle } from '../../i18n';
+import { MessageBarType } from '@sap-ux-private/control-property-editor-common';
+import Button from 'sap/m/Button';
+import { sendInfoCenterMessage } from '../../utils/info-center-message';
+import Input from 'sap/m/Input';
+import CommandExecutor from '../command-executor';
+import Event from 'sap/ui/base/Event';
+import { getError } from '../../utils/error';
+import { ValueState } from 'sap/ui/core/library';
+import FlexCommand from 'sap/ui/rta/command/FlexCommand';
+import SimpleForm from 'sap/ui/layout/form';
+import Control from 'sap/ui/core/Control';
+
+type AddActionFragmentsModel = JSONModel & {
+    getProperty(sPath: '/title'): string;
+    getProperty(sPath: '/buttonText'): string;
+    getProperty(sPath: '/actionId'): string;
+    getProperty(sPath: '/handlerReference'): string;
+    getProperty(sPath: '/hasController'): boolean;
+};
+
+export interface AddActionOptions {
+    name: string;
+    propertyPath: string;
+    actionType: 'pageAction' | 'tableAction';
+    title: string;
+    controllerReference: string;
+    appDescriptor?: PageDescriptorV4;
+    validateActionId?: (actionId: string) => boolean;
+    position?: {
+        placement: 'Before' | 'After';
+        anchor: string;
+    };
+}
+
+/**
+ * Validates Action ID input.
+ *
+ * @param input control of action ID to validate
+ * @param resource text bundle for messages
+ * @param validateForDuplicateId custom validation function
+ * @return validation result
+ */
+function validateActionId(
+    input: Input,
+    resource: TextBundle,
+    validateForDuplicateId?: (actionId: string) => boolean
+): { isValid: boolean; errorMessage: string } {
+    const actionId = input.getValue();
+    // Check if empty
+    if (!actionId || actionId.trim().length === 0) {
+        return { isValid: false, errorMessage: resource.getText('ACTION_ID_REQUIRED') };
+    }
+
+    if (typeof validateForDuplicateId === 'function' && !validateForDuplicateId(actionId)) {
+        return { isValid: false, errorMessage: resource.getText('ACTION_WITH_GIVEN_ID_ALREADY_EXISTS', [actionId]) };
+    }
+
+    // Check starts and only allowed characters
+    if (!/(^([A-Za-z_][-A-Za-z0-9_.:]*)$)/.test(actionId)) {
+        return { isValid: false, errorMessage: resource.getText('ID_INVALID_FORMAT', ['Action']) };
+    }
+    return { isValid: true, errorMessage: '' };
+}
+
+export default class AddActionFragment extends BaseDialog<AddActionFragmentsModel> {
+    private bundle: TextBundle;
+    constructor(
+        name: string,
+        overlays: UI5Element,
+        rta: RuntimeAuthoring,
+        readonly options: AddActionOptions,
+        telemetryData?: QuickActionTelemetryData
+    ) {
+        super(name, telemetryData);
+        this.rta = rta;
+        this.overlays = overlays;
+        this.model = new JSONModel({
+            title: options.title
+        });
+        this.commandExecutor = new CommandExecutor(this.rta);
+    }
+
+    /**
+     * Setups the Dialog and the JSON Model
+     *
+     * @param {Dialog} dialog - Dialog instance
+     */
+    async setup(dialog: Dialog): Promise<void> {
+        this.dialog = dialog;
+
+        this.setEscapeHandler();
+        this.bundle = await getTextBundle();
+        await this.buildDialogData();
+        const resourceModel = await getResourceModel('open.ux.preview.client');
+
+        this.dialog.setModel(resourceModel, 'i18n');
+        this.dialog.setModel(this.model);
+
+        this.dialog.open();
+    }
+
+    /**
+     * Handles create button press
+     *
+     * @param event Event
+     */
+    async onCreateBtnPress(event: Event) {
+        const source = event.getSource<Button>();
+        source.setEnabled(false);
+        await super.onCreateBtnPressHandler();
+
+        const actionId = this.model.getProperty('/actionId');
+        const buttonText = this.model.getProperty('/buttonText');
+        await this.createAppDescriptorChangeForV4(`${this.options.propertyPath}${actionId}`, buttonText);
+        this.handleDialogClose();
+    }
+
+    /**
+     * Builds data that is used in the dialog
+     */
+    async buildDialogData(): Promise<void> {
+        try {
+            let hasController = false;
+            if (this.options.controllerReference) {
+                this.model.setProperty('/handlerReference', this.options.controllerReference);
+                hasController = true;
+            }
+            this.model.setProperty('/hasController', hasController);
+        } catch (e) {
+            const error = getError(e);
+            await sendInfoCenterMessage({
+                title: { key: 'ADP_GET_FRAGMENTS_FAILURE_TITLE' },
+                description: error.message,
+                type: MessageBarType.error
+            });
+            throw error;
+        }
+    }
+
+    /**
+     * Checks input values for duplicates and updates confirmation button state based on input validation states
+     */
+    private updateFormState(): void {
+        const form = this.dialog.getContent()[0] as unknown as SimpleForm<Control[]>;
+        const formContent = form.getContent();
+        const inputs = formContent.filter((item) => item.isA('sap.m.Input')) as Input[];
+
+        const beginBtn = this.dialog.getBeginButton();
+        // Exclude the last input (display-only) from validation
+        // Only validate inputs that are visible and editable
+        const validatableInputs = inputs.filter((input) => input.getVisible() && input.getEditable());
+        beginBtn.setEnabled(validatableInputs.every((input) => input.getValueState() === ValueState.Success));
+    }
+
+    /**
+     * Handles action id input change
+     *
+     * @param event Event
+     */
+    onActionIdInputChange(event: Event): void {
+        // update model value
+        const input = event.getSource<Input>();
+        let modelValue: string | null = input.getValue();
+        if (modelValue.length < 1) {
+            modelValue = null;
+        }
+        this.model.setProperty('/actionId', modelValue);
+        const result = validateActionId(input, this.bundle, this.options.validateActionId);
+        if (result.isValid) {
+            input.setValueState(ValueState.Success).setValueStateText('');
+        } else {
+            input.setValueState(ValueState.Error).setValueStateText(result.errorMessage);
+        }
+        this.updateFormState();
+    }
+
+    onButtonTextInputChange(event: Event): void {
+        // update model value
+        const input = event.getSource<Input>();
+        let modelValue: string | null = input.getValue();
+        if (modelValue.length < 1) {
+            modelValue = null;
+        }
+        this.model.setProperty('/buttonText', modelValue);
+        if (modelValue && modelValue.length > 0) {
+            input.setValueState(ValueState.Success).setValueStateText('');
+        } else {
+            input.setValueState(ValueState.Error).setValueStateText(this.bundle.getText('BUTTON_TEXT_REQUIRED'));
+        }
+        this.updateFormState();
+    }
+
+    private async createAppDescriptorChangeForV4(propertyPath: string, actionLabel: string) {
+        const flexSettings = this.rta.getFlexSettings();
+        const modifiedValue = {
+            reference: this.options.appDescriptor?.projectId,
+            appComponent: this.options.appDescriptor?.appComponent,
+            changeType: 'appdescr_fe_changePageConfiguration',
+            parameters: {
+                page: this.options.appDescriptor?.pageId,
+                entityPropertyChange: {
+                    propertyPath: `${propertyPath}`, // e.g. 'content/body/sections/test'
+                    operation: 'UPSERT',
+                    propertyValue: {
+                        press: this.options.controllerReference,
+                        visible: true,
+                        enabled: true,
+                        text: actionLabel,
+                        ...(this.options.actionType === 'tableAction' ? { requiresSelection: false } : {}),
+                        ...(this.options.position && { position: this.options.position })
+                    }
+                }
+            }
+        };
+        const command = await this.commandExecutor.getCommand<FlexCommand>(
+            this.getRuntimeControl(),
+            'appDescriptor',
+            modifiedValue,
+            flexSettings
+        );
+
+        await this.commandExecutor.pushAndExecuteCommand(command);
+    }
+}