@openui5/sap.ui.rta 1.107.0 → 1.108.0

package/src/sap/ui/rta/util/ServiceEventBus.js

@@ -19,7 +19,7 @@ function(
 	 *
 	 * @extends sap.ui.core.EventBus
 	 * @author SAP SE
-	 * @version 1.107.0
+	 * @version 1.108.0
 	 * @private
 	 * @since 1.56.0
 	 * @alias sap.ui.rta.util.ServiceEventBus

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

@@ -40,7 +40,7 @@ sap.ui.define([
 	 * @alias sap.ui.rta.util.changeVisualization.ChangeIndicator
 	 * @author SAP SE
 	 * @since 1.84.0
-	 * @version 1.107.0
+	 * @version 1.108.0
 	 * @private
 	 */
 	var ChangeIndicator = Control.extend("sap.ui.rta.util.changeVisualization.ChangeIndicator", {

package/src/sap/ui/rta/util/changeVisualization/ChangeIndicatorCategorySelection.fragment.xml

@@ -5,6 +5,22 @@
 	<Popover
 		showHeader="false"
 		placement="Bottom">
+		<SegmentedButton selectedKey="satellite" width="420px" selectionChange=".onVersioningCategoryChange">
+			<items>
+				<SegmentedButtonItem 
+					text="{i18n>BUT_CHANGEVISUALIZATION_VERSIONING_ALL}" 
+					key="all"/>
+				<SegmentedButtonItem 
+					text="{i18n>BUT_CHANGEVISUALIZATION_VERSIONING_DRAFT}" 
+					key="draft" 
+					visible="{visualizationModel>/versioningAvailable}" 
+					enabled="{= ${visualizationModel>/hasDraftChanges} ||  ${visualizationModel>/hasDirtyChanges}}"/>
+				<SegmentedButtonItem 
+					text="{i18n>BUT_CHANGEVISUALIZATION_VERSIONING_DIRTY}"
+					key="dirty" 
+					enabled="{visualizationModel>/hasDirtyChanges}"/>
+			</items>
+		</SegmentedButton>
 		<MessageStrip
 			text="{visualizationModel>/popupInfoMessage}"
 			type="Information"

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

@@ -14,7 +14,8 @@ sap.ui.define([
 	"sap/ui/dt/ElementUtil",
 	"sap/ui/fl/write/api/ChangesWriteAPI",
 	"sap/ui/fl/Utils",
-	"sap/ui/fl/changeHandler/common/ChangeCategories"
+	"sap/ui/fl/changeHandler/common/ChangeCategories",
+	"sap/ui/rta/util/changeVisualization/ChangeStates"
 ], function(
 	includes,
 	values,
@@ -25,7 +26,8 @@ sap.ui.define([
 	ElementUtil,
 	ChangesWriteAPI,
 	FlUtils,
-	ChangeCategories
+	ChangeCategories,
+	ChangeStates
 ) {
 	"use strict";
 
@@ -37,7 +39,7 @@ sap.ui.define([
 	 * @alias sap.ui.rta.util.changeVisualization.ChangeIndicatorRegistry
 	 * @author SAP SE
 	 * @since 1.86.0
-	 * @version 1.107.0
+	 * @version 1.108.0
 	 * @private
 	 */
 	var ChangeIndicatorRegistry = ManagedObject.extend("sap.ui.rta.util.changeVisualization.ChangeIndicatorRegistry", {
@@ -167,9 +169,10 @@ sap.ui.define([
 	 *
 	 * @param {object} oChange - The change to register
 	 * @param {string} sCommandName - Command name of the change
+	 * @param {string} oVersionsModel - Model with versioning data
 	 * @returns {Promise<undefined>} Resolves as soon as the change is registered
 	 */
-	ChangeIndicatorRegistry.prototype.registerChange = function(oChange, sCommandName) {
+	ChangeIndicatorRegistry.prototype.registerChange = function(oChange, sCommandName, oVersionsModel) {
 		var oAppComponent = FlUtils.getAppComponentForControl(ElementUtil.getElementInstance(this.getRootControlId()));
 		return getVisualizationInfo(oChange, oAppComponent).then(function(mChangeVisualizationInfo) {
 			var aCategories = this.getChangeCategories();
@@ -185,11 +188,25 @@ sap.ui.define([
 					sChangeCategory = ChangeCategories.OTHER;
 				}
 			}
+			var aChangeStates;
+			var aDraftChangesList = [];
+			if (oVersionsModel) {
+				aDraftChangesList = oVersionsModel.getData().draftFilenames;
+			}
+
+			if (oChange.getState() === "NEW") {
+				aChangeStates = [ChangeStates.DIRTY, ChangeStates.DRAFT];
+			} else if (aDraftChangesList && aDraftChangesList.includes(oChange.getFileName())) {
+				aChangeStates = [ChangeStates.DRAFT];
+			} else {
+				aChangeStates = [ChangeStates.ACTIVATED];
+			}
 
 			this._oRegisteredChanges[oChange.getId()] = {
 				change: oChange,
 				commandName: sCommandName,
 				changeCategory: sChangeCategory,
+				changeStates: aChangeStates,
 				visualizationInfo: mChangeVisualizationInfo
 			};
 		}.bind(this));

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

@@ -0,0 +1,28 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2022 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+
+sap.ui.define([
+], function(
+) {
+	"use strict";
+
+	var ChangeStates = {};
+
+	ChangeStates.ACTIVATED = "activated";
+	ChangeStates.DRAFT = "draft";
+	ChangeStates.DIRTY = "dirty";
+
+	/**
+	 * Builds an array with the combined State of Draft and Dirty
+	 *
+	 * @returns {array} Array of change states.
+	 */
+	ChangeStates.getDraftState = function() {
+		return [this.DRAFT, this.DIRTY];
+	};
+
+	return ChangeStates;
+});

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

@@ -19,7 +19,8 @@ sap.ui.define([
 	"sap/ui/model/json/JSONModel",
 	"sap/ui/rta/util/changeVisualization/ChangeIndicator",
 	"sap/ui/rta/util/changeVisualization/ChangeIndicatorRegistry",
-	"sap/ui/rta/util/changeVisualization/ChangeCategories"
+	"sap/ui/rta/util/changeVisualization/ChangeCategories",
+	"sap/ui/rta/util/changeVisualization/ChangeStates"
 ], function(
 	Fragment,
 	difference,
@@ -35,7 +36,8 @@ sap.ui.define([
 	JSONModel,
 	ChangeIndicator,
 	ChangeIndicatorRegistry,
-	ChangeCategories
+	ChangeCategories,
+	ChangeStates
 ) {
 	"use strict";
 
@@ -57,7 +59,7 @@ sap.ui.define([
 	 * @alias sap.ui.rta.util.changeVisualization.ChangeVisualization
 	 * @author SAP SE
 	 * @since 1.84.0
-	 * @version 1.107.0
+	 * @version 1.108.0
 	 * @private
 	 */
 	var ChangeVisualization = Control.extend("sap.ui.rta.util.changeVisualization.ChangeVisualization", {
@@ -109,6 +111,10 @@ sap.ui.define([
 		}
 	});
 
+	ChangeVisualization.prototype.setVersionsModel = function(oToolbar) {
+		this.oVersionsModel = oToolbar.getModel("versions");
+	};
+
 	ChangeVisualization.prototype.setRootControlId = function(sRootControlId) {
 		if (this.getRootControlId() && this.getRootControlId() !== sRootControlId) {
 			this._reset();
@@ -144,16 +150,24 @@ sap.ui.define([
 	};
 
 	ChangeVisualization.prototype._updateVisualizationModelMenuData = function() {
-		var aVisualizedChanges = this._oChangeVisualizationModel.getData().visualizedChanges;
-		var aHiddenChanges = [];
 		var aAllRegisteredChanges = this._oChangeIndicatorRegistry.getAllRegisteredChanges();
-		aAllRegisteredChanges.forEach(function(oRegisteredChange) {
-			var oVisualizedChange = aVisualizedChanges.find(function(oVisualizedChange) {
-				return oRegisteredChange.change.getId() === oVisualizedChange.id;
-			});
-			if (!oVisualizedChange && !oRegisteredChange.dependent) {
-				aHiddenChanges.push(oRegisteredChange);
+		var aHiddenChanges = this._oChangeVisualizationModel.getData().hiddenChanges;
+		var aHiddenChangeIds = aHiddenChanges.map(function(oHiddenChange) {
+			return oHiddenChange.id;
+		});
+		var sVisualizedChangeState = this._oChangeVisualizationModel.getData().changeState;
+		var aHiddenChangesPerChangeState = aHiddenChanges.filter(function (oHiddenChange) {
+			if (!sVisualizedChangeState || sVisualizedChangeState === "all") {
+				return true;
 			}
+			return oHiddenChange.changeStates.includes(sVisualizedChangeState);
+		});
+		var aVisualizedChanges = aAllRegisteredChanges.filter(function (oChange) {
+			var bIsChangeVisible = !aHiddenChangeIds.includes(oChange.change.getId());
+			if (!sVisualizedChangeState || sVisualizedChangeState === "all") {
+				return bIsChangeVisible;
+			}
+			return bIsChangeVisible && oChange.changeStates.includes(sVisualizedChangeState);
 		});
 		var aCommandData = Object.keys(ChangeCategories.getCategories()).map(function(sChangeCategoryName) {
 			var sTitle = this._getChangeCategoryLabel(
@@ -177,10 +191,11 @@ sap.ui.define([
 
 		this._updateVisualizationModel({
 			changeCategories: aCommandData,
-			hiddenChanges: aHiddenChanges,
+			hasDraftChanges: this._oChangeVisualizationModel.getData().draftChanges.length > 0,
+			hasDirtyChanges: this._oChangeVisualizationModel.getData().dirtyChanges.length > 0,
 			popupInfoMessage: this._oTextBundle.getText(
 				"MSG_CHANGEVISUALIZATION_HIDDEN_CHANGES_INFO",
-				[aHiddenChanges.length]
+				[aHiddenChangesPerChangeState.length]
 			)
 		});
 	};
@@ -221,6 +236,12 @@ sap.ui.define([
 					oPopover.setModel(this._oChangeVisualizationModel, "visualizationModel");
 					oPopover.openBy(this._oToolbarButton);
 					this.setPopover(oPopover);
+					//Currently required because of an binding issue from the control
+					//At the first opening of the popover the controls don't get updated when the bound
+					//model changes. With the reopening this Problem gets fixed
+					//TODO Remove once control owners have fixed the issue
+					oPopover.close();
+					oPopover.openBy(this._oToolbarButton);
 				}.bind(this));
 			return;
 		}
@@ -242,6 +263,11 @@ sap.ui.define([
 		this._selectChangeCategory(sSelectedChangeCategory);
 	};
 
+	ChangeVisualization.prototype.onVersioningCategoryChange = function(oEvent) {
+		var sSelectedChangeState = oEvent.getSource().getSelectedKey();
+		this._selectChangeState(sSelectedChangeState);
+	};
+
 	ChangeVisualization.prototype._selectChangeCategory = function(sSelectedChangeCategory) {
 		this._sSelectedChangeCategory = sSelectedChangeCategory;
 
@@ -256,6 +282,17 @@ sap.ui.define([
 		this._setFocusedIndicator();
 	};
 
+	ChangeVisualization.prototype._selectChangeState = function(sSelectedChangeState) {
+		this._sSelectedChangeState = sSelectedChangeState;
+
+		this._updateVisualizationModel({
+			changeState: sSelectedChangeState
+		});
+
+		this._updateChangeIndicators();
+		this._updateVisualizationModelMenuData();
+	};
+
 	ChangeVisualization.prototype._getCommandForChange = function(oChange) {
 		var sCommand = oChange.getSupportInformation().command;
 		if (sCommand) {
@@ -339,7 +376,7 @@ sap.ui.define([
 			difference(aCurrentChangeIds, aRegisteredChangeIds).forEach(function(sChangeIdToAdd) {
 				var oChangeToAdd = oCurrentChanges[sChangeIdToAdd];
 				var sCommandName = this._getCommandForChange(oChangeToAdd);
-				aPromises.push(this._oChangeIndicatorRegistry.registerChange(oChangeToAdd, sCommandName));
+				aPromises.push(this._oChangeIndicatorRegistry.registerChange(oChangeToAdd, sCommandName, this.oVersionsModel));
 			}.bind(this));
 			return Promise.all(aPromises);
 		}.bind(this));
@@ -376,47 +413,70 @@ sap.ui.define([
 		var oSelectors = this._oChangeIndicatorRegistry.getSelectorsWithRegisteredChanges();
 		var oIndicators = {};
 		var aVisualizedChanges = [];
-		Object.keys(oSelectors)
-			.forEach(function(sSelectorId) {
-				var aRelevantChanges = this._filterRelevantChanges(oSelectors[sSelectorId]);
-				var oOverlay = OverlayRegistry.getOverlay(sSelectorId);
-				if (!oOverlay) {
-					// When the selector has no Overlay, check if there is a relevant container Overlay
-					// e.g. when a SmartForm group is removed
-					aRelevantChanges.some(function(oChange) {
-						var oElementOverlay = OverlayRegistry.getOverlay(oChange.affectedElementId);
-						var oRelevantContainer = oElementOverlay && oElementOverlay.getRelevantContainer();
-						if (oRelevantContainer) {
-							oOverlay = OverlayRegistry.getOverlay(oRelevantContainer);
-							return true;
-						}
-						return false;
-					});
-				}
-				if (!oOverlay || !oOverlay.getDomRef() || !oOverlay.isVisible()) {
-					// Change is not visible
-					return undefined;
+		var aActivatedChanges = [];
+		var aDraftChanges = [];
+		var aDirtyChanges = [];
+		var aHiddenChanges = [];
+		Object.keys(oSelectors).forEach(function(sSelectorId) {
+			oSelectors[sSelectorId].forEach(function (oChange) {
+				if (!oChange.dependent) {
+					if (oChange.changeStates.includes(ChangeStates.ACTIVATED)) {
+						aActivatedChanges.push(oChange.id);
+					} else if (oChange.changeStates.includes(ChangeStates.DIRTY)) {
+						aDirtyChanges.push(oChange.id);
+					} else if (oChange.changeStates.includes(ChangeStates.DRAFT)) {
+						aDraftChanges.push(oChange.id);
+					}
 				}
-				var oOverlayPosition = oOverlay.getDomRef().getClientRects()[0] || { left: 0, top: 0 };
-				aRelevantChanges.forEach(function (oChange) {
-					aVisualizedChanges.push(oChange);
+			});
+			var aChangesOnIndicator = oSelectors[sSelectorId];
+			var aRelevantChanges = this._filterRelevantChanges(oSelectors[sSelectorId]);
+			var oOverlay = OverlayRegistry.getOverlay(sSelectorId);
+			if (!oOverlay) {
+				// When the selector has no Overlay, check if there is a relevant container Overlay
+				// e.g. when a SmartForm group is removed
+				aChangesOnIndicator.some(function(oChange) {
+					var oElementOverlay = OverlayRegistry.getOverlay(oChange.affectedElementId);
+					var oRelevantContainer = oElementOverlay && oElementOverlay.getRelevantContainer();
+					if (oRelevantContainer) {
+						oOverlay = OverlayRegistry.getOverlay(oRelevantContainer);
+						return true;
+					}
+					return false;
+				});
+			}
+			if (!oOverlay || !oOverlay.getDomRef() || !oOverlay.isVisible()) {
+				// Change is not visible
+				aChangesOnIndicator.forEach(function (oChange) {
+					var aHiddenChangeIds = aHiddenChanges.map(function(oHiddenChange) {
+						return oHiddenChange.id;
+					});
+					if (!aHiddenChangeIds.includes(oChange.id)) {
+						aHiddenChanges.push(oChange);
+					}
 				});
-				oIndicators[sSelectorId] = {
-					posX: parseInt(oOverlayPosition.left),
-					posY: parseInt(oOverlayPosition.top),
-					changes: aRelevantChanges
-				};
-
-				var oChangeIndicator = this._oChangeIndicatorRegistry.getChangeIndicator(sSelectorId);
-				var sOverlayId = oOverlay.getId();
-				if (!oChangeIndicator) {
-					this._createChangeIndicator(oOverlay, sSelectorId);
-				} else if (oChangeIndicator.getOverlayId() !== sOverlayId) {
-					// Overlay id might change, e.g. during undo/redo of dirty changes
-					oChangeIndicator.setOverlayId(sOverlayId);
-				}
 				return undefined;
-			}.bind(this));
+			}
+			var oOverlayPosition = oOverlay.getDomRef().getClientRects()[0] || { left: 0, top: 0 };
+			aRelevantChanges.forEach(function (oChange) {
+				aVisualizedChanges.push(oChange);
+			});
+			oIndicators[sSelectorId] = {
+				posX: parseInt(oOverlayPosition.left),
+				posY: parseInt(oOverlayPosition.top),
+				changes: aRelevantChanges
+			};
+
+			var oChangeIndicator = this._oChangeIndicatorRegistry.getChangeIndicator(sSelectorId);
+			var sOverlayId = oOverlay.getId();
+			if (!oChangeIndicator) {
+				this._createChangeIndicator(oOverlay, sSelectorId);
+			} else if (oChangeIndicator.getOverlayId() !== sOverlayId) {
+				// Overlay id might change, e.g. during undo/redo of dirty changes
+				oChangeIndicator.setOverlayId(sOverlayId);
+			}
+			return undefined;
+		}.bind(this));
 
 		if (
 			!deepEqual(
@@ -425,11 +485,18 @@ sap.ui.define([
 			) || !deepEqual(
 				aVisualizedChanges,
 				this._oChangeVisualizationModel.getData().visualizedChanges
+			) || !deepEqual(
+				aHiddenChanges,
+				this._oChangeVisualizationModel.getData().hiddenChanges
 			)
 		) {
 			this._updateVisualizationModel({
 				content: oIndicators,
-				visualizedChanges: aVisualizedChanges
+				visualizedChanges: aVisualizedChanges,
+				dirtyChanges: aDirtyChanges,
+				activatedChanges: aActivatedChanges,
+				draftChanges: aDraftChanges,
+				hiddenChanges: aHiddenChanges
 			});
 		}
 	};
@@ -448,6 +515,11 @@ sap.ui.define([
 					oRootData.changeCategory === ChangeCategories.ALL
 					|| oRootData.changeCategory === oChangeVizInfo.changeCategory
 				)
+				&& (
+					!oRootData.changeState
+					|| oRootData.changeState === "all"
+					|| oChangeVizInfo.changeStates.includes(oRootData.changeState)
+				)
 			);
 		});
 	};
@@ -522,6 +594,16 @@ sap.ui.define([
 	ChangeVisualization.prototype.triggerModeChange = function(oRootControl, oToolbar) {
 		this.oMenuButton = oToolbar.getControl("toggleChangeVisualizationMenuButton");
 		this.oRootOverlay = OverlayRegistry.getOverlay(oRootControl);
+		if (oToolbar.getModel("versions")) {
+			this.setVersionsModel(oToolbar);
+			this._updateVisualizationModel({
+				versioningAvailable: this.oVersionsModel.getData().versioningEnabled
+			});
+		} else {
+			this._updateVisualizationModel({
+				versioningAvailable: false
+			});
+		}
 
 		if (this.getIsActive()) {
 			this.setIsActive(false);

package/src/sap/ui/rta/util/changeVisualization/commands/CreateContainerVisualization.js

@@ -0,0 +1,39 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2022 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+
+sap.ui.define([
+	"sap/ui/core/Core",
+	"sap/ui/rta/util/changeVisualization/ChangeVisualizationUtils"
+], function(
+	Core,
+	ChangeVisualizationUtils
+) {
+	"use strict";
+
+	var CreateContainerVisualization = {};
+
+	/**
+	 * Creates a localized description for create container, based on the provided
+	 * payload containing the original label.
+	 *
+	 * @param {object} mPayload - Change visualization description payload from the change handler
+	 * @param {string} mPayload.originalLabel - Original element label from create container change
+	 * @param {string} sLabel - Current element label
+	 * @returns {object} Map containing localized description text and tooltip
+	 */
+	CreateContainerVisualization.getDescription = function (mPayload, sLabel) {
+		var oRtaResourceBundle = Core.getLibraryResourceBundle("sap.ui.rta");
+		var sElementLabel = mPayload.originalLabel || sLabel;
+		var sShortenedElementLabel = ChangeVisualizationUtils.shortenString(sElementLabel);
+		var sTextKey = "TXT_CHANGEVISUALIZATION_CHANGE_CREATECONTAINER";
+		return {
+			descriptionText: oRtaResourceBundle.getText(sTextKey, sShortenedElementLabel),
+			descriptionTooltip: oRtaResourceBundle.getText(sTextKey, sElementLabel)
+		};
+	};
+
+	return CreateContainerVisualization;
+});

package/src/sap/ui/rta/util/changeVisualization/commands/getCommandVisualization.js

@@ -8,12 +8,14 @@ sap.ui.define([
 	"sap/ui/rta/util/changeVisualization/commands/RenameVisualization",
 	"sap/ui/rta/util/changeVisualization/commands/MoveVisualization",
 	"sap/ui/rta/util/changeVisualization/commands/CombineVisualization",
-	"sap/ui/rta/util/changeVisualization/commands/SplitVisualization"
+	"sap/ui/rta/util/changeVisualization/commands/SplitVisualization",
+	"sap/ui/rta/util/changeVisualization/commands/CreateContainerVisualization"
 ], function(
 	RenameVisualization,
 	MoveVisualization,
 	CombineVisualization,
-	SplitVisualization
+	SplitVisualization,
+	CreateContainerVisualization
 ) {
 	"use strict";
 
@@ -21,7 +23,8 @@ sap.ui.define([
 		rename: RenameVisualization,
 		move: MoveVisualization,
 		combine: CombineVisualization,
-		split: SplitVisualization
+		split: SplitVisualization,
+		createContainer: CreateContainerVisualization
 	};
 
 	return function(mIndicatorInformation) {