From 0a4cea5e4c97bb5a904ad883c93f59f6413aa9c0 Mon Sep 17 00:00:00 2001 From: Sergey Mosin Date: Tue, 8 Oct 2024 09:47:47 -0400 Subject: [PATCH] make sure that KO bindings are re-applied --- .../compact-composer/js/CompactComposer.js | 28 +++++++++++++------ 1 file changed, 19 insertions(+), 9 deletions(-) diff --git a/plugins/compact-composer/js/CompactComposer.js b/plugins/compact-composer/js/CompactComposer.js index 288fb497c..5baea90a3 100644 --- a/plugins/compact-composer/js/CompactComposer.js +++ b/plugins/compact-composer/js/CompactComposer.js @@ -17,18 +17,28 @@ addEventListener('rl-view-model', e => { const vm = e.detail; if ('PopupsCompose' === vm.viewModelTemplateID && rl.settings.get('editorWysiwyg') === 'CompactComposer') { - vm.querySelector('.tabs label[for="tab-body"]').dataset.bind = "visible: canMailvelope"; + // add visible binding to the label + const bodyLabel = vm.querySelector('.tabs label[for="tab-body"]'); + bodyLabel.dataset.bind = 'visible: canMailvelope'; + // re-apply the binding + const labelNext = bodyLabel.nextElementSibling; + ko.removeNode(bodyLabel); + labelNext.parentElement.insertBefore(bodyLabel, labelNext); + ko.applyBindingAccessorsToNode(bodyLabel, null, vm); + // Now move the attachments tab to the bottom of the screen - const - input = vm.querySelector('.tabs input[value="attachments"]'), - label = vm.querySelector('.tabs label[for="tab-attachments"]'), - area = vm.querySelector('.tabs .attachmentAreaParent'); - input.remove(); - label.remove(); - area.remove(); + const area = vm.querySelector('.tabs .attachmentAreaParent'); + vm.querySelector('.tabs input[value="attachments"]').remove(); + vm.querySelector('.tabs label[for="tab-attachments"]').remove(); + area.querySelector('.no-attachments-desc').remove(); area.classList.add('compact'); - area.querySelector('.b-attachment-place').dataset.bind = "visible: addAttachmentEnabled(), css: {dragAndDropOver: dragAndDropVisible}"; vm.viewModelDom.append(area); + // Add and re-apply the bindings for the attachment-place + const place = area.querySelector('.b-attachment-place'); + ko.removeNode(place); + area.insertBefore(place, area.firstElementChild); + place.dataset.bind = 'visible: addAttachmentEnabled(), css: {dragAndDropOver: dragAndDropVisible}'; + ko.applyBindingAccessorsToNode(place, null, vm); // There is a better way to do this probably, // but we need this for drag and drop to work e.detail.attachmentsArea = e.detail.bodyArea;