uploads: Fix duplicate drag-and-drop uploads during message editing.

Every time a user edits a message, we call the `setup_upload` method
which creates a new Uppy instance and adds some event listeners to
enable the upload process. These event listeners were not being removed
during the cleanup process of message editing, which led to multiple
event listeners being attached to the edit message form. Due to this,
multiple duplicate files would get attached via these multiple event
listeners if a user opened the edit message form for the same message
multiple times.

This commit adds the `deactivate_upload` method to perform all the
necessary cleanups while closing the edit message form. Via this
method, we remove the event listeners attached and close the Uppy
instance which cancels all uploads, resets progress and removes all
files.
This commit is contained in:
Sayam Samal 2024-02-14 04:25:36 +05:30 committed by Tim Abbott
parent 44b07094df
commit 65be62e4cb
2 changed files with 19 additions and 1 deletions

View File

@ -793,9 +793,15 @@ export function end_inline_topic_edit($row) {
function remove_uploads_from_row(row_id) { function remove_uploads_from_row(row_id) {
const uploads_for_row = upload.upload_objects_by_message_edit_row.get(row_id); const uploads_for_row = upload.upload_objects_by_message_edit_row.get(row_id);
if (!uploads_for_row) {
return;
}
// We need to cancel all uploads, reset their progress, // We need to cancel all uploads, reset their progress,
// and clear the files upon ending the edit. // and clear the files upon ending the edit.
uploads_for_row?.cancelAll(); upload.deactivate_upload(uploads_for_row, {
mode: "edit",
row: row_id,
});
// Since we removed all the uploads from the row, we should // Since we removed all the uploads from the row, we should
// now remove the corresponding upload object from the store. // now remove the corresponding upload object from the store.
upload.upload_objects_by_message_edit_row.delete(row_id); upload.upload_objects_by_message_edit_row.delete(row_id);

View File

@ -437,6 +437,18 @@ export function setup_upload(config) {
return uppy; return uppy;
} }
export function deactivate_upload(uppy, config) {
// Remove event listeners added for handling uploads.
$(get_item("file_input_identifier", config)).off("change");
get_item("banner_container", config).off("click");
get_item("drag_drop_container", config).off("dragover dragenter drop paste");
// Uninstall all plugins and close down the Uppy instance.
// Also runs uppy.cancelAll() before uninstalling - which
// cancels all uploads, resets progress and removes all files.
uppy.close();
}
export function initialize() { export function initialize() {
compose_upload_object = setup_upload({ compose_upload_object = setup_upload({
mode: "compose", mode: "compose",