emdash 1.0.1 → 1.2.0

package/dist/astro/middleware/request-context.mjs

@@ -1,11 +1,11 @@
 import "../../after-PcEvMY_6.mjs";
 import { getRequestContext, runWithContext } from "../../request-context.mjs";
 import "../../options-DhrI7eMv.mjs";
-import "../../base64-DvnNgP7e.mjs";
-import { a as resolveSecretsCached } from "../../secrets-CIi0nFiR.mjs";
-import { n as parseContentId, r as verifyPreviewToken } from "../../tokens-B_ffPF1q.mjs";
-import { t as escapeHtml } from "../../escape-B1GM0yJU.mjs";
-import { n as generateVisualEditingActionToken, t as VISUAL_ACTION_TOKEN_INVALID } from "../../action-token-D2KE1Rqf.mjs";
+import { a as resolveSecretsCached } from "../../secrets-Cc_O3Kp-.mjs";
+import "../../base64-BQBZwXCx.mjs";
+import { n as parseContentId, r as verifyPreviewToken } from "../../tokens-j5L0as2H.mjs";
+import { t as escapeHtml } from "../../escape-ESFhYzwG.mjs";
+import { n as generateVisualEditingActionToken, t as VISUAL_ACTION_TOKEN_INVALID } from "../../action-token-BdWad2YG.mjs";
 import { defineMiddleware } from "astro:middleware";
 import virtualConfig from "virtual:emdash/config";
 import { loadVisualEditingToolbarLabels } from "@emdash-cms/admin/locales/server";
