Fix toast notification can not be closed

src/Umbraco.Web.UI.Client/src/packages/core/components/backoffice-modal-container/backoffice-modal-container.element.ts

@@ -85,6 +85,14 @@
 	}
 
 	#onCloseEnd(key: string) {
+		//move notification container out of modal container
+		var parentNode = this.parentNode;
+		var uuiModalContainer = this.renderRoot.querySelector('uui-modal-container');
+		var modalSidebar = uuiModalContainer?.querySelector('uui-modal-sidebar') as any;
+		if(parentNode){
+			parentNode.insertBefore(modalSidebar.shadowRoot.querySelector('dialog').querySelector('umb-backoffice-notification-container'), this);
+		}
+
 		this._modalManager?.remove(key);
 	}
 
@@ -109,6 +117,32 @@
 		`;
 	}
 
+	async addNotificationContainer(){
+		const modalContainer = this.renderRoot.querySelector('uui-modal-container');
+		if(!modalContainer){
+			return;
+		}
+
+		await modalContainer.updateComplete;
+
+		var modalSidebar = modalContainer.querySelector('uui-modal-sidebar') as any;
+		if (!modalSidebar) {
+			return;
+		}
+
+		var dialog = modalSidebar.shadowRoot?.querySelector('dialog');
+		if(!dialog){
+			return
+		}
+
+		//move notification container into modal container
+		dialog.insertBefore((this.parentNode as HTMLElement).querySelector('umb-backoffice-notification-container'), dialog.firstChild);
+	}
+
+	override async updated(){
+		await Promise.all([this.updateComplete, this.addNotificationContainer()]);
+	}
+
 	static override styles: CSSResultGroup = [
 		UmbTextStyles,
 		css`