emdash 0.37.0 → 0.39.0

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

@@ -1,11 +1,14 @@
-import "../../after-CBU2vkoO.mjs";
+import "../../after-PcEvMY_6.mjs";
 import { getRequestContext, runWithContext } from "../../request-context.mjs";
-import "../../base64-CvLhUKQv.mjs";
-import "../../options-BHPeIbBd.mjs";
-import { n as parseContentId, r as verifyPreviewToken } from "../../tokens-BCO1oruF.mjs";
-import { i as resolveSecretsCached } from "../../secrets-rEtHt-6z.mjs";
+import "../../options-D5WcorD5.mjs";
+import "../../base64-DvnNgP7e.mjs";
+import { a as resolveSecretsCached } from "../../secrets-DNgVgz_e.mjs";
+import { n as parseContentId, r as verifyPreviewToken } from "../../tokens-Ns02GAma.mjs";
+import { t as escapeHtml } from "../../escape-DN4Qmjsl.mjs";
+import { n as generateVisualEditingActionToken, t as VISUAL_ACTION_TOKEN_INVALID } from "../../action-token-On1sot_c.mjs";
 import { defineMiddleware } from "astro:middleware";
 import virtualConfig from "virtual:emdash/config";
+import { loadVisualEditingToolbarLabels } from "@emdash-cms/admin/locales/server";
 
 //#region src/visual-editing/toolbar-bootstrap.ts
 /**
@@ -21,7 +24,7 @@ import virtualConfig from "virtual:emdash/config";
 * Clicking it verifies the session server-side and reloads the page with the
 * `_edit` query param — that URL is always rendered fresh with the full
 * server-side toolbar. Logged-out browsers pay one localStorage read and
-* nothing else. See Discussion #1742.
+* nothing else.
 */
 /**
 * Non-secret localStorage flag set by the admin SPA when an editor session
@@ -37,6 +40,8 @@ const EDITOR_FLAG_KEY = "emdash-editor";
 * `@emdash-cms/admin`.
 */
 const TOOLBAR_DISMISSED_KEY = "emdash-toolbar-dismissed";
