Fix: content structure promise (#18456)

* client validation for textarea

* keep response

src/Umbraco.Web.UI.Client/src/packages/core/content-type/structure/content-type-structure-manager.class.ts

@@ -4,7 +4,7 @@ import type {
 	UmbPropertyTypeContainerModel,
 	UmbPropertyTypeModel,
 } from '../types.js';
-import type { UmbDetailRepository } from '@umbraco-cms/backoffice/repository';
+import type { UmbDetailRepository, UmbRepositoryResponse } from '@umbraco-cms/backoffice/repository';
 import { UmbId } from '@umbraco-cms/backoffice/id';
 import type { UmbControllerHost, UmbController } from '@umbraco-cms/backoffice/controller-api';
 import type { MappingFunction } from '@umbraco-cms/backoffice/observable-api';
@@ -35,8 +35,8 @@ const UmbFilterDuplicateStrings = (value: string, index: number, array: Array<st
 export class UmbContentTypeStructureManager<
 	T extends UmbContentTypeModel = UmbContentTypeModel,
 > extends UmbControllerBase {
-	#initResolver?: () => void;
-	#init = new Promise<void>((resolve) => {
+	#initResolver?: (respoonse: UmbRepositoryResponse<T>) => void;
+	#init = new Promise<UmbRepositoryResponse<T>>((resolve) => {
 		this.#initResolver = resolve;
 	});
 
@@ -142,7 +142,7 @@ export class UmbContentTypeStructureManager<
 		this.#ownerContentTypeUnique = unique;
 		if (!unique) return;
 		const result = await this.#loadType(unique);
-		this.#initResolver?.();
+		this.#initResolver?.(result);
 		return result;
 	}
 
@@ -150,15 +150,15 @@ export class UmbContentTypeStructureManager<
 		await this.#initRepository;
 		this.#clear();
 
-		const { data } = await this.#repository!.createScaffold(preset);
-		if (!data) return {};
+		const repsonse = await this.#repository!.createScaffold(preset);
+		if (!repsonse.data) return {};
 
-		this.#ownerContentTypeUnique = data.unique;
+		this.#ownerContentTypeUnique = repsonse.data.unique;
 
 		// Add the new content type to the list of content types, this holds our draft state of this scaffold.
-		this.#contentTypes.appendOne(data);
-		this.#initResolver?.();
-		return { data };
+		this.#contentTypes.appendOne(repsonse.data);
+		this.#initResolver?.(repsonse);
+		return repsonse;
 	}
 
 	/**
@@ -407,7 +407,7 @@ export class UmbContentTypeStructureManager<
 		parentId: string | null = null,
 		type: UmbPropertyContainerTypes = 'Group',
 		sortOrder?: number,
-	) {
+	): Promise<UmbPropertyTypeContainerModel> {
 		await this.#init;
 		contentTypeUnique = contentTypeUnique ?? this.#ownerContentTypeUnique!;
 
@@ -462,7 +462,7 @@ export class UmbContentTypeStructureManager<
 		containerId: string,
 		containerType: UmbPropertyContainerTypes,
 		parentId: string | null = null,
-	) {
+	): string {
 		return (
 			this.makeContainerNameUniqueForOwnerContentType(containerId, 'Unnamed', containerType, parentId) ?? 'Unnamed'
 		);
@@ -789,7 +789,7 @@ export class UmbContentTypeStructureManager<
 	}
 
 	#clear() {
-		this.#init = new Promise<void>((resolve) => {
+		this.#init = new Promise((resolve) => {
 			this.#initResolver = resolve;
 		});
 		this.#contentTypes.setValue([]);

src/Umbraco.Web.UI.Client/src/packages/property-editors/textarea/property-editor-ui-textarea.element.ts

@@ -6,13 +6,13 @@ import type {
 	UmbPropertyEditorConfigCollection,
 	UmbPropertyEditorUiElement,
 } from '@umbraco-cms/backoffice/property-editor';
-import { UmbFormControlMixin } from '@umbraco-cms/backoffice/validation';
+import { UMB_VALIDATION_EMPTY_LOCALIZATION_KEY, UmbFormControlMixin } from '@umbraco-cms/backoffice/validation';
 import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
-import { UMB_PROPERTY_CONTEXT } from '@umbraco-cms/backoffice/property';
+import type { UUITextareaElement } from '@umbraco-cms/backoffice/external/uui';
 
 @customElement('umb-property-editor-ui-textarea')
 export class UmbPropertyEditorUITextareaElement
-	extends UmbFormControlMixin<string, typeof UmbLitElement>(UmbLitElement, undefined)
+	extends UmbFormControlMixin<string | undefined, typeof UmbLitElement>(UmbLitElement, undefined)
 	implements UmbPropertyEditorUiElement
 {
 	/**
@@ -24,8 +24,21 @@ export class UmbPropertyEditorUITextareaElement
 	@property({ type: Boolean, reflect: true })
 	readonly = false;
 
-	@state()
-	private _label?: string;
+	/**
+	 * Sets the input to mandatory, meaning validation will fail if the value is empty.
+	 * @type {boolean}
+	 */
+	@property({ type: Boolean })
+	mandatory?: boolean;
+	@property({ type: String })
+	mandatoryMessage = UMB_VALIDATION_EMPTY_LOCALIZATION_KEY;
+
+	/**
+	 * The name of this field.
+	 * @type {string}
+	 */
+	@property({ type: String })
+	name?: string;
 
 	@state()
 	private _maxChars?: number;
@@ -54,24 +67,21 @@ export class UmbPropertyEditorUITextareaElement
 		};
 	}
 
-	constructor() {
-		super();
-		this.consumeContext(UMB_PROPERTY_CONTEXT, (context) => {
-			this._label = context.getLabel();
-		});
-	}
-
 	protected override firstUpdated(): void {
 		this.addFormControlElement(this.shadowRoot!.querySelector('uui-textarea')!);
 
 		if (this._minHeight && this._maxHeight && this._minHeight > this._maxHeight) {
 			console.warn(
-				`Property '${this._label}' (Textarea) has been misconfigured, 'minHeight' is greater than 'maxHeight'. Please correct your data type configuration.`,
+				`Property '${this.name}' (Textarea) has been misconfigured, 'minHeight' is greater than 'maxHeight'. Please correct your data type configuration.`,
 				this,
 			);
 		}
 	}
 
+	override focus() {
+		return this.shadowRoot?.querySelector<UUITextareaElement>('uui-textarea')?.focus();
+	}
+
 	#onInput(event: InputEvent) {
 		const newValue = (event.target as HTMLTextAreaElement).value;
 		if (newValue === this.value) return;
@@ -82,13 +92,15 @@ export class UmbPropertyEditorUITextareaElement
 	override render() {
 		return html`
 			<uui-textarea
-				label=${ifDefined(this._label)}
+				.label=${this.localize.term('general_fieldFor', [this.name])}
 				style=${styleMap(this._css)}
 				.autoHeight=${this._rows ? false : true}
 				maxlength=${ifDefined(this._maxChars)}
 				rows=${ifDefined(this._rows)}
 				.value=${this.value ?? ''}
 				@input=${this.#onInput}
+				?required=${this.mandatory}
+				.requiredMessage=${this.mandatoryMessage}
 				?readonly=${this.readonly}></uui-textarea>
 		`;
 	}