@sapui5/sap.fe.core 1.102.2 → 1.104.1

package/src/sap/fe/core/converters/templates/ListReportConverter.ts

@@ -1,27 +1,27 @@
-import { EntityType } from "@sap-ux/annotation-converter";
-import { UIAnnotationTerms } from "@sap-ux/vocabularies-types";
-import {
+import type { EntityType } from "@sap-ux/vocabularies-types";
+import type {
 	LineItem,
-	PresentationVariantTypeTypes,
-	SelectionPresentationVariantTypeTypes,
-	SelectionVariantTypeTypes
-} from "@sap-ux/vocabularies-types/dist/generated/UI";
-import { BaseAction, getActionsFromManifest } from "sap/fe/core/converters/controls/Common/Action";
-import { ChartVisualization } from "sap/fe/core/converters/controls/Common/Chart";
-import { TableVisualization } from "sap/fe/core/converters/controls/Common/Table";
+	PresentationVariant,
+	SelectionPresentationVariant,
+	SelectionVariant
+} from "@sap-ux/vocabularies-types/vocabularies/UI";
+import { UIAnnotationTerms } from "@sap-ux/vocabularies-types/vocabularies/UI";
+import type { BaseAction } from "sap/fe/core/converters/controls/Common/Action";
+import { getActionsFromManifest } from "sap/fe/core/converters/controls/Common/Action";
+import type { ChartVisualization } from "sap/fe/core/converters/controls/Common/Chart";
+import type { TableVisualization } from "sap/fe/core/converters/controls/Common/Table";
+import type { CustomElementFilterField, FilterField } from "sap/fe/core/converters/controls/ListReport/FilterBar";
 import {
-	CustomElementFilterField,
-	FilterField,
 	getFilterBarhideBasicSearch,
 	getManifestFilterFields,
 	getSelectionFields
 } from "sap/fe/core/converters/controls/ListReport/FilterBar";