+/** Localized bootstrap labels written by the admin SPA for this browser. */
+const TOOLBAR_LABELS_KEY = "emdash-toolbar-labels";
 /**
 * Query param that requests a fresh (never cached) editor render. Presence is
 * verified server-side: non-editors are redirected to the canonical URL.
@@ -46,15 +51,37 @@ function renderToolbarBootstrap() {
 	return `
 <!-- EmDash Toolbar Bootstrap -->
 <script>
-(function() {
-  var flag, dismissed;
+(function mountToolbar() {
+  var flag, dismissed, labelsRaw;
+  var labels = null;
   try {
     flag = localStorage.getItem("${EDITOR_FLAG_KEY}");
     dismissed = localStorage.getItem("${TOOLBAR_DISMISSED_KEY}");
+    labelsRaw = localStorage.getItem("${TOOLBAR_LABELS_KEY}");
   } catch (e) {
     return;
   }
   if (!flag || dismissed) return;
+  if (labelsRaw) {
+    try {
+      var storedLabels = JSON.parse(labelsRaw);
+      if (storedLabels && typeof storedLabels.editMode === "string" && typeof storedLabels.hideToolbar === "string") {
+        labels = storedLabels;
+      }
+    } catch (e) {}
+  }
+  if (!labels) {
+    fetch("/_emdash/api/visual-editing/toolbar-labels", { credentials: "same-origin" })
+      .then(function(response) { return response.ok ? response.json() : null; })
+      .then(function(body) {
+        var fetched = body && body.data;
+        if (!fetched || typeof fetched.editMode !== "string" || typeof fetched.hideToolbar !== "string") return;
+        try { localStorage.setItem("${TOOLBAR_LABELS_KEY}", JSON.stringify(fetched)); } catch (e) { return; }
+        mountToolbar();
+      })
+      .catch(function() {});
+    return;
+  }
   // The server toolbar is present on _edit / edit-mode / preview renders.
   if (document.getElementById("emdash-toolbar")) return;
 
@@ -73,13 +100,13 @@ function renderToolbarBootstrap() {
   divider.style.cssText = "width:1px;height:16px;background:rgba(255,255,255,0.15);";
 
   var editBtn = document.createElement("button");
-  editBtn.textContent = "Edit";
+  editBtn.textContent = labels.editMode;
   editBtn.style.cssText = "padding:4px 12px;background:#3b82f6;color:#fff;border:none;border-radius:999px;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;";
 
   var closeBtn = document.createElement("button");
   closeBtn.textContent = "\\u00d7";
-  closeBtn.title = "Hide toolbar";
-  closeBtn.setAttribute("aria-label", "Hide toolbar");
+  closeBtn.title = labels.hideToolbar;
+  closeBtn.setAttribute("aria-label", labels.hideToolbar);
   closeBtn.style.cssText = "background:none;border:none;color:#666;cursor:pointer;font-size:16px;padding:0 2px;line-height:1;font-family:inherit;";
 
   editBtn.addEventListener("click", function() {
@@ -127,8 +154,14 @@ function renderToolbarBootstrap() {
 
 //#endregion
 //#region src/visual-editing/toolbar.ts
+const SCRIPT_LINE_SEPARATOR_RE = /\u2028/g;
+const SCRIPT_PARAGRAPH_SEPARATOR_RE = /\u2029/g;
+function inlineScriptJson(value) {
+	return JSON.stringify(value).replaceAll("<", "\\u003c").replace(SCRIPT_LINE_SEPARATOR_RE, "\\u2028").replace(SCRIPT_PARAGRAPH_SEPARATOR_RE, "\\u2029");
+}
 function renderToolbar(config) {
-	const { editMode, isPreview } = config;
+	const { editMode, isPreview, actionToken = "", labels } = config;
+	const recoveryBadge = `<span class="emdash-tb-badge emdash-tb-badge--error">${escapeHtml(labels.sessionExpired)}</span>`;
 	return `
 <!-- EmDash Visual Editing Toolbar -->
 <div id="emdash-toolbar" data-edit-mode="${editMode}" data-preview="${isPreview}">
@@ -137,25 +170,25 @@ function renderToolbar(config) {
 
     <div class="emdash-tb-divider"></div>
 
-    <label class="emdash-tb-toggle" title="Toggle edit mode">
+    <label class="emdash-tb-toggle" title="${escapeHtml(labels.editMode)}">
       <input type="checkbox" id="emdash-edit-toggle" ${editMode ? "checked" : ""} />
       <span class="emdash-tb-toggle-track">
         <span class="emdash-tb-toggle-thumb"></span>
       </span>
-      <span class="emdash-tb-toggle-label">Edit</span>
+      <span class="emdash-tb-toggle-label">${escapeHtml(labels.editMode)}</span>
     </label>
 
     <span class="emdash-tb-status" id="emdash-tb-status"></span>
 
     <span class="emdash-tb-save-status" id="emdash-tb-save-status"></span>
 
-    <a class="emdash-tb-admin" id="emdash-tb-admin" href="#" target="emdash-admin" style="display:none" title="Open in admin">
+    <a class="emdash-tb-admin" id="emdash-tb-admin" href="#" target="emdash-admin" style="display:none" title="${escapeHtml(labels.openInAdmin)}">
       <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg>
     </a>
 
-    <button class="emdash-tb-publish" id="emdash-tb-publish" style="display:none">Publish</button>
+    <button class="emdash-tb-publish" id="emdash-tb-publish" style="display:none">${escapeHtml(labels.publish)}</button>
 
-    <button class="emdash-tb-dismiss" id="emdash-tb-dismiss" title="Hide toolbar" aria-label="Hide toolbar">&times;</button>
+    <button class="emdash-tb-dismiss" id="emdash-tb-dismiss" title="${escapeHtml(labels.hideToolbar)}" aria-label="${escapeHtml(labels.hideToolbar)}">&times;</button>
   </div>
 </div>
 
@@ -664,6 +697,60 @@ function renderToolbar(config) {
   }
 
   var isEditMode = toolbar.getAttribute("data-edit-mode") === "true";
+  var visualActionToken = ${inlineScriptJson(actionToken)};
+  var visualActionTokenErrorCode = ${inlineScriptJson(VISUAL_ACTION_TOKEN_INVALID)};
+  var toolbarLabels = ${inlineScriptJson(labels)};
+  var visualActionRefreshTimer = null;
+
+  function showVisualActionRecovery() {
+    if (visualActionRefreshTimer !== null) clearTimeout(visualActionRefreshTimer);
+    visualActionRefreshTimer = null;
+    statusEl.innerHTML = ${inlineScriptJson(recoveryBadge)};
+    publishBtn.disabled = true;
+    publishBtn.textContent = toolbarLabels.refreshPage;
+  }
+
+  function showPublishError(message) {
+    statusEl.textContent = message || toolbarLabels.publishFailed;
+    publishBtn.disabled = false;
+    publishBtn.textContent = toolbarLabels.publish;
+  }
+
+  function scheduleVisualActionTokenRefresh(delay) {
+    if (visualActionRefreshTimer !== null) clearTimeout(visualActionRefreshTimer);
+    visualActionRefreshTimer = setTimeout(function() {
+      visualActionRefreshTimer = null;
+      refreshVisualActionToken();
+    }, delay);
+  }
+
+  function refreshVisualActionToken() {
+    return ecFetch("/_emdash/api/visual-editing/action-token", {
+      method: "POST",
+      credentials: "same-origin",
+      headers: { "X-EmDash-Visual-Action": visualActionToken },
+    })
+    .then(function(res) {
+      if (res.status === 401 || res.status === 403) {
+        showVisualActionRecovery();
+        return null;
+      }
+      if (!res.ok) throw new Error("Visual action token renewal failed");
+      return res.json();
+    })
+    .then(function(body) {
+      if (!body) return;
+      if (!body.data || !body.data.token) throw new Error("Visual action token renewal returned no token");
+      visualActionToken = body.data.token;
+      scheduleVisualActionTokenRefresh(240000);
+    })
+    .catch(function(error) {
+      console.error("Visual action token renewal failed:", error);
+      scheduleVisualActionTokenRefresh(30000);
+    });
+  }
+
+  if (visualActionToken) scheduleVisualActionTokenRefresh(240000);
 
   var dismissBtn = document.getElementById("emdash-tb-dismiss");
   if (dismissBtn) {
@@ -792,11 +879,12 @@ function renderToolbar(config) {
     }
 
     publishBtn.disabled = true;
-    publishBtn.textContent = "Publishing\u2026";
+    publishBtn.textContent = toolbarLabels.publishing;
 
-    ecFetch("/_emdash/api/content/" + encodeURIComponent(collection) + "/" + encodeURIComponent(id) + "/publish", {
+    ecFetch("/_emdash/api/visual-editing/content/" + encodeURIComponent(collection) + "/" + encodeURIComponent(id) + "/publish", {
       method: "POST",
       credentials: "same-origin",
+      headers: { "X-EmDash-Visual-Action": visualActionToken },
     })
     .then(function(res) {
       if (res.ok) {
@@ -806,14 +894,23 @@ function renderToolbar(config) {
           location.reload();
         }
       } else {
-        publishBtn.disabled = false;
-        publishBtn.textContent = "Publish";
-        console.error("Publish failed:", res.status);
+        if (res.status === 401) {
+          showVisualActionRecovery();
+          return;
+        }
+        return res.json().catch(function() { return null; }).then(function(body) {
+          if (body && body.error && body.error.code === visualActionTokenErrorCode) {
+            showVisualActionRecovery();
+            return;
+          }
+          showPublishError(body && body.error && body.error.message);
+          console.error("Publish failed:", res.status);
+        });
       }
     })
     .catch(function(err) {
       publishBtn.disabled = false;
-      publishBtn.textContent = "Publish";
+      publishBtn.textContent = toolbarLabels.publish;
       console.error("Publish failed:", err);
     });
   }
@@ -1468,7 +1565,36 @@ function renderToolbar(config) {
 
 //#endregion
 //#region src/astro/middleware/request-context.ts
+/**
+* EmDash Request Context Middleware
+*
+* Sets up AsyncLocalStorage-based request context for query functions.
+* Skips ALS entirely for logged-out users with no CMS signals (fast path).
+*
+* Handles:
+* - Preview tokens: _preview query param with signed HMAC token
+* - Edit mode: emdash-edit-mode cookie (for visual editing)
+* - Toolbar injection: floating pill for authenticated editors
+* - Client toolbar mode (`toolbar: "client"`): cache-identical HTML with a
+*   client-side bootstrap pill and an `_edit` query param for fresh editor
+*   renders; the backend verifies the `_edit` param and redirects non-editors
+*/
 const toolbarMode = virtualConfig?.toolbar ?? "server";
