From 30ace044699c27e7af86cd10130b82ba20ed3ec7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Chris=20Ch=C3=A1vez?= <xnpiochv@gmail.com>
Date: Tue, 20 May 2025 20:33:39 -0500
Subject: [PATCH] fix: clear buttons in advanced components editors in
 Libraries (#36752)

---
 cms/static/js/views/metadata.js               | 9 +++++++--
 cms/static/js/views/xblock_editor.js          | 5 +++--
 common/templates/xblock_v2/xblock_iframe.html | 2 +-
 3 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/cms/static/js/views/metadata.js b/cms/static/js/views/metadata.js
index 1dda68b309..07aa1bed97 100644
--- a/cms/static/js/views/metadata.js
+++ b/cms/static/js/views/metadata.js
@@ -60,13 +60,18 @@ define(
 
             /**
          * Returns just the modified metadata values, in the format used to persist to the server.
+         * Set `replaceNullWithDefault` to true to replace null values with the default values
          */
-            getModifiedMetadataValues: function() {
+            getModifiedMetadataValues: function(replaceNullWithDefault = false) {
                 var modified_values = {};
                 this.collection.each(
                     function(model) {
                         if (model.isModified()) {
-                            modified_values[model.getFieldName()] = model.getValue();
+                            let value = model.getValue();
+                            if (replaceNullWithDefault && value === null) {
+                                value = model.getDisplayValue();
+                            }
+                            modified_values[model.getFieldName()] = value
                         }
                     }
                 );
diff --git a/cms/static/js/views/xblock_editor.js b/cms/static/js/views/xblock_editor.js
index 52d08dc76f..b6bae05bb9 100644
--- a/cms/static/js/views/xblock_editor.js
+++ b/cms/static/js/views/xblock_editor.js
@@ -125,10 +125,11 @@ function($, _, gettext, BaseView, XBlockView, MetadataView, MetadataCollection)
         /**
              * Returns the metadata that has changed in the editor. This is a combination of the metadata
              * modified in the "Settings" editor, as well as any custom metadata provided by the component.
+             * Set `replaceNullWithDefault` to true to replace null values with the default values.
              */
-        getChangedMetadata: function() {
+        getChangedMetadata: function(replaceNullWithDefault = false) {
             var metadataEditor = this.getMetadataEditor();
-            return _.extend(metadataEditor.getModifiedMetadataValues(), this.getCustomMetadata());
+            return _.extend(metadataEditor.getModifiedMetadataValues(replaceNullWithDefault), this.getCustomMetadata());
         },
 
         /**
diff --git a/common/templates/xblock_v2/xblock_iframe.html b/common/templates/xblock_v2/xblock_iframe.html
index ab635a4af1..cd3096aa46 100644
--- a/common/templates/xblock_v2/xblock_iframe.html
+++ b/common/templates/xblock_v2/xblock_iframe.html
@@ -343,7 +343,7 @@
                         $('.save-button', passElement).bind('click', function() {
                             //event.preventDefault();
                             var error_message_div = $('.xblock-editor-error-message', passElement);
-                            const modifiedData = editorView.getChangedMetadata();
+                            const modifiedData = editorView.getChangedMetadata(true);
 
                             error_message_div.html();
                             error_message_div.css('display', 'none');