Merge branch 'main' into v15/feature/content-workspace-base

src/Umbraco.Web.UI.Client/examples/ufm-custom-component/index.ts

@@ -8,8 +8,7 @@ export const manifests: Array<ManifestUfmComponent> = [
 		api: () => import('./custom-ufm-component.js'),
 		meta: {
 			alias: 'myCustomComponent',
-			marker: '%',
-			alias: 'myCustomComponent',
+			marker: '%'
 		},
 	},
 ];

src/Umbraco.Web.UI.Client/src/assets/lang/de-ch.ts

@@ -0,0 +1,17 @@
+/**
+ * Creator Name: The Umbraco community
+ * Creator Link: https://docs.umbraco.com/umbraco-cms/extending/language-files
+ *
+ * Language Alias: de_CH
+ * Language Int Name: German Switzerland (DE-CH)
+ * Language Local Name: Deutsch Schweiz (DE-CH)
+ * Language LCID: 7
+ * Language Culture: de-CH
+ */
+import de_de from './de-de.js';
+import type { UmbLocalizationDictionary } from '@umbraco-cms/backoffice/localization-api';
+
+export default {
+	// NOTE: Imports and re-exports the German (Germany) localizations, so that any German (Switzerland) localizations can be override them. [LK]
+	...de_de,
+} as UmbLocalizationDictionary;

src/Umbraco.Web.UI.Client/src/assets/lang/en.ts

@@ -1978,7 +1978,7 @@ export default {
 		passwordCurrent: 'Current password',
 		passwordInvalid: 'Invalid current password',
 		passwordIsDifferent:
-			'There was a difference between the new password and the confirmed password. Please\n      try again!\n    ',
+			'There was a difference between the new password and the confirmed password. Please try again!',
 		passwordMismatch: "The confirmed password doesn't match the new password!",
 		passwordRequiresDigit: "The password must have at least one digit ('0'-'9')",
 		passwordRequiresLower: "The password must have at least one lowercase ('a'-'z')",

src/Umbraco.Web.UI.Client/src/assets/lang/fr-ch.ts

@@ -0,0 +1,17 @@
+/**
+ * Creator Name: The Umbraco community
+ * Creator Link: https://docs.umbraco.com/umbraco-cms/extending/language-files
+ *
+ * Language Alias: fr_ch
+ * Language Int Name: French Switzerland (FR-CH)
+ * Language Local Name: Français Suisse (FR-CH)
+ * Language LCID: 12
+ * Language Culture: fr-CH
+ */
+import fr_fr from './fr-fr.js';
+import type { UmbLocalizationDictionary } from '@umbraco-cms/backoffice/localization-api';
+
+export default {
+	// NOTE: Imports and re-exports the French (France) localizations, so that any French (Switzerland) localizations can be override them. [LK]
+	...fr_fr,
+} as UmbLocalizationDictionary;

src/Umbraco.Web.UI.Client/src/assets/lang/it-ch.ts

@@ -0,0 +1,17 @@
+/**
+ * Creator Name: The Umbraco community
+ * Creator Link: https://docs.umbraco.com/umbraco-cms/extending/language-files
+ *
+ * Language Alias: it_ch
+ * Language Int Name: Italian Switzerland (IT-CH)
+ * Language Local Name: Italiano Svizerra (IT-CH)
+ * Language LCID: 16
+ * Language Culture: it-CH
+ */
+import it_it from './it-it.js';
+import type { UmbLocalizationDictionary } from '@umbraco-cms/backoffice/localization-api';
+
+export default {
+	// NOTE: Imports and re-exports the Italian (Italy) localizations, so that any Italian (Switzerland) localizations can be override them. [LK]
+	...it_it,
+} as UmbLocalizationDictionary;

src/Umbraco.Web.UI.Client/src/packages/core/localization/manifests.ts

@@ -61,6 +61,16 @@ export const manifests: Array<ManifestLocalization> = [
 		},
 		js: () => import('../../../assets/lang/de-de.js'),
 	},
