diff --git a/framework/core/js/src/common/components/ModalManager.tsx b/framework/core/js/src/common/components/ModalManager.tsx index d46899eec..8db7e25bf 100644 --- a/framework/core/js/src/common/components/ModalManager.tsx +++ b/framework/core/js/src/common/components/ModalManager.tsx @@ -24,16 +24,19 @@ export default class ModalManager extends Component { view(vnode: Mithril.VnodeDOM): Mithril.Children { const modal = this.attrs.state.modal; + const Tag = modal?.componentClass; return (
- {!!modal && - modal.componentClass.component({ - ...modal.attrs, - animateShow: this.animateShow.bind(this), - animateHide: this.animateHide.bind(this), - state: this.attrs.state, - })} + {!!Tag && ( + + )}
); } diff --git a/framework/core/js/src/common/states/ModalManagerState.ts b/framework/core/js/src/common/states/ModalManagerState.ts index 425de5150..30884c5e3 100644 --- a/framework/core/js/src/common/states/ModalManagerState.ts +++ b/framework/core/js/src/common/states/ModalManagerState.ts @@ -22,8 +22,15 @@ export default class ModalManagerState { modal: null | { componentClass: UnsafeModalClass; attrs?: Record; + key: number; } = null; + /** + * Used to force re-initialization of modals if a modal + * is replaced by another of the same type. + */ + private key = 0; + private closeTimeout?: NodeJS.Timeout; /** @@ -48,7 +55,7 @@ export default class ModalManagerState { if (this.closeTimeout) clearTimeout(this.closeTimeout); - this.modal = { componentClass, attrs }; + this.modal = { componentClass, attrs, key: this.key++ }; m.redraw.sync(); }