Varying Compositions in Invariant Document Types, Cherrypick of #21267

src/Umbraco.Web.UI.Client/src/packages/content/content/workspace/content-detail-workspace-base.ts

@@ -1,4 +1,4 @@
 import type { UmbContentDetailModel, UmbElementValueModel } from '../types.js';
 import { UmbContentCollectionManager } from '../collection/index.js';
 import { UmbContentWorkspaceDataManager } from '../manager/index.js';
 import { UmbMergeContentVariantDataController } from '../controller/merge-content-variant-data.controller.js';
@@ -223,162 +223,162 @@
 			this.validationContext,
 			this.view.hints,
 		);
 
 		this.variantOptions = mergeObservables(
 			[this.variesByCulture, this.variesBySegment, this.variants, this.languages, this._segments],
 			([variesByCulture, variesBySegment, variants, languages, segments]) => {
 				if ((variesByCulture || variesBySegment) === undefined) {
 					return [];
 				}
 
 				const varies = variesByCulture || variesBySegment;
 
 				// No variation
 				if (!varies) {
 					return [
 						{
 							variant: variants.find((x) => new UmbVariantId(x.culture, x.segment).isInvariant()),
 							language: languages.find((x) => x.isDefault),
 							culture: null,
 							segment: null,
 							unique: new UmbVariantId().toString(),
 						} as VariantOptionModelType,
 					];
 				}
 
 				// Only culture variation
 				if (variesByCulture && !variesBySegment) {
 					return languages.map((language) => {
 						return {
 							variant: variants.find((x) => x.culture === language.unique),
 							language,
 							culture: language.unique,
 							segment: null,
 							unique: new UmbVariantId(language.unique).toString(),
 						} as VariantOptionModelType;
 					});
 				}
 
 				// Only segment variation
 				if (!variesByCulture && variesBySegment) {
 					const invariantCulture = {
 						variant: variants.find((x) => new UmbVariantId(x.culture, x.segment).isInvariant()),
 						language: languages.find((x) => x.isDefault),
 						culture: null,
 						segment: null,
 						unique: new UmbVariantId().toString(),
 					} as VariantOptionModelType;
 
 					const segmentsForInvariantCulture = segments.map((segment) => {
 						return {
 							variant: variants.find((x) => x.culture === null && x.segment === segment.unique),
 							language: languages.find((x) => x.isDefault),
 							segmentInfo: segment,
 							culture: null,
 							segment: segment.unique,
 							unique: new UmbVariantId(null, segment.unique).toString(),
 						} as VariantOptionModelType;
 					});
 
 					return [invariantCulture, ...segmentsForInvariantCulture] as Array<VariantOptionModelType>;
 				}
 
 				// Culture and segment variation
 				if (variesByCulture && variesBySegment) {
 					return languages.flatMap((language) => {
 						const culture = {
 							variant: variants.find((x) => x.culture === language.unique),
 							language,
 							culture: language.unique,
 							segment: null,
 							unique: new UmbVariantId(language.unique).toString(),
 						} as VariantOptionModelType;
 
 						const segmentsForCulture = segments.map((segment) => {
 							return {
 								variant: variants.find((x) => x.culture === language.unique && x.segment === segment.unique),
 								language,
 								segmentInfo: segment,
 								culture: language.unique,
 								segment: segment.unique,
 								unique: new UmbVariantId(language.unique, segment.unique).toString(),
 							} as VariantOptionModelType;
 						});
 
 						return [culture, ...segmentsForCulture] as Array<VariantOptionModelType>;
 					});
 				}
 
 				return [] as Array<VariantOptionModelType>;
 			},
 		).pipe(map((options) => options.filter((option) => this._variantOptionsFilter(option))));
 
 		this.observe(
 			this.variantOptions,
 			(variantOptions) => {
 				variantOptions.forEach((variantOption) => {
 					const missingThis = !this.#variantValidationContexts.some((x) => {
 						const variantId = x.getVariantId();
 						if (!variantId) return;
 						return variantId.culture === variantOption.culture && variantId.segment === variantOption.segment;
 					});
 					if (missingThis) {
 						const context = new UmbValidationController(this);
 						context.inheritFrom(this.validationContext, '$');
 						context.setVariantId(UmbVariantId.Create(variantOption));
 						context.autoReport();
 						this.#variantValidationContexts.push(context);
 					}
 				});
 			},
 			null,
 		);
 
 		this.observe(
 			observeMultiple([this.splitView.activeVariantByIndex(0), this.variants]),
 			([activeVariant, variants]) => {
 				const variantName = variants.find(
 					(v) => v.culture === activeVariant?.culture && v.segment === activeVariant?.segment,
 				)?.name;
 				this.view.setTitle(variantName);
 			},
 			null,
 		);
 
 		this.observe(
 			this.varies,
 			(varies) => {
 				this._data.setVaries(varies);
 				this.#varies = varies;
 			},
 			null,
 		);
 		this.observe(
 			this.variesByCulture,
 			(varies) => {
 				this._data.setVariesByCulture(varies);
 				this.#variesByCulture = varies;
 			},
 			null,
 		);
 		this.observe(
 			this.variesBySegment,
 			(varies) => {
 				this._data.setVariesBySegment(varies);
 				this.#variesBySegment = varies;
 			},
 			null,
 		);
 		this.observe(
 			this.structure.contentTypeDataTypeUniques,
 			(dataTypeUniques: Array<string>) => {
 				this.#dataTypeItemManager.setUniques(dataTypeUniques);
 			},
 			null,
 		);
 
 		this.loadLanguages();
 		this.#loadSegments();
 	}
 
 	public async loadLanguages() {
@@ -420,6 +420,8 @@
 		const repo = new UmbDataTypeDetailRepository(this);
 
 		const propertyTypes = await this.structure.getContentTypeProperties();
+		const contentTypeVariesByCulture = this.structure.getVariesByCulture();
+		const contentTypeVariesBySegment = this.structure.getVariesByCulture();
 		const valueDefinitions = await Promise.all(
 			propertyTypes.map(async (property) => {
 				// TODO: Implement caching for data-type requests. [NL]
@@ -438,8 +440,9 @@
 					propertyEditorSchemaAlias: dataType.editorAlias,
 					config: dataType.values,
 					typeArgs: {
-						variesByCulture: property.variesByCulture,
-						variesBySegment: property.variesBySegment,
+						// Only vary if the content type varies:
+						variesByCulture: contentTypeVariesByCulture ? property.variesByCulture : false,
+						variesBySegment: contentTypeVariesBySegment ? property.variesBySegment : false,
 					} as UmbPropertyTypePresetModelTypeModel,
 				} as UmbPropertyTypePresetModel;
 			}),
@@ -678,23 +681,23 @@
 
 			// eslint-disable-next-line @typescript-eslint/ban-ts-comment
 			// @ts-ignore
 			// TODO: fix type error
 			this._data.updateCurrent({ values });
 
 			/**
 			 * Handling of Not-Culture but Segment variant properties: [NL]
 			 * We need to ensure variant-entries across all culture variants for the given segment variant, when er property is configured to vary by segment but not culture.
 			 * This is the only different case, in all other cases its fine to just target the given variant.
 			 */
 			if (this.getVariesByCulture() && property.variesByCulture === false && property.variesBySegment === true) {
 				// get all culture options:
 				const cultureOptions = await firstValueFrom(this.variantOptions);
 				for (const cultureOption of cultureOptions) {
 					if (cultureOption.segment === variantId.segment) {
 						this._data.ensureVariantData(UmbVariantId.Create(cultureOption));
 					}
 				}
 			} else {
 				// otherwise we know the property variant-id will be matching with a variant:
 				this._data.ensureVariantData(variantId);
 			}