github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2024-11-25 17:57:04 +08:00
Code Issues Actions 46 Packages Projects Releases Wiki Activity

common: rewrite modal manager to not store vnode

Browse Source
This commit is contained in:
David Sevilla Martin 2020-03-11 18:41:48 -04:00
parent 22a031a3f1
commit 2ca078618b
No known key found for this signature in database
GPG Key ID: F764F1417E16B15F
4 changed files with 47 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
js/dist/forum.js vendored
View File

@ -15481,7 +15481,7 @@ var Application = /*#__PURE__*/function () {
_proto.showDebug = function showDebug(error) {
// this.alerts.dismiss(this.requestError.alert);
this.modal.show(_components_RequestErrorModal__WEBPACK_IMPORTED_MODULE_19__["default"].component({
this.modal.show(new _components_RequestErrorModal__WEBPACK_IMPORTED_MODULE_19__["default"]({
error: error
}));
};
@ -16818,7 +16818,7 @@ var Button = /*#__PURE__*/function (_Component) {
delete attrs.onclick;
}
return m("button", attrs, this.getButtonContent(iconName, attrs.loading, children));
return m("button", attrs, this.getButtonContent(iconName, loading, children));
}
/**
* Get the template for the button's content.
@ -17468,12 +17468,12 @@ __webpack_require__.r(__webpack_exports__);
/**
* The `ModalManager` component manages a modal dialog. Only one modal dialog
* can be shown at once; loading a new component into the ModalManager will
* overwrite the previous one.
*/
var ModalManager = /*#__PURE__*/function (_Component) {
Object(_babel_runtime_helpers_esm_inheritsLoose__WEBPACK_IMPORTED_MODULE_0__["default"])(ModalManager, _Component);
@ -17485,10 +17485,11 @@ var ModalManager = /*#__PURE__*/function (_Component) {
}
_this = _Component.call.apply(_Component, [this].concat(args)) || this;
_this.node = void 0;
_this.showing = void 0;
_this.hideTimeout = void 0;
_this.component = void 0;
_this.modal = null;
_this.modalProps = {};
_this.component = null;
return _this;
}
@ -17506,7 +17507,7 @@ var ModalManager = /*#__PURE__*/function (_Component) {
id: "Modal",
onclick: this.onclick.bind(this),
key: "modal"
}, this.node);
}, this.modal && m(this.modal, this.modalProps));
}
/**
* Show a modal dialog.
@ -17523,7 +17524,9 @@ var ModalManager = /*#__PURE__*/function (_Component) {
clearTimeout(this.hideTimeout);
this.showing = true;
this.node = component.tag ? component : component.render(); // if (app.current) app.current.retain = true;
this.modal = component.tag || component.constructor;
this.modalProps = component.props || component.attrs || {};
this.modalProps.oninit = this.onModalInit.bind(this); // if (app.current) app.current.retain = true;
m.redraw();
@ -17563,6 +17566,9 @@ var ModalManager = /*#__PURE__*/function (_Component) {
this.hideTimeout = setTimeout(function () {
return micromodal__WEBPACK_IMPORTED_MODULE_1__["default"].close('Modal');
});
this.modal = null;
this.component = null;
this.modalProps = {};
}
/**
* Clear content from the modal area.
@ -17587,6 +17593,14 @@ var ModalManager = /*#__PURE__*/function (_Component) {
if (this.component) {
this.component.onready();
}
}
/**
* Set component in ModalManager to current vnode state - a Modal instance
*/
;
_proto.onModalInit = function onModalInit(vnode) {
this.component = vnode.state;
};
return ModalManager;

2
js/dist/forum.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
js/src/common/Application.ts
View File

@ -303,6 +303,6 @@ export default abstract class Application {
private showDebug(error: RequestError) {
// this.alerts.dismiss(this.requestError.alert);
this.modal.show(RequestErrorModal.component({ error }));
this.modal.show(new RequestErrorModal({ error }));
}
}

33
js/src/common/components/ModalManager.tsx
View File

@ -1,8 +1,7 @@
import MicroModal from 'micromodal';
import Component from '../Component';
import Component, { ComponentProps } from '../Component';
import Modal from './Modal';
import { Vnode } from 'mithril';
/**
* The `ModalManager` component manages a modal dialog. Only one modal dialog
@ -10,11 +9,13 @@ import { Vnode } from 'mithril';
* overwrite the previous one.
*/
export default class ModalManager extends Component {
protected node: Vnode;
showing!: boolean;
hideTimeout!: number;
showing: boolean;
hideTimeout: number;
component?: Modal;
modal: typeof Modal | null = null;
modalProps: ComponentProps = {};
component: Modal | null = null;
oncreate(vnode) {
super.oncreate(vnode);
@ -25,7 +26,7 @@ export default class ModalManager extends Component {
view() {
return (
<div className="ModalManager modal" id="Modal" onclick={this.onclick.bind(this)} key="modal">
{this.node}
{this.modal && m(this.modal, this.modalProps)}
</div>
);
}
@ -33,7 +34,7 @@ export default class ModalManager extends Component {
/**
* Show a modal dialog.
*/
show(component) {
show(component: Modal) {
if (!(component instanceof Modal) && !(component.tag?.prototype instanceof Modal)) {
throw new Error('The ModalManager component can only show Modal components');
}
@ -41,7 +42,10 @@ export default class ModalManager extends Component {
clearTimeout(this.hideTimeout);
this.showing = true;
this.node = component.tag ? component : component.render();
this.modal = component.tag || component.constructor;
this.modalProps = component.props || component.attrs || {};
this.modalProps.oninit = this.onModalInit.bind(this);
// if (app.current) app.current.retain = true;
@ -85,6 +89,10 @@ export default class ModalManager extends Component {
// bit to give the `show` method the opportunity to prevent this from going
// ahead.
this.hideTimeout = setTimeout(() => MicroModal.close('Modal'));
this.modal = null;
this.component = null;
this.modalProps = {};
}
/**
@ -110,4 +118,11 @@ export default class ModalManager extends Component {
this.component.onready();
}
}
/**
* Set component in ModalManager to current vnode state - a Modal instance
*/
protected onModalInit(vnode) {
this.component = vnode.state;
}
}