simplify to one promise that rejects on close
This commit is contained in:
@@ -24,7 +24,7 @@ export class UmbModalElementPickerBase<T> extends UmbModalLayoutElement<UmbPicke
|
||||
}
|
||||
|
||||
close() {
|
||||
this.modalHandler?.close();
|
||||
this.modalHandler?.reject();
|
||||
}
|
||||
|
||||
protected _handleKeydown(e: KeyboardEvent, key: string) {
|
||||
|
||||
@@ -12,10 +12,9 @@ import { ManifestModal } from '@umbraco-cms/extensions-registry';
|
||||
|
||||
//TODO consider splitting this into two separate handlers
|
||||
export class UmbModalHandler {
|
||||
private _submitResolver: any;
|
||||
private _submitPromise: any;
|
||||
private _closeResolver: any;
|
||||
private _closePromise: any;
|
||||
private _submitResolver: any;
|
||||
private _submitRejecter: any;
|
||||
#host: UmbControllerHostInterface;
|
||||
|
||||
public modalElement: UUIModalDialogElement | UUIModalSidebarElement;
|
||||
@@ -47,11 +46,9 @@ export class UmbModalHandler {
|
||||
this.size = config?.size || this.size;
|
||||
|
||||
// TODO: Consider if its right to use Promises, or use another event based system? Would we need to be able to cancel an event, to then prevent the closing..?
|
||||
this._submitPromise = new Promise((resolve) => {
|
||||
this._submitPromise = new Promise((resolve, reject) => {
|
||||
this._submitResolver = resolve;
|
||||
});
|
||||
this._closePromise = new Promise((resolve) => {
|
||||
this._closeResolver = resolve;
|
||||
this._submitRejecter = reject;
|
||||
});
|
||||
|
||||
this.modalElement = this.#createContainerElement();
|
||||
@@ -95,17 +92,14 @@ export class UmbModalHandler {
|
||||
this.modalElement.close();
|
||||
}
|
||||
|
||||
public close() {
|
||||
this._closeResolver();
|
||||
public reject() {
|
||||
this._submitRejecter();
|
||||
this.modalElement.close();
|
||||
}
|
||||
|
||||
public onSubmit(): Promise<any> {
|
||||
return this._submitPromise;
|
||||
}
|
||||
public onClose(): Promise<any> {
|
||||
return this._closePromise;
|
||||
}
|
||||
|
||||
/* TODO: modals being part of the extension registry now means that a modal element can change over time.
|
||||
It makes this code a bit more complex. The main idea is to have the element as part of the modalHandler so it is possible to dispatch events from within the modal element to the one that opened it.
|
||||
|
||||
@@ -91,7 +91,7 @@ export class UmbModalContext {
|
||||
public close(key: string) {
|
||||
const modal = this.#modals.getValue().find((modal) => modal.key === key);
|
||||
if (modal) {
|
||||
modal.close();
|
||||
modal.reject();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -64,8 +64,8 @@ class MyElement extends UmbElementMixin(LitElement) {
|
||||
const options {'options go here'};
|
||||
const modalHandler = this.#modalContext?.open(SOME_MODAL_TOKEN), data, options);
|
||||
|
||||
modalHandler?.onClose().then((data) => {
|
||||
// if any data is supplied on close, it will be available here.
|
||||
modalHandler?.onSubmit().then((data) => {
|
||||
// if modal submitted, then data is supplied here.
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user