@openui5/sap.ui.rta 1.104.0 → 1.105.1

package/src/sap/ui/rta/util/changeVisualization/ChangeIndicatorRegistry.js

@@ -5,15 +5,25 @@
  */
 
 sap.ui.define([
-	"sap/ui/base/ManagedObject",
 	"sap/base/util/includes",
 	"sap/base/util/values",
-	"sap/base/util/restricted/_omit"
+	"sap/base/util/restricted/_omit",
+	"sap/base/Log",
+	"sap/ui/base/ManagedObject",
+	"sap/ui/core/util/reflection/JsControlTreeModifier",
+	"sap/ui/dt/ElementUtil",
+	"sap/ui/fl/write/api/ChangesWriteAPI",
+	"sap/ui/fl/Utils"
 ], function(
-	ManagedObject,
 	includes,
 	values,
-	_omit
+	_omit,
+	Log,
+	ManagedObject,
+	JsControlTreeModifier,
+	ElementUtil,
+	ChangesWriteAPI,
+	FlUtils
 ) {
 	"use strict";
 
@@ -25,7 +35,7 @@ sap.ui.define([
 	 * @alias sap.ui.rta.util.changeVisualization.ChangeIndicatorRegistry
 	 * @author SAP SE
 	 * @since 1.86.0
-	 * @version 1.104.0
+	 * @version 1.105.1
 	 * @private
 	 */
 	var ChangeIndicatorRegistry = ManagedObject.extend("sap.ui.rta.util.changeVisualization.ChangeIndicatorRegistry", {
@@ -37,12 +47,18 @@ sap.ui.define([
 				commandCategories: {
 					type: "object",
 					defaultValue: []
+				},
+				/**
+				 * Id of the component or control to visualize the changes for
+				 */
+				 rootControlId: {
+					type: "string"
 				}
 			}
 		},
 		constructor: function () {
 			ManagedObject.prototype.constructor.apply(this, arguments);
-			this._oChanges = {};
+			this._oChangeIndicatorData = {};
 			this._oChangeIndicators = {};
 		}
 	});
@@ -57,7 +73,7 @@ sap.ui.define([
 	 * @returns {object[]} Registered changes
 	 */
 	ChangeIndicatorRegistry.prototype.getChanges = function () {
-		return values(this._oChanges || {}).map(function (oChange) {
+		return values(this._oChangeIndicatorData || {}).map(function (oChange) {
 			return Object.assign({}, oChange);
 		});
 	};
@@ -68,7 +84,7 @@ sap.ui.define([
 	 * @returns {string[]} Promise with both design time and runtime change
 	 */
 	ChangeIndicatorRegistry.prototype.getChangeIds = function () {
-		return Object.keys(this._oChanges || {});
+		return Object.keys(this._oChangeIndicatorData || {});
 	};
 
 	/**
@@ -78,7 +94,7 @@ sap.ui.define([
 	 * @returns {object} Registered change
 	 */
 	ChangeIndicatorRegistry.prototype.getChange = function (sChangeId) {
-		return this._oChanges[sChangeId] && Object.assign({}, this._oChanges[sChangeId]);
+		return this._oChangeIndicatorData[sChangeId] && Object.assign({}, this._oChangeIndicatorData[sChangeId]);
 	};
 
 	/**
@@ -105,7 +121,7 @@ sap.ui.define([
 			));
 		}
 
-		values(this._oChanges).forEach(function (oChange) {
+		values(this._oChangeIndicatorData).forEach(function (oChange) {
 			oChange.visualizationInfo.displayElementIds.forEach(function (sSelectorId, iIndex) {
 				addSelector(sSelectorId, oChange.visualizationInfo.affectedElementIds[iIndex], oChange, false);
 			});
@@ -118,16 +134,6 @@ sap.ui.define([
 		return oChangeIndicators;
 	};
 
-	/**
-	 * Checks if the given element ID was registered as a change indicator.
-	 *
-	 * @param {string} sSelectorId - ID of the element to check
-	 * @returns {boolean} Whether the element was registered as an indicator
-	 */
-	ChangeIndicatorRegistry.prototype.hasChangeIndicator = function (sSelectorId) {
-		return !!this._oChangeIndicators[sSelectorId];
-	};
-
 	/**
 	 * Returns the registered change indicator for the given element ID.
 	 *
@@ -152,25 +158,83 @@ sap.ui.define([
 	 *
 	 * @param {object} oChange - The change to register
 	 * @param {string} sCommandName - Command name of the change
+	 * @returns {Promise<undefined>} Resolves as soon as the change is registered
 	 */
-	ChangeIndicatorRegistry.prototype.registerChange = function (oChange, sCommandName) {
-		var aCategories = this.getCommandCategories();
-		var oNewChangeInformation = {
-			change: oChange,
-			commandName: sCommandName,
-			commandCategory: Object.keys(aCategories).find(function (sCommandCategoryName) {
-				return includes(aCategories[sCommandCategoryName], sCommandName);
-			}),
-			visualizationInfo: {
-				affectedElementIds: [],
-				displayElementIds: [],
-				dependentElementIds: []
+	ChangeIndicatorRegistry.prototype.registerChange = function(oChange, sCommandName) {
+		var oAppComponent = FlUtils.getAppComponentForControl(ElementUtil.getElementInstance(this.getRootControlId()));
+		return getVisualizationInfo(oChange, oAppComponent).then(function(mChangeVisualizationInfo) {
+			var aCategories = this.getCommandCategories();
+			var sCommandCategory;
+			if (sCommandName === "settings" && includes(Object.keys(aCategories), mChangeVisualizationInfo.payload.category)) {
+				sCommandCategory = mChangeVisualizationInfo.payload.category;
+			} else {
+				sCommandCategory = Object.keys(aCategories).find(function (sCommandCategoryName) {
+					return includes(aCategories[sCommandCategoryName], sCommandName);
+				});
 			}
-		};
 
-		this._oChanges[oChange.getId()] = oNewChangeInformation;
+			this._oChangeIndicatorData[oChange.getId()] = {
+				change: oChange,
+				commandName: sCommandName,
+				commandCategory: sCommandCategory,
+				visualizationInfo: mChangeVisualizationInfo
+			};
+		}.bind(this));
 	};
 
+	function getVisualizationInfo(oChange, oAppComponent) {
+		function getSelectorIds(aSelectorList) {
+			if (!aSelectorList) {
+				return undefined;
+			}
+			return aSelectorList
+				.map(function(vSelector) {
+					var oElement = typeof vSelector.getId === "function"
+						? vSelector
+						: JsControlTreeModifier.bySelector(vSelector, oAppComponent);
+					return oElement && oElement.getId();
+				})
+				.filter(Boolean);
+		}
+
+		return getInfoFromChangeHandler(oAppComponent, oChange)
+			.then(function(oInfoFromChangeHandler) {
+				var mVisualizationInfo = oInfoFromChangeHandler || {};
+				var aAffectedElementIds = getSelectorIds(mVisualizationInfo.affectedControls || [oChange.getSelector()]);
+
+				return {
+					affectedElementIds: aAffectedElementIds,
+					dependentElementIds: getSelectorIds(mVisualizationInfo.dependentControls) || [],
+					displayElementIds: getSelectorIds(mVisualizationInfo.displayControls) || aAffectedElementIds,
+					payload: mVisualizationInfo.payload || {}
+				};
+			});
+	}
+
+	function getInfoFromChangeHandler(oAppComponent, oChange) {
+		var oControl = JsControlTreeModifier.bySelector(oChange.getSelector(), oAppComponent);
+		if (oControl) {
+			return ChangesWriteAPI.getChangeHandler({
+				changeType: oChange.getChangeType(),
+				element: oControl,
+				modifier: JsControlTreeModifier,
+				layer: oChange.getLayer()
+			})
+				.then(function(oChangeHandler) {
+					if (oChangeHandler && typeof oChangeHandler.getChangeVisualizationInfo === "function") {
+						return oChangeHandler.getChangeVisualizationInfo(oChange, oAppComponent);
+					}
+					return undefined;
+				})
+				.catch(function(vErr) {
+					Log.error(vErr);
+					return undefined;
+				});
+		}
+
+		return Promise.resolve();
+	}
+
 	/**
 	 * Adds a change indicator to the registry.
 	 *
@@ -181,30 +245,11 @@ sap.ui.define([
 		this._oChangeIndicators[sSelectorId] = oChangeIndicator;
 	};
 
-	/**
-	 * Adds selectors for a registered change.
-	 *
-	 * @param {string} sChangeId - ID of the registered change
-	 * @param {object} mVisualizationInfo - Map of selector IDs to register
-	 * @param {string[]} [mVisualizationInfo.affectedElementIds] - Array of affected element IDs
-	 * @param {string[]} [mVisualizationInfo.displayElementIds] - Array of element IDs that the indicators are attached to
-	 * @param {string[]} [mVisualizationInfo.dependentElementIds] - Array of element IDs that the dependent indicators are attached to
-	 * @param {object} [mVisualizationInfo.payload] - Command category specific visualization information
-	 */
-	ChangeIndicatorRegistry.prototype.addVisualizationInfo = function (sChangeId, mVisualizationInfo) {
-		var oChange = this._oChanges[sChangeId];
-		if (oChange === undefined) {
-			throw new Error("Change id is not registered");
-		}
-
-		oChange.visualizationInfo = Object.assign({}, oChange.visualizationInfo, mVisualizationInfo);
-	};
-
 	/**
 	 * Resets the change and change indicator registries.
 	 */
 	ChangeIndicatorRegistry.prototype.reset = function () {
-		Object.keys(this._oChanges).forEach(function (sKeyToRemove) {
+		Object.keys(this._oChangeIndicatorData).forEach(function (sKeyToRemove) {
 			this.removeChange(sKeyToRemove);
 		}.bind(this));
 
@@ -220,7 +265,7 @@ sap.ui.define([
 	 * @param {string} sChangeId - ID of the registered change
 	 */
 	ChangeIndicatorRegistry.prototype.removeChange = function (sChangeId) {
-		delete this._oChanges[sChangeId];
+		delete this._oChangeIndicatorData[sChangeId];
 	};
 
 	return ChangeIndicatorRegistry;

package/src/sap/ui/rta/util/changeVisualization/ChangeVisualization.js

@@ -8,14 +8,10 @@ sap.ui.define([
 	"sap/ui/core/Fragment",
 	"sap/base/util/restricted/_difference",
 	"sap/base/util/deepEqual",
-	"sap/base/Log",
 	"sap/ui/core/util/reflection/JsControlTreeModifier",
 	"sap/ui/core/Control",
 	"sap/ui/dt/OverlayRegistry",
-	"sap/ui/dt/OverlayUtil",
 	"sap/ui/dt/ElementUtil",
-	"sap/ui/fl/apply/_internal/changes/Utils",
-	"sap/ui/fl/write/api/ChangesWriteAPI",
 	"sap/ui/fl/write/api/PersistenceWriteAPI",
 	"sap/ui/fl/Layer",
 	"sap/ui/fl/Utils",
@@ -27,14 +23,10 @@ sap.ui.define([
 	Fragment,
 	difference,
 	deepEqual,
-	Log,
 	JsControlTreeModifier,
 	Control,
 	OverlayRegistry,
-	OverlayUtil,
 	ElementUtil,
-	ChangesUtils,
-	ChangesWriteAPI,
 	PersistenceWriteAPI,
 	Layer,
 	FlUtils,
@@ -95,7 +87,7 @@ sap.ui.define([
 	 * @alias sap.ui.rta.util.changeVisualization.ChangeVisualization
 	 * @author SAP SE
 	 * @since 1.84.0
-	 * @version 1.104.0
+	 * @version 1.105.1
 	 * @private
 	 */
 	var ChangeVisualization = Control.extend("sap.ui.rta.util.changeVisualization.ChangeVisualization", {
@@ -124,11 +116,12 @@ sap.ui.define([
 			}
 		},
 		constructor: function() {
-			Control.prototype.constructor.apply(this, arguments);
-
 			this._oChangeIndicatorRegistry = new ChangeIndicatorRegistry({
 				commandCategories: VALID_COMMANDS
 			});
+
+			Control.prototype.constructor.apply(this, arguments);
+
 			this._oTextBundle = sap.ui.getCore().getLibraryResourceBundle("sap.ui.rta");
 			this.setModel(new ResourceModel({
 				bundle: this._oTextBundle
@@ -151,6 +144,7 @@ sap.ui.define([
 			this._reset();
 		}
 		this.setProperty("rootControlId", sRootControlId);
+		this._oChangeIndicatorRegistry.setRootControlId(sRootControlId);
 	};
 
 	ChangeVisualization.prototype._getComponent = function() {
@@ -276,15 +270,12 @@ sap.ui.define([
 	 */
 	ChangeVisualization.prototype.onCommandCategorySelection = function(oEvent) {
 		var sSelectedCommandCategory = oEvent.getSource().getBindingContext("visualizationModel").getObject().key;
-		return this._selectCommandCategory(sSelectedCommandCategory);
+		this._selectCommandCategory(sSelectedCommandCategory);
 	};
 
 	ChangeVisualization.prototype._selectCommandCategory = function(sSelectedCommandCategory) {
 		this._sSelectedCommandCategory = sSelectedCommandCategory;
 
-		var aRegisteredChanges = this._oChangeIndicatorRegistry.getChanges();
-		var aRelevantChanges = this._getChangesForCommandCategory(sSelectedCommandCategory, aRegisteredChanges);
-
 		var sCommandCategoryText = this._getCommandCategoryButton(sSelectedCommandCategory);
 
 		this._updateVisualizationModel({
@@ -292,52 +283,8 @@ sap.ui.define([
 			commandCategoryText: sCommandCategoryText
 		});
 
-		return Promise.all(aRelevantChanges.map(function(oChange) {
-			return this._getVisualizationInfo(oChange)
-				.then(function(mVisualizationInfo) {
-					this._oChangeIndicatorRegistry.addVisualizationInfo(
-						oChange.change.getId(),
-						mVisualizationInfo
-					);
-				}.bind(this));
-		}.bind(this)))
-			.then(function() {
-				this._updateChangeIndicators();
-				this._setFocusedIndicator();
-			}.bind(this));
-	};
-
-	ChangeVisualization.prototype._getVisualizationInfo = function(mChangeInformation) {
-		var oComponent = this._getComponent();
-
-		function getSelectorIds(aSelectorList) {
-			if (!aSelectorList) {
-				return undefined;
-			}
-			return aSelectorList
-				.map(function(vSelector) {
-					var oElement = typeof vSelector.getId === "function"
-						? vSelector
-						: JsControlTreeModifier.bySelector(vSelector, oComponent);
-					return oElement && oElement.getId();
-				})
-				.filter(Boolean);
-		}
-
-		return this._getInfoFromChangeHandler(oComponent, mChangeInformation.change)
-			.then(function(oInfoFromChangeHandler) {
-				var mVisualizationInfo = oInfoFromChangeHandler || {};
-				var aAffectedElementIds = (
-					getSelectorIds(mVisualizationInfo.affectedControls || [mChangeInformation.change.getSelector()])
-				);
-
-				return {
-					affectedElementIds: aAffectedElementIds,
-					dependentElementIds: getSelectorIds(mVisualizationInfo.dependentControls) || [],
-					displayElementIds: getSelectorIds(mVisualizationInfo.displayControls) || aAffectedElementIds,
-					payload: mVisualizationInfo.payload
-				};
-			});
+		this._updateChangeIndicators();
+		this._setFocusedIndicator();
 	};
 
 	ChangeVisualization.prototype._getCommandForChange = function(oChange) {
@@ -384,36 +331,6 @@ sap.ui.define([
 			&& searchForCommand(OverlayRegistry.getOverlay(oLastDependentSelectorControl));
 	};
 
-	ChangeVisualization.prototype._getInfoFromChangeHandler = function(oAppComponent, oChange) {
-		var oControl = JsControlTreeModifier.bySelector(oChange.getSelector(), oAppComponent);
-		if (oControl) {
-			var mPropertyBag = {
-				modifier: JsControlTreeModifier,
-				appComponent: oAppComponent,
-				view: FlUtils.getViewForControl(oControl)
-			};
-			var mControl = ChangesUtils.getControlIfTemplateAffected(oChange, oControl, mPropertyBag);
-			return ChangesWriteAPI.getChangeHandler({
-				changeType: oChange.getChangeType(),
-				element: mControl.control,
-				modifier: JsControlTreeModifier,
-				layer: oChange.getLayer()
-			})
-				.then(function(oChangeHandler) {
-					if (oChangeHandler && typeof oChangeHandler.getChangeVisualizationInfo === "function") {
-						return oChangeHandler.getChangeVisualizationInfo(oChange, oAppComponent);
-					}
-					return undefined;
-				})
-				.catch(function(vErr) {
-					Log.error(vErr);
-					return undefined;
-				});
-		}
-
-		return Promise.resolve();
-	};
-
 	ChangeVisualization.prototype._collectChanges = function() {
 		var oComponent = this._getComponent();
 		var mPropertyBag = {
@@ -432,7 +349,7 @@ sap.ui.define([
 			var aRegisteredChangeIds = this._oChangeIndicatorRegistry.getChangeIds();
 			var oCurrentChanges = aChanges
 				.filter(function(oChange) {
-					return oChange.getFileType() === 'change';
+					return oChange.getFileType() === "change";
 				})
 				.reduce(function(oChanges, oChange) {
 					oChanges[oChange.getId()] = oChange;
@@ -445,12 +362,14 @@ sap.ui.define([
 				this._oChangeIndicatorRegistry.removeChange(sChangeIdToRemove);
 			}.bind(this));
 
+			var aPromises = [];
 			// Register missing changes
 			difference(aCurrentChangeIds, aRegisteredChangeIds).forEach(function(sChangeIdToAdd) {
 				var oChangeToAdd = oCurrentChanges[sChangeIdToAdd];
 				var sCommandName = this._getCommandForChange(oChangeToAdd);
-				this._oChangeIndicatorRegistry.registerChange(oChangeToAdd, sCommandName);
+				aPromises.push(this._oChangeIndicatorRegistry.registerChange(oChangeToAdd, sCommandName));
 			}.bind(this));
+			return Promise.all(aPromises);
 		}.bind(this));
 	};
 
@@ -541,18 +460,19 @@ sap.ui.define([
 		}
 	};
 
-	ChangeVisualization.prototype._filterRelevantChanges = function(aChanges) {
-		if (!Array.isArray(aChanges)) {
-			return aChanges;
+	ChangeVisualization.prototype._filterRelevantChanges = function(aChangeVizInfo) {
+		if (!Array.isArray(aChangeVizInfo)) {
+			return aChangeVizInfo;
 		}
 		var oRootData = this._oChangeVisualizationModel.getData();
 
-		return aChanges.filter(function(oChange) {
+		return aChangeVizInfo.filter(function(oChangeVizInfo) {
 			return (
-				!oChange.dependent
+				!oChangeVizInfo.dependent
+				&& oChangeVizInfo.commandCategory
 				&& (
-					oRootData.commandCategory === 'all'
-					|| oRootData.commandCategory === oChange.commandCategory
+					oRootData.commandCategory === CATEGORY_ALL
+					|| oRootData.commandCategory === oChangeVizInfo.commandCategory
 				)
 			);
 		});
@@ -641,8 +561,8 @@ sap.ui.define([
 		this.setIsActive(true);
 		// show all change visualizations at startup
 		this._updateChangeRegistry()
-			.then(this._selectCommandCategory.bind(this, this._sSelectedCommandCategory))
 			.then(function() {
+				this._selectCommandCategory(this._sSelectedCommandCategory);
 				this._updateVisualizationModelMenuData();
 				oToolbar.setModel(this._oChangeVisualizationModel, "visualizationModel");
 			}.bind(this));

package/src/sap/ui/rta/util/changeVisualization/ChangeVisualizationUtils.js

@@ -1,5 +1,5 @@
-/*
- * ! OpenUI5
+/*!
+ * OpenUI5
  * (c) Copyright 2009-2022 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */

package/src/sap/ui/rta/util/changeVisualization/categories/CombineVisualization.js

@@ -1,5 +1,5 @@
-/*
- * ! OpenUI5
+/*!
+ * OpenUI5
  * (c) Copyright 2009-2022 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */

package/src/sap/ui/rta/util/changeVisualization/categories/MoveVisualization.js

@@ -1,5 +1,5 @@
-/*
- * ! OpenUI5
+/*!
+ * OpenUI5
  * (c) Copyright 2009-2022 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
@@ -41,8 +41,8 @@ sap.ui.define([
 
 		if (sSourceParentId !== sTargetParentId) {
 			sDescriptionText = oRtaResourceBundle.getText("TXT_CHANGEVISUALIZATION_CHANGE_MOVE", ChangeVisualizationUtils.shortenString(sLabel));
+			sDescriptionTooltip = (sSourceParentId && oRtaResourceBundle.getText("TXT_CHANGEVISUALIZATION_CHANGE_MOVE", sLabel)) || "";
 			sButtonText = sSourceParentId && oRtaResourceBundle.getText("BTN_CHANGEVISUALIZATION_SHOW_DEPENDENT_CONTAINER_MOVE");
-			sDescriptionTooltip = sSourceParentId && oRtaResourceBundle.getText("TXT_CHANGEVISUALIZATION_CHANGE_MOVE", sLabel);
 		}
 		return { descriptionText: sDescriptionText, descriptionTooltip: sDescriptionTooltip, buttonText: sButtonText };
 	};

package/src/sap/ui/rta/util/changeVisualization/categories/RenameVisualization.js

@@ -1,5 +1,5 @@
-/*
- * ! OpenUI5
+/*!
+ * OpenUI5
  * (c) Copyright 2009-2022 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */

package/src/sap/ui/rta/util/changeVisualization/categories/SplitVisualization.js

@@ -1,5 +1,5 @@
-/*
- * ! OpenUI5
+/*!
+ * OpenUI5
  * (c) Copyright 2009-2022 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */

package/src/sap/ui/rta/util/changeVisualization/categories/getVisualizationCategory.js

@@ -1,5 +1,5 @@
-/*
- * ! OpenUI5
+/*!
+ * OpenUI5
  * (c) Copyright 2009-2022 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
@@ -24,7 +24,12 @@ sap.ui.define([
 		split: SplitVisualization
 	};
 
-	return function(sCategoryName) {
+	return function(mIndicatorInformation) {
+		var sCategoryName = mIndicatorInformation.commandName;
+		// to enable e.g. move changes in settings commands to show the 'Show Source' button
+		if (sCategoryName === "settings") {
+			sCategoryName = mIndicatorInformation.commandCategory;
+		}
 		return mCategories[sCategoryName];
 	};
 });