feat: support instant reloading of default content

adobe-rnd · Feb 13, 2024 · 914ad91 · 914ad91
1 parent 6bcb208
commit 914ad91
Showing 1 changed file with 36 additions and 19 deletions.
diff --git a/scripts/editor-support.js b/scripts/editor-support.js
@@ -12,29 +12,46 @@ async function handleEditorUpdate(event) {
 
   const resource = detail?.request?.target?.resource;
   if (!resource) return;
+  const updates = detail?.response?.updates;
+  if (!updates.length) return;
+  const { content } = updates[0];
 
   const element = document.querySelector(`[data-aue-resource="${resource}"]`);
-  const block = element?.parentElement?.closest('.block') || element?.closest('.block');
-  const blockResource = block?.getAttribute('data-aue-resource');
-  if (!block || !blockResource?.startsWith(connectionPrefix)) return;
+  if (element) {
+    const block = element.parentElement?.closest('.block') || element?.closest('.block');
+    if (block) {
+      const blockResource = block.getAttribute('data-aue-resource');
+      if (!blockResource || !blockResource.startsWith(connectionPrefix)) return;
+      const newBlockDocument = new DOMParser().parseFromString(content, 'text/html');
+      const newBlock = newBlockDocument?.querySelector(`[data-aue-resource="${blockResource}"]`);
+      if (newBlock) {
+        newBlock.style.display = 'none';
+        block.insertAdjacentElement('afterend', newBlock);
+        // decorate buttons and icons
+        decorateButtons(newBlock);
+        decorateIcons(newBlock);
+        // decorate and load the block
+        decorateBlock(newBlock);
+        await loadBlock(newBlock);
+        // remove the old block and show the new one
+        block.remove();
+        newBlock.style.display = null;
+      }
 
-  const updates = detail?.response?.updates;
-  if (updates.length > 0) {
-    const { content } = updates[0];
-    const newBlockDocument = new DOMParser().parseFromString(content, 'text/html');
-    const newBlock = newBlockDocument?.querySelector(`[data-aue-resource="${blockResource}"]`);
-    if (newBlock) {
-      newBlock.style.display = 'none';
-      block.insertAdjacentElement('afterend', newBlock);
+      return;
+    }
+
+    const updatedSection = new DOMParser().parseFromString(content, 'text/html');
+    const newElement = updatedSection?.querySelector(`[data-aue-resource="${resource}"]`);
+    if (newElement) {
+      newElement.style.display = 'none';
+      element.insertAdjacentElement('afterend', newElement);
       // decorate buttons and icons
-      decorateButtons(newBlock);
-      decorateIcons(newBlock);
-      // decorate and load the block
-      decorateBlock(newBlock);
-      await loadBlock(newBlock);
-      // remove the old block and show the new one
-      block.remove();
-      newBlock.style.display = null;
+      decorateButtons(newElement);
+      decorateIcons(newElement);
+      // remove the old element and show the new one
+      element.remove();
+      newElement.style.display = null;
     }
   }
 }