@@ -703,6 +703,7 @@ function renderToolbar(config) {
   var visualActionRefreshTimer = null;
 
   function showVisualActionRecovery() {
+    waitingForPublish = false;
     if (visualActionRefreshTimer !== null) clearTimeout(visualActionRefreshTimer);
     visualActionRefreshTimer = null;
     statusEl.innerHTML = ${inlineScriptJson(recoveryBadge)};
@@ -711,6 +712,7 @@ function renderToolbar(config) {
   }
 
   function showPublishError(message) {
+    waitingForPublish = false;
     statusEl.textContent = message || toolbarLabels.publishFailed;
     publishBtn.disabled = false;
     publishBtn.textContent = toolbarLabels.publish;
@@ -778,7 +780,20 @@ function renderToolbar(config) {
   // --- Save status tracking ---
   var saveState = "idle"; // idle | unsaved | saving | saved | error
   var saveHideTimer = null;
-  var pendingSavePromise = null;
+  var pendingSaves = [];
+  var waitingForPublish = false;
+
+  function trackSave(save) {
+    var settled = save.then(untrack, untrack);
+    function untrack() {
+      pendingSaves = pendingSaves.filter(function(pending) { return pending !== settled; });
+    }
+    pendingSaves.push(settled);
+  }
+
+  function badgeHtml(kind, label) {
+    return '<span class="emdash-tb-badge emdash-tb-badge--' + kind + '">' + escapeAttr(label) + '</span>';
+  }
 
   function setSaveState(state) {
     saveState = state;
@@ -786,20 +801,20 @@ function renderToolbar(config) {
 
     switch (state) {
       case "unsaved":
-        saveStatusEl.innerHTML = '<span class="emdash-tb-badge emdash-tb-badge--unsaved">Unsaved</span>';
+        saveStatusEl.innerHTML = badgeHtml("unsaved", toolbarLabels.unsaved);
         break;
       case "saving":
-        saveStatusEl.innerHTML = '<span class="emdash-tb-badge emdash-tb-badge--saving">Saving\u2026</span>';
+        saveStatusEl.innerHTML = badgeHtml("saving", toolbarLabels.saving);
         break;
       case "saved":
-        saveStatusEl.innerHTML = '<span class="emdash-tb-badge emdash-tb-badge--saved">Saved</span>';
+        saveStatusEl.innerHTML = badgeHtml("saved", toolbarLabels.saved);
         saveHideTimer = setTimeout(function() {
           saveStatusEl.innerHTML = "";
           saveState = "idle";
         }, 2000);
         break;
       case "error":
-        saveStatusEl.innerHTML = '<span class="emdash-tb-badge emdash-tb-badge--error">Save failed</span>';
+        saveStatusEl.innerHTML = badgeHtml("error", toolbarLabels.saveFailed);
         saveHideTimer = setTimeout(function() {
           saveStatusEl.innerHTML = "";
           saveState = "idle";
@@ -818,6 +833,14 @@ function renderToolbar(config) {
     }
   });
 
+  // The inline Portable Text editor sends its own save requests and reports
+  // each one here, so publish() can wait for it.
+  document.addEventListener("emdash:save-pending", function(e) {
+    if (e.detail && e.detail.done) {
+      trackSave(e.detail.done);
+    }
+  });
+
   document.addEventListener("emdash:content-changed", function(e) {
     var detail = e.detail || {};
     if (detail.collection && detail.id) {
@@ -855,15 +878,15 @@ function renderToolbar(config) {
       }
 
       if (ref.status === "draft") {
-        statusEl.innerHTML = '<span class="emdash-tb-badge emdash-tb-badge--draft">Draft</span>';
+        statusEl.innerHTML = badgeHtml("draft", toolbarLabels.draft);
         publishBtn.style.display = "";
         publishBtn.onclick = function() { publish(ref.collection, ref.id); };
       } else if (ref.status === "published" && ref.hasDraft) {
-        statusEl.innerHTML = '<span class="emdash-tb-badge emdash-tb-badge--pending">Unpublished changes</span>';
+        statusEl.innerHTML = badgeHtml("pending", toolbarLabels.unpublishedChanges);
         publishBtn.style.display = "";
         publishBtn.onclick = function() { publish(ref.collection, ref.id); };
       } else if (ref.status === "published") {
-        statusEl.innerHTML = '<span class="emdash-tb-badge emdash-tb-badge--published">Published</span>';
+        statusEl.innerHTML = badgeHtml("published", toolbarLabels.published);
         publishBtn.style.display = "none";
       }
     } catch (e) {
@@ -873,14 +896,15 @@ function renderToolbar(config) {
 
   // Publish action
   function publish(collection, id) {
-    if (pendingSavePromise) {
-      pendingSavePromise.then(function() { publish(collection, id); });
-      return;
-    }
-
+    waitingForPublish = true;
     publishBtn.disabled = true;
     publishBtn.textContent = toolbarLabels.publishing;
 
+    if (pendingSaves.length) {
+      Promise.all(pendingSaves).then(function() { publish(collection, id); });
+      return;
+    }
+
     ecFetch("/_emdash/api/visual-editing/content/" + encodeURIComponent(collection) + "/" + encodeURIComponent(id) + "/publish", {
       method: "POST",
       credentials: "same-origin",
@@ -909,6 +933,7 @@ function renderToolbar(config) {
       }
     })
     .catch(function(err) {
+      waitingForPublish = false;
       publishBtn.disabled = false;
       publishBtn.textContent = toolbarLabels.publish;
       console.error("Publish failed:", err);
@@ -966,7 +991,7 @@ function renderToolbar(config) {
   // succeeded, after the save badge already shows the outcome.
   function saveField(collection, id, field, value) {
     setSaveState("saving");
-    return ecFetch("/_emdash/api/content/" + encodeURIComponent(collection) + "/" + encodeURIComponent(id), {
+    var saved = ecFetch("/_emdash/api/content/" + encodeURIComponent(collection) + "/" + encodeURIComponent(id), {
       method: "PUT",
       credentials: "same-origin",
       headers: { "Content-Type": "application/json" },
@@ -988,13 +1013,17 @@ function renderToolbar(config) {
       console.error("Save failed:", err);
       return false;
     });
+    trackSave(saved);
+    return saved;
   }
 
   function showUnpublishedChanges(collection, id) {
-    statusEl.innerHTML = '<span class="emdash-tb-badge emdash-tb-badge--pending">Unpublished changes</span>';
+    statusEl.innerHTML = badgeHtml("pending", toolbarLabels.unpublishedChanges);
     publishBtn.style.display = "";
-    publishBtn.disabled = false;
-    publishBtn.textContent = "Publish";
+    if (!waitingForPublish) {
+      publishBtn.disabled = false;
+      publishBtn.textContent = toolbarLabels.publish;
+    }
     publishBtn.onclick = function() { publish(collection, id); };
   }
 
@@ -1063,11 +1092,7 @@ function renderToolbar(config) {
 
       var newValue = readText().trim();
       if (newValue !== originalText.trim()) {
-        pendingSavePromise = saveField(annotation.collection, annotation.id, annotation.field, newValue).then(function() {
-          pendingSavePromise = null;
-        }, function() {
-          pendingSavePromise = null;
-        });
+        saveField(annotation.collection, annotation.id, annotation.field, newValue);
       } else {
         setSaveState("idle");
       }
@@ -1204,7 +1229,7 @@ function renderToolbar(config) {
     // Build popover HTML
     var html = '';
     html += '<div class="emdash-img-popover-header">';
-    html += '  <span class="emdash-img-popover-title">Image</span>';
+    html += '  <span class="emdash-img-popover-title">' + escapeAttr(toolbarLabels.image) + '</span>';
     html += '  <button class="emdash-img-popover-close" data-action="close">&times;</button>';
     html += '</div>';
     html += '<div class="emdash-img-popover-body" id="emdash-img-main">';
@@ -1212,22 +1237,22 @@ function renderToolbar(config) {
     if (currentSrc) {
       html += '<img class="emdash-img-preview" src="' + escapeAttr(currentSrc) + '" alt="" />';
     } else {
-      html += '<div class="emdash-img-empty">No image selected</div>';
+      html += '<div class="emdash-img-empty">' + escapeAttr(toolbarLabels.noImageSelected) + '</div>';
     }
 
     html += '<div class="emdash-img-field">';
-    html += '  <label for="emdash-img-alt">Alt text</label>';
-    html += '  <input type="text" id="emdash-img-alt" value="' + escapeAttr(currentAlt) + '" placeholder="Describe the image" />';
+    html += '  <label for="emdash-img-alt">' + escapeAttr(toolbarLabels.altText) + '</label>';
+    html += '  <input type="text" id="emdash-img-alt" value="' + escapeAttr(currentAlt) + '" placeholder="' + escapeAttr(toolbarLabels.altTextPlaceholder) + '" />';
     html += '</div>';
 
     html += '<div class="emdash-img-actions">';
-    html += '  <button class="emdash-img-btn emdash-img-btn--primary" data-action="browse">Replace</button>';
+    html += '  <button class="emdash-img-btn emdash-img-btn--primary" data-action="browse">' + escapeAttr(toolbarLabels.replaceImage) + '</button>';
     html += '  <label class="emdash-img-btn" style="cursor:pointer">';
-    html += '    Upload';
+    html += '    ' + escapeAttr(toolbarLabels.uploadImage);
     html += '    <input type="file" accept="image/*" id="emdash-img-upload" style="display:none" />';
     html += '  </label>';
     if (currentSrc) {
-      html += '  <button class="emdash-img-btn emdash-img-btn--danger" data-action="remove">Remove</button>';
+      html += '  <button class="emdash-img-btn emdash-img-btn--danger" data-action="remove">' + escapeAttr(toolbarLabels.removeImage) + '</button>';
     }
     html += '</div>';
     html += '</div>';
@@ -1362,10 +1387,10 @@ function renderToolbar(config) {
     browser.className = "emdash-img-browser";
 
     browser.innerHTML = '<div class="emdash-img-browser-header">' +
-      '<span class="emdash-img-browser-title">Media Library</span>' +
-      '<button class="emdash-img-browser-back">Back</button>' +
+      '<span class="emdash-img-browser-title">' + escapeAttr(toolbarLabels.mediaLibrary) + '</span>' +
+      '<button class="emdash-img-browser-back">' + escapeAttr(toolbarLabels.back) + '</button>' +
       '</div>' +
-      '<div class="emdash-img-loading">Loading\u2026</div>';
+      '<div class="emdash-img-loading">' + escapeAttr(toolbarLabels.loading) + '</div>';
 
     popover.appendChild(browser);
 
@@ -1386,7 +1411,7 @@ function renderToolbar(config) {
       if (items.length === 0) {
         var empty = document.createElement("div");
         empty.className = "emdash-img-loading";
-        empty.textContent = "No images found";
+        empty.textContent = toolbarLabels.noImagesFound;
         browser.appendChild(empty);
         return;
       }
@@ -1414,7 +1439,7 @@ function renderToolbar(config) {
     })
     .catch(function(err) {
       var loadingEl = browser.querySelector(".emdash-img-loading");
-      if (loadingEl) loadingEl.textContent = "Failed to load media";
+      if (loadingEl) loadingEl.textContent = toolbarLabels.mediaLoadFailed;
       console.error("Media fetch error:", err);
     });
   }
@@ -1485,7 +1510,7 @@ function renderToolbar(config) {
     if (browserEl) browserEl.remove();
     if (mainBody) {
       mainBody.innerHTML = '<div class="emdash-img-uploading">' +
-        '<span>Uploading ' + escapeAttr(file.name) + '\u2026</span>' +
+        '<span>' + escapeAttr(toolbarLabels.uploadingFile.replace("{filename}", function() { return file.name; })) + '</span>' +
         '</div>';
       mainBody.style.display = "";
     }
@@ -1694,22 +1719,36 @@ async function renderEditorToolbar(context, config) {
 function optOutOfRouteCache(cache) {
 	cache?.set(false);
 }
+function isHtmlResponse(response) {
+	return response.headers.get("content-type")?.includes("text/html") ?? false;
+}
+const DOCUMENT_START_RE = /^\s*<(?:!doctype|html)\b/i;
 /**
-* Inject HTML before `</body>` if the response is an HTML page with a body
-* end tag. Does not touch cache headers — callers decide whether the result
-* is still shareable. `injected` tells the caller whether anything changed.
+* Inject HTML before the page's closing `</body>` if the response is a whole
+* HTML document with one. Does not touch cache headers — callers decide
+* whether the result is still shareable. `injected` tells the caller whether
+* the result carries the injected HTML.
+*
+* `Astro.rewrite()` runs this middleware again for the rewritten route inside
+* the original request, so the response can already contain the HTML; `marker`
+* identifies it so it is injected only once.
 */
-async function injectBeforeBodyEnd(response, htmlToInject) {
-	if (!response.headers.get("content-type")?.includes("text/html")) return {
+async function injectBeforeBodyEnd(response, htmlToInject, marker) {
+	if (!isHtmlResponse(response)) return {
 		response,
 		injected: false
 	};
 	const html = await response.text();
-	if (!html.includes("</body>")) return {
+	if (html.includes(marker)) return {
+		response: new Response(html, response),
+		injected: true
+	};
+	const bodyEnd = DOCUMENT_START_RE.test(html) ? html.lastIndexOf("</body>") : -1;
+	if (bodyEnd === -1) return {
 		response: new Response(html, response),
 		injected: false
 	};
-	const injected = html.replace("</body>", `${htmlToInject}</body>`);
+	const injected = html.slice(0, bodyEnd) + htmlToInject + html.slice(bodyEnd);
 	return {
 		response: new Response(injected, {
 			status: response.status,
@@ -1720,10 +1759,13 @@ async function injectBeforeBodyEnd(response, htmlToInject) {
 }
 /**
 * Inject toolbar HTML into a response if it's an HTML page.
-* Returns the original response if not HTML.
+* Returns the original response if not HTML, without calling
+* `renderToolbarHtml`, which loads labels and, for an editor, resolves the
+* preview secret.
 */
-async function injectToolbar(response, toolbarHtml, routeCache) {
-	const result = await injectBeforeBodyEnd(response, toolbarHtml);
+async function injectToolbar(response, renderToolbarHtml, routeCache) {
+	if (!isHtmlResponse(response)) return response;
+	const result = await injectBeforeBodyEnd(response, await renderToolbarHtml(), "id=\"emdash-toolbar\"");
 	if (result.injected) {
 		result.response.headers.set("Cache-Control", "private, no-store");
 		optOutOfRouteCache(routeCache);
@@ -1736,7 +1778,7 @@ async function injectToolbar(response, toolbarHtml, routeCache) {
 * stays fully shareable.
 */
 async function injectBootstrap(response) {
-	return (await injectBeforeBodyEnd(response, renderToolbarBootstrap())).response;
+	return (await injectBeforeBodyEnd(response, renderToolbarBootstrap(), "<!-- EmDash Toolbar Bootstrap -->")).response;
 }
 /**
 * Redirect an `_edit` URL to its canonical form (same URL without the param).
@@ -1769,7 +1811,7 @@ const onRequest = defineMiddleware(async (context, next) => {
 		}, async () => {
 			const response = await next();
 			if (!hasEditCookie || toolbarMode === false) return response;
-			return injectToolbar(response, renderToolbar({
+			return injectToolbar(response, async () => renderToolbar({
 				editMode: true,
 				isPreview: false,
 				labels: await loadVisualEditingToolbarLabels(context.request),
@@ -1829,20 +1871,17 @@ const onRequest = defineMiddleware(async (context, next) => {
 			response = new Response(response.body, response);
 			response.headers.set("Cache-Control", "private, no-store");
 		}
-		if (isEditor && toolbarMode !== false) {
-			const toolbarHtml = await renderEditorToolbar(context, {
-				editMode,
-				isPreview: !!preview
-			});
-			return injectToolbar(response, toolbarHtml, routeCache);
-		}
+		if (isEditor && toolbarMode !== false) return injectToolbar(response, () => renderEditorToolbar(context, {
+			editMode,
+			isPreview: !!preview
+		}), routeCache);
 		if (toolbarMode === "client" && !isEditor && !preview) return injectBootstrap(response);
 		return response;
 	});
 	if (isEditor) {
 		if (toolbarMode === false) return next();
 		if (toolbarMode === "client" && !hasEditParam) return injectBootstrap(await next());
-		return injectToolbar(await next(), await renderEditorToolbar(context, {
+		return injectToolbar(await next(), () => renderEditorToolbar(context, {
 			editMode: false,
 			isPreview: false
 		}), routeCache);