feat: fetch the document name and use in headlines and notifications

src/Umbraco.Web.UI.Client/src/packages/documents/documents/entity-actions/notifications/modal/document-notifications-modal.element.ts

@@ -1,3 +1,4 @@
+import { UmbDocumentItemRepository } from '../../../repository/index.js';
 import { UmbDocumentNotificationsRepository } from '../repository/document-notifications.repository.js';
 import type { UmbDocumentNotificationsModalData } from './document-notifications-modal.token.js';
 import type { UmbEntityUnique } from '@umbraco-cms/backoffice/entity';
@@ -19,9 +20,23 @@ export class UmbDocumentNotificationsModalElement extends UmbModalBaseElement<
 	@state()
 	private _settings: UmbDocumentNotificationSettings = [];
 
+	@state()
+	private _documentName = '';
+
 	override firstUpdated() {
 		this.#unique = this.data?.unique;
 		this.#readNotificationSettings();
+		this.#getDocumentName();
+	}
+
+	async #getDocumentName() {
+		if (!this.#unique) return;
+		// Should this be done here or in the action file?
+		const { data } = await new UmbDocumentItemRepository(this).requestItems([this.#unique]);
+		if (!data) return;
+		const item = data[0];
+		//TODO How do we ensure we get the correct variant?
+		this._documentName = item.variants[0]?.name;
 	}
 
 	async #readNotificationSettings() {
@@ -36,9 +51,13 @@ export class UmbDocumentNotificationsModalElement extends UmbModalBaseElement<
 		if (!this.#unique) return;
 
 		const subscribedActionIds = this._settings.filter((x) => x.subscribed).map((x) => x.actionId);
-		const { error } = await this.#documentNotificationsRepository.updateNotifications(this.#unique, {
-			subscribedActionIds,
-		});
+		const { error } = await this.#documentNotificationsRepository.updateNotifications(
+			this.#unique,
+			this._documentName,
+			{
+				subscribedActionIds,
+			},
+		);
 
 		if (error) return;
 		this._submitModal();
@@ -57,7 +76,7 @@ export class UmbDocumentNotificationsModalElement extends UmbModalBaseElement<
 	override render() {
 		return html`
 			<umb-body-layout headline=${this.localize.term('notifications_notifications')}>
-				<uui-box>
+				<uui-box .headline=${this.localize.term('notifications_editNotifications', this._documentName)}>
 					${repeat(
 						this._settings,
 						(setting) => setting.actionId,

src/Umbraco.Web.UI.Client/src/packages/documents/documents/entity-actions/notifications/repository/document-notifications.repository.ts

@@ -4,12 +4,15 @@ import { UmbControllerBase } from '@umbraco-cms/backoffice/class-api';
 import { UMB_NOTIFICATION_CONTEXT } from '@umbraco-cms/backoffice/notification';
 import type { UmbApi } from '@umbraco-cms/backoffice/extension-api';
 import type { UpdateDocumentNotificationsRequestModel } from '@umbraco-cms/backoffice/external/backend-api';
+import { UmbLocalizationController } from '@umbraco-cms/backoffice/localization-api';
 
 export class UmbDocumentNotificationsRepository extends UmbControllerBase implements UmbApi {
 	#dataSource = new UmbDocumentNotificationsServerDataSource(this);
 
 	#notificationContext?: typeof UMB_NOTIFICATION_CONTEXT.TYPE;
 
+	#localize = new UmbLocalizationController(this);
+
 	constructor(host: UmbControllerHost) {
 		super(host);
 
@@ -28,13 +31,15 @@ export class UmbDocumentNotificationsRepository extends UmbControllerBase implem
 		return { error };
 	}
 
-	async updateNotifications(unique: string, data: UpdateDocumentNotificationsRequestModel) {
+	async updateNotifications(unique: string, documentName: string, data: UpdateDocumentNotificationsRequestModel) {
 		if (!unique) throw new Error('Unique is missing');
 		if (!data) throw new Error('Data is missing');
 
 		const { error } = await this.#dataSource.update(unique, data);
 		if (!error) {
-			const notification = { data: { message: `Notification settings saved` } };
+			const notification = {
+				data: { message: this.#localize.term('notifications_notificationsSavedFor', documentName) },
+			};
 			this.#notificationContext?.peek('positive', notification);
 		}
 		return { error };