FIX: Do not save bookmark if close (X) on modal is clicked (#9541)

* After this change the bookmark will still be saved if clicking out of the modal or pressing escape
* To achieve this I implemented an initiatedBy parameter for modal closing from d-modal. If clicking on the cross it is initiated by close, if clicking out of the modal it is by click out.
* These options can then be compared in controllers consuming onClose

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
This commit is contained in:
Martin Brennan 2020-04-29 08:45:06 +10:00 committed by GitHub
parent 4ecc258835
commit 0d519c78fb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 17 additions and 8 deletions

View File

@ -76,10 +76,12 @@ export default Component.extend({
$target.hasClass("modal-middle-container") || $target.hasClass("modal-middle-container") ||
$target.hasClass("modal-outer-container") $target.hasClass("modal-outer-container")
) { ) {
// Delegate click to modal close if clicked outside. // Send modal close (which bubbles to ApplicationRoute) if clicked outside.
// We do this because some CSS of ours seems to cover // We do this because some CSS of ours seems to cover the backdrop and makes
// the backdrop and makes it unclickable. // it unclickable.
$(".modal-header button.modal-close").click(); return (
this.attrs.closeModal && this.attrs.closeModal("initiatedByClickOut")
);
} }
}, },

View File

@ -84,7 +84,11 @@ export default Controller.extend(ModalFunctionality, {
* We always want to save the bookmark unless the user specifically * We always want to save the bookmark unless the user specifically
* clicks the save or cancel button to mimic browser behaviour. * clicks the save or cancel button to mimic browser behaviour.
*/ */
onClose() { onClose(opts = {}) {
if (opts.initiatedByCloseButton) {
this._closeWithoutSaving = true;
}
this._unbindKeyboardShortcuts(); this._unbindKeyboardShortcuts();
this._restoreGlobalShortcuts(); this._restoreGlobalShortcuts();
if (!this._closeWithoutSaving && !this._savingBookmarkManually) { if (!this._closeWithoutSaving && !this._savingBookmarkManually) {

View File

@ -155,7 +155,7 @@ const ApplicationRoute = DiscourseRoute.extend(OpenComposer, {
}, },
// Close the current modal, and destroy its state. // Close the current modal, and destroy its state.
closeModal() { closeModal(initiatedBy) {
const route = getOwner(this).lookup("route:application"); const route = getOwner(this).lookup("route:application");
let modalController = route.controllerFor("modal"); let modalController = route.controllerFor("modal");
const controllerName = modalController.get("name"); const controllerName = modalController.get("name");
@ -178,7 +178,10 @@ const ApplicationRoute = DiscourseRoute.extend(OpenComposer, {
`controller:${controllerName}` `controller:${controllerName}`
); );
if (controller && controller.onClose) { if (controller && controller.onClose) {
controller.onClose(); controller.onClose({
initiatedByCloseButton: initiatedBy === "initiatedByCloseButton",
initiatedByClickOut: initiatedBy === "initiatedByClickOut"
});
} }
modalController.set("name", null); modalController.set("name", null);
} }

View File

@ -3,7 +3,7 @@
<div class="modal-inner-container"> <div class="modal-inner-container">
<div class="modal-header"> <div class="modal-header">
{{#if dismissable}} {{#if dismissable}}
{{d-button icon="times" action=(route-action "closeModal") class="btn btn-flat modal-close close" title="modal.close"}} {{d-button icon="times" action=(route-action "closeModal" "initiatedByCloseButton") class="btn-flat modal-close close" title="modal.close"}}
{{/if}} {{/if}}
{{#if panels}} {{#if panels}}