-import ConverterContext from "sap/fe/core/converters/ConverterContext";
-import { ConfigurableObject, insertCustomElements } from "sap/fe/core/converters/helpers/ConfigurableObject";
-import { annotationExpression, compileBinding } from "sap/fe/core/helpers/BindingExpression";
+import type ConverterContext from "sap/fe/core/converters/ConverterContext";
+import type { ConfigurableObject } from "sap/fe/core/converters/helpers/ConfigurableObject";
+import { insertCustomElements } from "sap/fe/core/converters/helpers/ConfigurableObject";
+import { compileExpression, getExpressionFromAnnotation } from "sap/fe/core/helpers/BindingToolkit";
+import type { DataVisualizationAnnotations, DataVisualizationDefinition } from "../controls/Common/DataVisualization";
 import {
-	DataVisualizationAnnotations,
-	DataVisualizationDefinition,
 	getDataVisualizationConfiguration,
 	getDefaultChart,
 	getDefaultLineItem,
@@ -31,20 +31,19 @@ import {
 	isPresentationCompliant,
 	isSelectionPresentationCompliant
 } from "../controls/Common/DataVisualization";
-import { getKPIDefinitions, KPIDefinition } from "../controls/Common/KPI";
-import { ChartID, CustomTabID, FilterBarID, FilterVariantManagementID, IconTabBarID, TableID } from "../helpers/ID";
-import {
+import type { KPIDefinition } from "../controls/Common/KPI";
+import { getKPIDefinitions } from "../controls/Common/KPI";
+import { getChartID, getCustomTabID, getFilterBarID, getFilterVariantManagementID, getIconTabBarID, getTableID } from "../helpers/ID";
+import type {
 	CombinedViewPathConfiguration,
 	CustomViewTemplateConfiguration,
 	MultipleViewsConfiguration,
 	SingleViewPathConfiguration,
-	TemplateType,
-	VariantManagementType,
-	ViewPathConfiguration,
-	VisualizationType
+	ViewPathConfiguration
 } from "../ManifestSettings";
+import { TemplateType, VariantManagementType, VisualizationType } from "../ManifestSettings";
 
-type ViewAnnotationsTypeTypes = SelectionPresentationVariantTypeTypes | SelectionVariantTypeTypes;
+type ViewAnnotations = SelectionPresentationVariant | SelectionVariant;
 type VariantManagementDefinition = {
 	id: string;
 	targetControlIds: string;
@@ -73,15 +72,18 @@ type DefaultSemanticDate = ConfigurableObject & {
 	operator: string;
 };
 
+type MultiViewsControlConfiguration = {
+	id: string;
+	showTabCounts?: boolean;
+};
+
 export type ListReportDefinition = {
 	mainEntitySet: string;
 	mainEntityType: string; // entityType> at the start of LR templating
 	singleTableId?: string; // only with single Table mode
 	singleChartId?: string; // only with single Table mode
-	displayMultiVisualizations: boolean;
-	iconTabBarId: string;
 	stickySubheaderProvider?: string;
-	showTabCounts?: boolean; // only with multi Table mode
+	multiViewsControl?: MultiViewsControlConfiguration; // only with multi Table mode
 	headerActions: BaseAction[];
 	showPinnableToggle?: boolean;
 	filterBar: {
@@ -91,7 +93,6 @@ export type ListReportDefinition = {
 	};
 	views: ListReportViewDefinition[];
 	filterConditions: object;
-	isMultiEntitySets: boolean;
 	filterBarId: string;
 	variantManagement: VariantManagementDefinition;
 	hasMultiVisualizations: boolean;
@@ -148,8 +149,9 @@ type ContentAreaID = {
 
 /**
  * Retrieves all list report tables.
- * @param {ListReportViewDefinition[]} views The list report views configured in the manifest
- * @returns {TableVisualization[]} The list report table
+ *
+ * @param views The list report views configured in the manifest
+ * @returns The list report table
  */
 function getTableVisualizations(views: ListReportViewDefinition[]): TableVisualization[] {
 	const tables: TableVisualization[] = [];
@@ -200,16 +202,16 @@ const getDefaultSemanticDates = function (filterFields: Record<string, CustomEle
 /**
  * Find a visualization annotation that can be used for rendering the list report.
  *
- * @param {EntityType} entityType The current EntityType
+ * @param entityType The current EntityType
  * @param converterContext
  * @param bIsALP
- * @returns {LineItem | PresentationVariantTypeTypes | undefined} A compliant annotation for rendering the list report
+ * @returns A compliant annotation for rendering the list report
  */
 function getCompliantVisualizationAnnotation(
 	entityType: EntityType,
 	converterContext: ConverterContext,
 	bIsALP: Boolean
-): LineItem | PresentationVariantTypeTypes | SelectionPresentationVariantTypeTypes | undefined {
+): LineItem | PresentationVariant | SelectionPresentationVariant | undefined {
 	const annotationPath = converterContext.getManifestWrapper().getDefaultTemplateAnnotationPath();
 	const selectionPresentationVariant = getSelectionPresentationVariant(entityType, annotationPath, converterContext);
 	if (annotationPath && selectionPresentationVariant) {
@@ -262,12 +264,12 @@ const getView = function (viewConverterConfiguration: ViewConverterSettings): Li
 		let chartControlId = "";
 		let title: string | undefined = "";
 		let selectionVariantPath = "";
-		const isMultipleViewConfiguration = function (config: ViewConfiguration): config is MultipleViewConfiguration {
-			return (config as MultipleViewConfiguration).key !== undefined;
+		const isMultipleViewConfiguration = function (currentConfig: ViewConfiguration): currentConfig is MultipleViewConfiguration {
+			return (currentConfig as MultipleViewConfiguration).key !== undefined;
 		};
-		const createVisualization = function (presentation: DataVisualizationDefinition, isPrimary?: boolean) {
+		const createVisualization = function (currentPresentation: DataVisualizationDefinition, isPrimary?: boolean) {
 			let defaultVisualization;
-			for (const visualization of presentation.visualizations) {
+			for (const visualization of currentPresentation.visualizations) {
 				if (isPrimary && visualization.type === VisualizationType.Chart) {
 					defaultVisualization = visualization;
 					break;
@@ -277,7 +279,7 @@ const getView = function (viewConverterConfiguration: ViewConverterSettings): Li
 					break;
 				}
 			}
-			const presentationCreated = Object.assign({}, presentation);
+			const presentationCreated = Object.assign({}, currentPresentation);
 			if (defaultVisualization) {
 				presentationCreated.visualizations = [defaultVisualization];
 			}
@@ -346,9 +348,9 @@ const getView = function (viewConverterConfiguration: ViewConverterSettings): Li
 		} else if (isMultipleViewConfiguration(config)) {
 			// key exists only on multi tables mode
 			const resolvedTarget = converterContext.getEntityTypeAnnotation((config as SingleViewPathConfiguration).annotationPath);
-			const viewAnnotation: ViewAnnotationsTypeTypes = resolvedTarget.annotation as ViewAnnotationsTypeTypes;
+			const viewAnnotation: ViewAnnotations = resolvedTarget.annotation;
 			converterContext = resolvedTarget.converterContext;
-			title = compileBinding(annotationExpression(viewAnnotation.Text));
+			title = compileExpression(getExpressionFromAnnotation(viewAnnotation.Text));
 			// Need to loop on table into views since multi table mode get specific configuration (hidden filters or Table Id)
 			presentation.visualizations.forEach((visualizationDefinition, index) => {
 				switch (visualizationDefinition.type) {
@@ -356,15 +358,13 @@ const getView = function (viewConverterConfiguration: ViewConverterSettings): Li
 						const tableVisualization = presentation.visualizations[index] as TableVisualization;
 						const filters = tableVisualization.control.filters || {};
 						filters.hiddenFilters = filters.hiddenFilters || { paths: [] };
-						if (!(config as SingleViewPathConfiguration).keepPreviousPresonalization) {
+						if (!(config as SingleViewPathConfiguration).keepPreviousPersonalization) {
 							// Need to override Table Id to match with Tab Key (currently only table is managed in multiple view mode)
-							tableVisualization.annotation.id = TableID((config as SingleViewPathConfiguration).key || "", "LineItem");
+							tableVisualization.annotation.id = getTableID((config as SingleViewPathConfiguration).key || "", "LineItem");
 						}
 						config = config as ViewAnnotationConfiguration;
 						if (config && config.annotation && config.annotation.term === UIAnnotationTerms.SelectionPresentationVariant) {
-							selectionVariantPath = (
-								config.annotation as SelectionPresentationVariantTypeTypes
-							).SelectionVariant.fullyQualifiedName.split("@")[1];
+							selectionVariantPath = config.annotation.SelectionVariant.fullyQualifiedName.split("@")[1];
 						} else {
 							selectionVariantPath = (config as SingleViewPathConfiguration).annotationPath;
 						}
@@ -378,7 +378,7 @@ const getView = function (viewConverterConfiguration: ViewConverterSettings): Li
 						break;
 					case VisualizationType.Chart:
 						const chartVisualization = presentation.visualizations[index] as ChartVisualization;
-						chartVisualization.id = ChartID((config as SingleViewPathConfiguration).key || "", "Chart");
+						chartVisualization.id = getChartID((config as SingleViewPathConfiguration).key || "", "Chart");
 						chartVisualization.multiViews = true;
 						break;
 					default:
@@ -408,7 +408,7 @@ const getView = function (viewConverterConfiguration: ViewConverterSettings): Li
 		const title = config.label,
 			fragment = config.template,
 			type = config.type,
-			customTabId = CustomTabID(config.key || ""),
+			customTabId = getCustomTabID(config.key || ""),
 			visible = config.visible;
 		return {
 			title,
@@ -452,7 +452,7 @@ const getViews = function (
 				path = path as SingleViewPathConfiguration;
 				const manifestWrapper = converterContext.getManifestWrapper(),
 					viewConverterContext = converterContext.getConverterContextFor(
-						path.contextPath || (path.entitySet && "/" + path.entitySet) || converterContext.getContextPath()
+						path.contextPath || (path.entitySet && `/${path.entitySet}`) || converterContext.getContextPath()
 					),
 					entityType = viewConverterContext.getEntityType();
 
@@ -480,7 +480,7 @@ const getViews = function (
 							converterContext: viewConverterContext,
 							annotation,
 							annotationPath: path.annotationPath,
-							keepPreviousPresonalization: path.keepPreviousPresonalization,
+							keepPreviousPersonalization: path.keepPreviousPersonalization,
 							key: path.key,
 							visible: path.visible
 						});
@@ -506,6 +506,21 @@ const getViews = function (
 	});
 };
 
+const getMultiViewsControl = function (
+	converterContext: ConverterContext,
+	views: ListReportViewDefinition[]
+): MultiViewsControlConfiguration | undefined {
+	const manifestWrapper = converterContext.getManifestWrapper();
+	const viewsDefinition: MultipleViewsConfiguration | undefined = manifestWrapper.getViewConfiguration();
+	if (views.length > 1 && !hasMultiVisualizations(converterContext)) {
+		return {
+			showTabCounts: viewsDefinition ? viewsDefinition?.showCounts || manifestWrapper.hasMultipleEntitySets() : undefined, // with multi EntitySets, tab counts are displayed by default
+			id: getIconTabBarID()
+		};
+	}
+	return undefined;
+};
+
 function getAlpViewConfig(converterContext: ConverterContext, viewConfigs: ViewConverterSettings[]): ViewConverterSettings[] {
 	const entityType = converterContext.getEntityType();
 	const annotation = getCompliantVisualizationAnnotation(entityType, converterContext, true);
@@ -532,6 +547,13 @@ function getAlpViewConfig(converterContext: ConverterContext, viewConfigs: ViewC
 	return viewConfigs;
 }
 
+function hasMultiVisualizations(converterContext: ConverterContext): boolean {
+	return (
+		converterContext.getManifestWrapper().hasMultipleVisualizations() ||
+		converterContext.getTemplateType() === TemplateType.AnalyticalListPage
+	);
+}
+
 export const getHeaderActions = function (converterContext: ConverterContext): BaseAction[] {
 	const manifestWrapper = converterContext.getManifestWrapper();
 	return insertCustomElements([], getActionsFromManifest(manifestWrapper.getHeaderActions(), converterContext));
@@ -554,7 +576,7 @@ export const checkChartFilterBarId = function (views: ListReportViewDefinition[]
  * Creates the ListReportDefinition for multiple entity sets (multiple table mode).
  *
  * @param converterContext The converter context
- * @returns {ListReportDefinition} The list report definition based on annotation + manifest
+ * @returns The list report definition based on annotation + manifest
  */
 export const convertPage = function (converterContext: ConverterContext): ListReportDefinition {
 	const entityType = converterContext.getEntityType();
@@ -570,14 +592,13 @@ export const convertPage = function (converterContext: ConverterContext): ListRe
 	const viewsDefinition: MultipleViewsConfiguration | undefined = manifestWrapper.getViewConfiguration();
 	const hasMultipleEntitySets = manifestWrapper.hasMultipleEntitySets();
 	const views: ListReportViewDefinition[] = getViews(converterContext, viewsDefinition);
-	const showTabCounts = viewsDefinition ? viewsDefinition?.showCounts || hasMultipleEntitySets : undefined; // with multi EntitySets, tab counts are displayed by default
 	const lrTableVisualizations = getTableVisualizations(views);
 	const lrChartVisualizations = getChartVisualizations(views);
 	const showPinnableToggle = lrTableVisualizations.some((table) => table.control.type === "ResponsiveTable");
 	let singleTableId = "";
 	let singleChartId = "";
-	const filterBarId = FilterBarID(sContextPath);
-	const filterVariantManagementID = FilterVariantManagementID(filterBarId);
+	const filterBarId = getFilterBarID(sContextPath);
+	const filterVariantManagementID = getFilterVariantManagementID(filterBarId);
 	const fbConfig = manifestWrapper.getFilterConfiguration();
 	const filterInitialLayout = fbConfig?.initialLayout !== undefined ? fbConfig?.initialLayout.toLowerCase() : "compact";
 	const filterLayout = fbConfig?.layout !== undefined ? fbConfig?.layout.toLowerCase() : "compact";
@@ -601,8 +622,7 @@ export const convertPage = function (converterContext: ConverterContext): ListRe
 
 	// Sort header actions according to position attributes in manifest
 	const headerActions = getHeaderActions(converterContext);
-	const hasMultiVisualizations: boolean =
-		manifestWrapper.hasMultipleVisualizations() || converterContext.getTemplateType() === TemplateType.AnalyticalListPage;
+	const multiViewControl = getMultiViewsControl(converterContext, views);
 	if (hasMultipleEntitySets) {
 		checkChartFilterBarId(views, filterBarId);
 	}
@@ -619,23 +639,19 @@ export const convertPage = function (converterContext: ConverterContext): ListRe
 	const targetControlIds = [
 		...(hideFilterBar ? [] : [filterBarId]),
 		...(manifestWrapper.getVariantManagement() !== VariantManagementType.Control ? visualizationIds : []),
-		...(!hasMultiVisualizations && views.length > 1 ? [IconTabBarID()] : [])
+		...(multiViewControl ? [multiViewControl.id] : [])
 	];
 
-	const iconTabBarId = "fe::TabMultipleMode";
-	const displayMultiVisualizations = views.length > 1 && !hasMultiVisualizations;
 	const stickySubheaderProvider =
-		displayMultiVisualizations && manifestWrapper.getStickyMultiTabHeaderConfiguration() ? iconTabBarId : undefined;
+		multiViewControl && manifestWrapper.getStickyMultiTabHeaderConfiguration() ? multiViewControl.id : undefined;
 
 	return {
 		mainEntitySet: sContextPath,
-		mainEntityType: sContextPath + "/",
-		displayMultiVisualizations,
-		iconTabBarId,
+		mainEntityType: `${sContextPath}/`,
+		multiViewsControl: multiViewControl,
 		stickySubheaderProvider,
 		singleTableId,
 		singleChartId,
-		showTabCounts,
 		headerActions,
 		showPinnableToggle: showPinnableToggle,
 		filterBar: {
@@ -653,8 +669,7 @@ export const convertPage = function (converterContext: ConverterContext): ListRe
 			id: filterVariantManagementID,
 			targetControlIds: targetControlIds.join(",")
 		},
-		isMultiEntitySets: hasMultipleEntitySets,
-		hasMultiVisualizations: hasMultiVisualizations,
+		hasMultiVisualizations: hasMultiVisualizations(converterContext),
 		templateType: manifestWrapper.getTemplateType(),
 		useSemanticDateRange,
 		filterInitialLayout,