+	{
+		type: 'localization',
+		alias: 'Umb.Localization.De-CH',
+		weight: -100,
+		name: 'Deutsch (Schweiz)',
+		meta: {
+			culture: 'de-ch',
+		},
+		js: () => import('../../../assets/lang/de-ch.js'),
+	},
 	{
 		type: 'localization',
 		alias: 'Umb.Localization.En-GB',
@@ -101,6 +111,16 @@ export const manifests: Array<ManifestLocalization> = [
 		},
 		js: () => import('../../../assets/lang/fr-fr.js'),
 	},
+	{
+		type: 'localization',
+		alias: 'Umb.Localization.Fr-CH',
+		weight: -100,
+		name: 'Français (Suisse)',
+		meta: {
+			culture: 'fr-ch',
+		},
+		js: () => import('../../../assets/lang/fr-ch.js'),
+	},
 	{
 		type: 'localization',
 		alias: 'Umb.Localization.He-IL',
@@ -131,6 +151,16 @@ export const manifests: Array<ManifestLocalization> = [
 		},
 		js: () => import('../../../assets/lang/it-it.js'),
 	},
+	{
+		type: 'localization',
+		alias: 'Umb.Localization.It-CH',
+		weight: -100,
+		name: 'Italiano (Svizerra)',
+		meta: {
+			culture: 'it-ch',
+		},
+		js: () => import('../../../assets/lang/it-ch.js'),
+	},
 	{
 		type: 'localization',
 		alias: 'Umb.Localization.Ja-JP',

src/Umbraco.Web.UI.Client/src/packages/user/change-password/modal/change-password-modal.element.ts

@@ -1,18 +1,24 @@
 import type { UmbChangePasswordModalData, UmbChangePasswordModalValue } from './change-password-modal.token.js';
-import { UMB_CURRENT_USER_CONTEXT } from '@umbraco-cms/backoffice/current-user';
-import { UmbUserItemRepository } from '@umbraco-cms/backoffice/user';
-import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
-import type { CSSResultGroup } from '@umbraco-cms/backoffice/external/lit';
-import { css, html, nothing, customElement, state } from '@umbraco-cms/backoffice/external/lit';
+import { css, customElement, html, query, state, when } from '@umbraco-cms/backoffice/external/lit';
 import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal';
+import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
+import { UmbUserItemRepository } from '@umbraco-cms/backoffice/user';
+import { UMB_CURRENT_USER_CONTEXT } from '@umbraco-cms/backoffice/current-user';
+import type { UUIInputPasswordElement } from '@umbraco-cms/backoffice/external/uui';
 
 @customElement('umb-change-password-modal')
 export class UmbChangePasswordModalElement extends UmbModalBaseElement<
 	UmbChangePasswordModalData,
 	UmbChangePasswordModalValue
 > {
+	@query('#newPassword')
+	private _newPasswordInput?: UUIInputPasswordElement;
+
+	@query('#confirmPassword')
+	private _confirmPasswordInput?: UUIInputPasswordElement;
+
 	@state()
-	private _headline: string = 'Change password';
+	private _headline: string = this.localize.term('general_changePassword');
 
 	@state()
 	private _isCurrentUser: boolean = false;
@@ -35,10 +41,8 @@ export class UmbChangePasswordModalElement extends UmbModalBaseElement<
 
 		const formData = new FormData(form);
 
-		// TODO: validate that the new password and confirm password match
 		const oldPassword = formData.get('oldPassword') as string;
 		const newPassword = formData.get('newPassword') as string;
-		//const confirmPassword = formData.get('confirmPassword') as string;
 
 		this.value = { oldPassword, newPassword };
 		this.modalContext?.submit();
@@ -54,12 +58,7 @@ export class UmbChangePasswordModalElement extends UmbModalBaseElement<
 	}
 
 	async #setIsCurrentUser() {
-		if (!this.data?.user.unique) {
-			this._isCurrentUser = false;
-			return;
-		}
-
-		if (!this.#currentUserContext) {
+		if (!this.#currentUserContext || !this.data?.user.unique) {
 			this._isCurrentUser = false;
 			return;
 		}
@@ -67,7 +66,13 @@ export class UmbChangePasswordModalElement extends UmbModalBaseElement<
 		this._isCurrentUser = await this.#currentUserContext.isUserCurrentUser(this.data.user.unique);
 	}
 
-	protected override async firstUpdated(): Promise<void> {
+	protected override async firstUpdated() {
+		this._confirmPasswordInput?.addValidator(
+			'customError',
+			() => this.localize.term('user_passwordMismatch'),
+			() => this._confirmPasswordInput?.value !== this._newPasswordInput?.value,
+		);
+
 		if (!this.data?.user.unique) return;
 		const { data } = await this.#userItemRepository.requestItems([this.data.user.unique]);
 
@@ -81,55 +86,60 @@ export class UmbChangePasswordModalElement extends UmbModalBaseElement<
 		return html`
 			<uui-dialog-layout class="uui-text" headline=${this._headline}>
 				<uui-form>
-					<form id="ChangePasswordForm" @submit="${this.#onSubmit}">
-						${this._isCurrentUser ? this.#renderOldPasswordInput() : nothing}
+					<form id="ChangePasswordForm" @submit=${this.#onSubmit}>
+						${when(
+							this._isCurrentUser,
+							() => html`
+								<uui-form-layout-item style="margin-bottom: var(--uui-size-layout-2)">
+									<uui-label slot="label" id="oldPasswordLabel" for="oldPassword" required>
+										<umb-localize key="user_passwordCurrent">Current password</umb-localize>
+									</uui-label>
+									<uui-input-password
+										id="oldPassword"
+										name="oldPassword"
+										required
+										required-message="Current password is required">
+									</uui-input-password>
+								</uui-form-layout-item>
+							`,
+						)}
 						<uui-form-layout-item>
-							<uui-label id="newPasswordLabel" for="newPassword" slot="label" required>New password</uui-label>
+							<uui-label slot="label" id="newPasswordLabel" for="newPassword" required>
+								<umb-localize key="user_newPassword">New password</umb-localize>
+							</uui-label>
 							<uui-input-password
 								id="newPassword"
 								name="newPassword"
 								required
-								required-message="New password is required"></uui-input-password>
+								required-message="New password is required">
+							</uui-input-password>
 						</uui-form-layout-item>
 						<uui-form-layout-item>
-							<uui-label id="confirmPasswordLabel" for="confirmPassword" slot="label" required
-								>Confirm password</uui-label
-							>
+							<uui-label slot="label" id="confirmPasswordLabel" for="confirmPassword" required>
+								<umb-localize key="user_confirmNewPassword">Confirm new password</umb-localize>
+							</uui-label>
 							<uui-input-password
 								id="confirmPassword"
 								name="confirmPassword"
 								required
-								required-message="Confirm password is required"></uui-input-password>
+								required-message="Confirm password is required">
+							</uui-input-password>
 						</uui-form-layout-item>
 					</form>
 				</uui-form>
-
-				<uui-button slot="actions" @click=${this.#onClose} label="Cancel"></uui-button>
+				<uui-button slot="actions" label=${this.localize.term('general_cancel')} @click=${this.#onClose}></uui-button>
 				<uui-button
 					slot="actions"
 					type="submit"
-					label="Confirm"
-					look="primary"
+					form="ChangePasswordForm"
 					color="positive"
-					form="ChangePasswordForm"></uui-button>
+					look="primary"
+					label=${this.localize.term('general_confirm')}></uui-button>
 			</uui-dialog-layout>
 		`;
 	}
 
-	#renderOldPasswordInput() {
-		return html`
-			<uui-form-layout-item style="margin-bottom: var(--uui-size-layout-2)">
-				<uui-label id="oldPasswordLabel" for="oldPassword" slot="label" required>Old password</uui-label>
-				<uui-input-password
-					id="oldPassword"
-					name="oldPassword"
-					required
-					required-message="Old password is required"></uui-input-password>
-			</uui-form-layout-item>
-		`;
-	}
-
-	static override styles: CSSResultGroup = [
+	static override readonly styles = [
 		UmbTextStyles,
 		css`
 			uui-input-password {

src/Umbraco.Web.UI.Client/src/packages/user/change-password/modal/manifests.ts

@@ -3,6 +3,6 @@ export const manifests: Array<UmbExtensionManifest> = [
 		type: 'modal',
 		alias: 'Umb.Modal.ChangePassword',
 		name: 'Change Password Modal',
-		js: () => import('./change-password-modal.element.js'),
+		element: () => import('./change-password-modal.element.js'),
 	},
 ];