mega refactor

src/Umbraco.Web.UI.Client/libs/modal/index.ts

@@ -1,4 +1,5 @@
 export * from './modal.context';
 export * from './modal-handler';
+export * from './modal-registration.controller';
 export * from './token/modal-token';
 export * from './modal.interfaces';

src/Umbraco.Web.UI.Client/libs/modal/modal-registration-controller.ts

@@ -1,15 +0,0 @@
-import { UmbController, UmbControllerHostInterface } from '@umbraco-cms/controller';
-
-/*
-export class UmbModalRegistrationController<UmbModalToken, ModalData, ModalResult> extends UmbController {
-	constructor(host: UmbControllerHostInterface, modalAlias: string | NewType<UmbModalToken, ModalData, ModalResult>) {
-		super(host);
-		this.key = config?.key || uuidv4();
-	}
-
-	updateSetup() {}
-
-	hostConnected(): void {}
-	hostDisconnected(): void {}
-}
-*/

src/Umbraco.Web.UI.Client/libs/modal/modal-registration.controller.ts

@@ -0,0 +1,85 @@
+import type { UmbRouteContext } from '../../src/core/router/route.context';
+// TODO: Be aware here we import a class from src!
+import { UMB_ROUTE_CONTEXT_TOKEN } from '../../src/core/router/route.context';
+import { UmbModalRouteBuilder, UmbModalRouteOptions, UmbModalRouteRegistration } from './modal-route-registration';
+import { UmbContextConsumerController } from '@umbraco-cms/backoffice/context-api';
+import { UmbModalToken } from '@umbraco-cms/backoffice/modal';
+import { UmbControllerHostInterface } from 'libs/controller/controller-host.mixin';
+import { UmbController } from 'libs/controller/controller.class';
+
+export type UmbModalRegistrationToken = UmbModalRouteRegistration;
+
+export class UmbModalRegistrationController<D extends object = object, R = any> extends UmbController {
+	#modalToken: UmbModalToken<D, R> | string;
+	#modalOptions: UmbModalRouteOptions<D, R>;
+	#routeContext?: UmbRouteContext;
+	#modalRegistration?: UmbModalRegistrationToken;
+	#uniqueParts;
+	//#urlBuilder?: UmbModalRouteBuilder; // TODO: not going to work, as this will not trigger a re-render of the host element.
+
+	constructor(
+		host: UmbControllerHostInterface,
+		alias: UmbModalToken<D, R> | string,
+		options: UmbModalRouteOptions<D, R>,
+		unique: Map<string, string | undefined> = new Map()
+	) {
+		super(host);
+		this.#modalToken = alias;
+		this.#modalOptions = {
+			...options,
+			/*getUrlBuilder: (urlBuilder) => {
+				this.#urlBuilder = urlBuilder;
+			},*/
+		};
+		this.#uniqueParts = unique;
+
+		new UmbContextConsumerController(host, UMB_ROUTE_CONTEXT_TOKEN, (_routeContext) => {
+			this.#routeContext = _routeContext;
+			this._registererModal();
+		});
+	}
+
+	/*
+	public getUrl(params: { [key: string]: string | number }) {
+		return this.#urlBuilder?.(params) || null;
+	}
+	*/
+
+	setUniqueIdentifier(identifier: string, value: string) {
+		this.#uniqueParts.set(identifier, value);
+	}
+
+	private _registererModal() {
+		if (!this.#routeContext) return;
+		if (this.#modalRegistration) {
+			this.#routeContext.unregisterModal(this.#modalRegistration);
+		}
+
+		const pathParts = Array.from(this.#uniqueParts.values());
+
+		// Check if there is any undefined values of unique map:
+		if (pathParts.some((value) => value === undefined)) return;
+
+		// Add the configured part of the path:
+		pathParts.push(this.#modalOptions.path);
+
+		const modifiedModalOptions = {
+			...this.#modalOptions,
+			path: pathParts.join('/'),
+		};
+
+		this.#modalRegistration = this.#routeContext?.registerModal(this.#modalToken, modifiedModalOptions);
+	}
+
+	hostConnected() {
+		if (!this.#modalRegistration) {
+			this._registererModal();
+		}
+	}
+	hostDisconnected(): void {
+		if (this.#modalRegistration) {
+			this.#routeContext?.unregisterModal(this.#modalRegistration);
+			this.#modalRegistration = undefined;
+		}
+	}
+}

src/Umbraco.Web.UI.Client/libs/modal/modal-route-registration.ts

@@ -0,0 +1,80 @@
+import type { Params } from 'router-slot';
+import { v4 as uuidv4 } from 'uuid';
+import { UmbModalHandler } from './modal-handler';
+import { UmbModalConfig, UmbModalContext } from './modal.context';
+import { UmbModalToken } from './token/modal-token';
+
+export type UmbModalRouteBuilder = (params: { [key: string]: string | number }) => string;
+
+export type UmbModalRouteOptions<UmbModalTokenData extends object = object, UmbModalTokenResult = unknown> = {
+	path: string;
+	config?: UmbModalConfig;
+	onSetup?: (routingInfo: Params) => UmbModalTokenData | false;
+	onSubmit?: (data: UmbModalTokenResult) => void | PromiseLike<void>;
+	onReject?: () => void;
+	getUrlBuilder?: (urlBuilder: UmbModalRouteBuilder) => void;
+};
+
+export class UmbModalRouteRegistration<D extends object = object, R = any> {
+	#key;
+	#modalAlias: UmbModalToken<D, R> | string;
+	#options: UmbModalRouteOptions<D, R>;
+
+	#modalHandler: UmbModalHandler<D, R> | undefined;
+
+	// Notice i removed the key in the transferring to this class.
+	constructor(modalAlias: UmbModalToken<D, R> | string, options: UmbModalRouteOptions<D, R>) {
+		this.#key = options.config?.key || uuidv4();
+		this.#modalAlias = modalAlias;
+		this.#options = options;
+	}
+
+	public get key() {
+		return this.#key;
+	}
+
+	public get alias() {
+		return this.#modalAlias;
+	}
+
+	public get path() {
+		return this.#options.path;
+	}
+
+	public get options() {
+		return this.#options;
+	}
+
+	/**
+	 * Returns true if the modal is currently active.
+	 */
+	public get active() {
+		return !!this.#modalHandler;
+	}
+
+	/**
+	 * Returns the modal handler if the modal is currently active. Otherwise its undefined.
+	 */
+	public get modalHandler() {
+		return this.#modalHandler;
+	}
+
+	routeSetup(modalContext: UmbModalContext, params: Params) {
+		const modalData = this.#options.onSetup?.(params);
+		if (modalData !== false) {
+			this.#modalHandler = modalContext.open(this.#modalAlias, modalData, { ...this.#options.config, key: this.#key });
+			this.#modalHandler.onSubmit().then(
+				(data) => {
+					this.#options.onSubmit?.(data);
+					this.#modalHandler = undefined;
+				},
+				() => {
+					this.#options.onReject?.();
+					this.#modalHandler = undefined;
+				}
+			);
+			return this.#modalHandler;
+		}
+		return null;
+	}
+}