+async function renderEditorToolbar(context, config) {
+	const labels = await loadVisualEditingToolbarLabels(context.request);
+	const { emdash, user } = context.locals;
+	if (!emdash?.db || !user) return renderToolbar({
+		...config,
+		labels
+	});
+	const { previewSecret } = await resolveSecretsCached(emdash.db);
+	const actionToken = await generateVisualEditingActionToken(previewSecret, user.id);
+	return renderToolbar({
+		...config,
+		actionToken,
+		labels
+	});
+}
 /**
 * Opt the current request out of Astro's route cache (e.g. Workers Cache on
 * Cloudflare). `Cache-Control` headers do NOT cover this: the adapter derives
@@ -1476,10 +1602,10 @@ const toolbarMode = virtualConfig?.toolbar ?? "server";
 * `Cloudflare-CDN-Cache-Control`), so session-specific responses must
 * explicitly disable it or they get stored in the shared cache and served to
 * anonymous visitors without ever invoking the middleware again. With no cache
-* provider configured this is a no-op (`NoopAstroCache`/`DisabledAstroCache`).
+* provider configured, or no cache handle on the request, this is a no-op.
 */
 function optOutOfRouteCache(cache) {
-	cache.set(false);
+	cache?.set(false);
 }
 /**
 * Inject HTML before `</body>` if the response is an HTML page with a body
@@ -1528,7 +1654,7 @@ async function injectBootstrap(response) {
 /**
 * Redirect an `_edit` URL to its canonical form (same URL without the param).
 * Applied when the requester is not an authenticated editor, so a shared
-* `?_edit` link degrades gracefully for everyone else (Discussion #1742).
+* `?_edit` link degrades gracefully for everyone else.
 */
 function redirectToCanonical(url) {
 	const canonical = new URL(url);
@@ -1597,7 +1723,7 @@ const onRequest = defineMiddleware(async (context, next) => {
 			response.headers.set("Cache-Control", "private, no-store");
 		}
 		if (isEditor && toolbarMode !== false) {
-			const toolbarHtml = renderToolbar({
+			const toolbarHtml = await renderEditorToolbar(context, {
 				editMode,
 				isPreview: !!preview
 			});
@@ -1609,7 +1735,7 @@ const onRequest = defineMiddleware(async (context, next) => {
 	if (isEditor) {
 		if (toolbarMode === false) return next();
 		if (toolbarMode === "client" && !hasEditParam) return injectBootstrap(await next());
-		return injectToolbar(await next(), renderToolbar({
+		return injectToolbar(await next(), await renderEditorToolbar(context, {
 			editMode: false,
 			isPreview: false
 		}), routeCache);