From 1341baaebaf9932952cf3fd65448564473188525 Mon Sep 17 00:00:00 2001 From: Martin Brennan Date: Thu, 24 Mar 2022 09:49:56 +1000 Subject: [PATCH] DEV: Use composerEventPrefix for paste in textarea-text-manipulation (#16262) In the commit d678ba11030e77808d59c0d8d425286cf399447e we added gif parsing support on paste, but we also slightly changed the isComposer check there, along with a change in chat this caused isComposer to be true (which is correct), however the event we fire is composer:insert-text which the chat composer does not pick up. Instead, we should use composerEventPrefix if it is present to fire the insert-text event, and if it is not present (e.g. for some custom composer that someone has implemented) fall back to the default. There is a companion commit for chat to handle this change there. --- .../app/components/composer-editor.js | 3 ++ .../app/mixins/composer-upload-uppy.js | 38 ++++++++++--------- .../app/mixins/textarea-text-manipulation.js | 17 ++++++++- 3 files changed, 38 insertions(+), 20 deletions(-) diff --git a/app/assets/javascripts/discourse/app/components/composer-editor.js b/app/assets/javascripts/discourse/app/components/composer-editor.js index eed18fe3b1a..71312232091 100644 --- a/app/assets/javascripts/discourse/app/components/composer-editor.js +++ b/app/assets/javascripts/discourse/app/components/composer-editor.js @@ -103,7 +103,10 @@ export default Component.extend(ComposerUploadUppy, { editorClass: ".d-editor", fileUploadElementId: "file-uploader", mobileFileUploaderId: "mobile-file-upload", + + // TODO (martin) Remove this once the chat plugin is using the new composerEventPrefix eventPrefix: "composer", + composerEventPrefix: "composer", uploadType: "composer", uppyId: "composer-editor-uppy", composerModel: alias("composer"), diff --git a/app/assets/javascripts/discourse/app/mixins/composer-upload-uppy.js b/app/assets/javascripts/discourse/app/mixins/composer-upload-uppy.js index 0442cf96972..929ab63c14f 100644 --- a/app/assets/javascripts/discourse/app/mixins/composer-upload-uppy.js +++ b/app/assets/javascripts/discourse/app/mixins/composer-upload-uppy.js @@ -67,9 +67,9 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { this.editorEl?.removeEventListener("paste", this.pasteEventListener); - this.appEvents.off(`${this.eventPrefix}:add-files`, this._addFiles); + this.appEvents.off(`${this.composerEventPrefix}:add-files`, this._addFiles); this.appEvents.off( - `${this.eventPrefix}:cancel-upload`, + `${this.composerEventPrefix}:cancel-upload`, this._cancelSingleUpload ); @@ -84,7 +84,7 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { }, _abortAndReset() { - this.appEvents.trigger(`${this.eventPrefix}:uploads-aborted`); + this.appEvents.trigger(`${this.composerEventPrefix}:uploads-aborted`); this._reset(); return false; }, @@ -97,9 +97,9 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { this.fileInputEl = document.getElementById(this.fileUploadElementId); const isPrivateMessage = this.get("composerModel.privateMessage"); - this.appEvents.on(`${this.eventPrefix}:add-files`, this._addFiles); + this.appEvents.on(`${this.composerEventPrefix}:add-files`, this._addFiles); this.appEvents.on( - `${this.eventPrefix}:cancel-upload`, + `${this.composerEventPrefix}:cancel-upload`, this._cancelSingleUpload ); @@ -136,7 +136,7 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { }); if (!isUploading) { - this.appEvents.trigger(`${this.eventPrefix}:uploads-aborted`); + this.appEvents.trigger(`${this.composerEventPrefix}:uploads-aborted`); } return isUploading; }, @@ -290,11 +290,11 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { uploadPlaceholder: placeholder, }; this.appEvents.trigger( - `${this.eventPrefix}:insert-text`, + `${this.composerEventPrefix}:insert-text`, placeholder ); this.appEvents.trigger( - `${this.eventPrefix}:upload-started`, + `${this.composerEventPrefix}:upload-started`, file.name ); }); @@ -316,14 +316,14 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { cacheShortUploadUrl(upload.short_url, upload); this.appEvents.trigger( - `${this.eventPrefix}:replace-text`, + `${this.composerEventPrefix}:replace-text`, this.placeholders[file.id].uploadPlaceholder.trim(), markdown ); this._resetUpload(file, { removePlaceholder: false }); this.appEvents.trigger( - `${this.eventPrefix}:upload-success`, + `${this.composerEventPrefix}:upload-success`, file.name, upload ); @@ -334,7 +334,9 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { this._uppyInstance.on("complete", () => { run(() => { - this.appEvents.trigger(`${this.eventPrefix}:all-uploads-complete`); + this.appEvents.trigger( + `${this.composerEventPrefix}:all-uploads-complete` + ); this._reset(); }); }); @@ -346,7 +348,7 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { Object.values(this.placeholders).forEach((data) => { run(() => { this.appEvents.trigger( - `${this.eventPrefix}:replace-text`, + `${this.composerEventPrefix}:replace-text`, data.uploadPlaceholder, "" ); @@ -356,7 +358,7 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { this.set("userCancelled", false); this._reset(); - this.appEvents.trigger(`${this.eventPrefix}:uploads-cancelled`); + this.appEvents.trigger(`${this.composerEventPrefix}:uploads-cancelled`); } }); @@ -381,7 +383,7 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { if (!this.userCancelled) { displayErrorForUpload(response || error, this.siteSettings, file.name); - this.appEvents.trigger(`${this.eventPrefix}:upload-error`, file); + this.appEvents.trigger(`${this.composerEventPrefix}:upload-error`, file); } if (this.inProgressUploads.length === 0) { @@ -434,7 +436,7 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { )}]()\n`; this.appEvents.trigger( - `${this.eventPrefix}:replace-text`, + `${this.composerEventPrefix}:replace-text`, placeholderData.uploadPlaceholder, placeholderData.processingPlaceholder ); @@ -445,7 +447,7 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { run(() => { let placeholderData = this.placeholders[file.id]; this.appEvents.trigger( - `${this.eventPrefix}:replace-text`, + `${this.composerEventPrefix}:replace-text`, placeholderData.processingPlaceholder, placeholderData.uploadPlaceholder ); @@ -458,7 +460,7 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { isCancellable: true, }); this.appEvents.trigger( - `${this.eventPrefix}:uploads-preprocessing-complete` + `${this.composerEventPrefix}:uploads-preprocessing-complete` ); }); } @@ -536,7 +538,7 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, { _resetUpload(file, opts) { if (opts.removePlaceholder) { this.appEvents.trigger( - `${this.eventPrefix}:replace-text`, + `${this.composerEventPrefix}:replace-text`, this.placeholders[file.id].uploadPlaceholder, "" ); diff --git a/app/assets/javascripts/discourse/app/mixins/textarea-text-manipulation.js b/app/assets/javascripts/discourse/app/mixins/textarea-text-manipulation.js index ab6aeab38a7..bb5c5dfd2d5 100644 --- a/app/assets/javascripts/discourse/app/mixins/textarea-text-manipulation.js +++ b/app/assets/javascripts/discourse/app/mixins/textarea-text-manipulation.js @@ -34,6 +34,13 @@ export function getHead(head, prev) { export default Mixin.create({ init() { this._super(...arguments); + + // fallback in the off chance someone has implemented a custom composer + // which does not define this + if (!this.composerEventPrefix) { + this.composerEventPrefix = "composer"; + } + generateLinkifyFunction(this.markdownOptions || {}).then((linkify) => { // When pasting links, we should use the same rules to match links as we do when creating links for a cooked post. this._cachedLinkify = linkify; @@ -456,7 +463,10 @@ export default Mixin.create({ plainText = plainText.replace(/\r/g, ""); const table = this._extractTable(plainText); if (table) { - this.appEvents.trigger("composer:insert-text", table); + this.appEvents.trigger( + `${this.composerEventPrefix}:insert-text`, + table + ); handled = true; } } @@ -508,7 +518,10 @@ export default Mixin.create({ } if (isComposer) { - this.appEvents.trigger("composer:insert-text", markdown); + this.appEvents.trigger( + `${this.composerEventPrefix}:insert-text`, + markdown + ); handled = true; } }