From d7f5b18a9b8859f3bfb86c7466fea6a3e8de3be2 Mon Sep 17 00:00:00 2001
From: Jer Miller <jeremie.miller@gmail.com>
Date: Tue, 21 Apr 2026 19:51:21 -0600
Subject: [PATCH] convey: promote escapeHtml + renderMarkdown to AppServices
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Adds two public methods to window.AppServices in convey/static/app.js
and deletes 11 escapeHtml + 7 renderMarkdown duplicates across
apps/**/*.html. Removes four redundant per-app marked <script> tags
(shell already loads marked at convey/templates/app.html:100). Retires
the private AppServices._escapeHtml in favor of the public name;
updates the six external consumers (entities, todos, status_pane) to
the renamed method in the same diff.

Behavior tightens in three files (settings, transcripts, import) that
previously used a 4-char regex missing `'` — they now escape `'` →
&#39; via the DOM-based canonical form. Identical in-element render;
closes a latent XSS vector where escaped output was interpolated into
single-quoted attributes.

Extends the shell-consolidation pattern shipped in bed62e6a
(DOMPurify).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 apps/activities/_day.html         | 14 ++------------
 apps/entities/workspace.html      |  8 ++++----
 apps/graph/workspace.html         |  6 +-----
 apps/health/workspace.html        |  6 ------
 apps/home/workspace.html          | 12 ++++--------
 apps/import/_detail.html          |  6 +-----
 apps/import/workspace.html        | 19 ++-----------------
 apps/observer/workspace.html      |  7 +------
 apps/reflections/workspace.html   |  6 +-----
 apps/search/workspace.html        |  7 +------
 apps/settings/workspace.html      |  6 +-----
 apps/sol/workspace.html           | 17 +++--------------
 apps/speakers/workspace.html      |  9 +--------
 apps/todos/workspace.html         |  2 +-
 apps/tokens/workspace.html        |  9 +--------
 apps/transcripts/workspace.html   | 21 ++++-----------------
 convey/static/app.js              | 24 ++++++++++++++++--------
 convey/templates/status_pane.html |  4 ++--
 docs/APPS.md                      |  2 ++
 19 files changed, 48 insertions(+), 137 deletions(-)

diff --git a/apps/activities/_day.html b/apps/activities/_day.html
index c23ea53fc..55dd3a90d 100644
--- a/apps/activities/_day.html
+++ b/apps/activities/_day.html
@@ -504,10 +504,10 @@ button.activity-detail-back {
 </div>
 
 <script src="{{ url_for('root.static', filename='colors.js') }}"></script>
-<script src="{{ vendor_lib('marked') }}"></script>
 <script>
 (function() {
   const day = '{{ day }}';
+  const escapeHtml = window.AppServices.escapeHtml;
 
   // Breadcrumb month link
   const monthLink = document.getElementById('breadcrumbMonth');
@@ -577,16 +577,6 @@ button.activity-detail-back {
     return list.filter(e => e.facet === facet);
   }
 
-  function escapeHtml(text) {
-    const d = document.createElement('div');
-    d.textContent = text;
-    return d.innerHTML;
-  }
-
-  function renderMarkdown(raw) {
-    return DOMPurify.sanitize(marked.parse(raw || '', { breaks: true, gfm: true }));
-  }
-
   function fmtTime(ts) {
     const d = new Date(ts);
     let h = d.getHours();
@@ -861,7 +851,7 @@ button.activity-detail-back {
 
       let rendered;
       if (data.format === 'md') {
-        rendered = `<div class="rendered-markdown">${renderMarkdown(data.content)}</div>`;
+        rendered = `<div class="rendered-markdown">${window.AppServices.renderMarkdown(data.content)}</div>`;
       } else if (data.format === 'json') {
         let pretty;
         try { pretty = JSON.stringify(JSON.parse(data.content), null, 2); } catch (e) { pretty = data.content; }
diff --git a/apps/entities/workspace.html b/apps/entities/workspace.html
index d48c9546b..d7218b5fe 100644
--- a/apps/entities/workspace.html
+++ b/apps/entities/workspace.html
@@ -1699,7 +1699,7 @@ function showFacetDetailView(entityId) {
       console.error('Error loading entity:', error);
       document.getElementById('detail-name').textContent = 'Error';
       document.getElementById('detail-description-container').innerHTML =
-        `<div class="error-message">${window.AppServices._escapeHtml(error.message)}</div>`;
+        `<div class="error-message">${window.AppServices.escapeHtml(error.message)}</div>`;
     });
 }
 
@@ -1725,7 +1725,7 @@ function showJournalDetailView(entityId) {
       console.error('Error loading journal entity:', error);
       document.getElementById('journal-detail-name').textContent = 'Error';
       document.getElementById('journal-detail-facets').innerHTML =
-        `<div class="error-message">${window.AppServices._escapeHtml(error.message)}</div>`;
+        `<div class="error-message">${window.AppServices.escapeHtml(error.message)}</div>`;
     });
 }
 
@@ -2671,7 +2671,7 @@ function loadEntities() {
     .catch(error => {
       console.error('Error loading entities:', error);
       document.getElementById('entities-loading').innerHTML =
-        `<div class="error-message">${window.AppServices._escapeHtml(error.message || 'Network error')}</div>`;
+        `<div class="error-message">${window.AppServices.escapeHtml(error.message || 'Network error')}</div>`;
     });
 }
 
@@ -2699,7 +2699,7 @@ function loadJournalEntities() {
     .catch(error => {
       console.error('Error loading journal entities:', error);
       document.getElementById('entities-loading').innerHTML =
-        `<div class="error-message">${window.AppServices._escapeHtml(error.message || 'Network error')}</div>`;
+        `<div class="error-message">${window.AppServices.escapeHtml(error.message || 'Network error')}</div>`;
     });
 }
 
diff --git a/apps/graph/workspace.html b/apps/graph/workspace.html
index 65a16becf..a6e24913b 100644
--- a/apps/graph/workspace.html
+++ b/apps/graph/workspace.html
@@ -650,11 +650,7 @@
     return d.toISOString().slice(0,10).replace(/-/g,'');
   }
 
-  function escapeHtml(text) {
-    const div = document.createElement('div');
-    div.textContent = text || '';
-    return div.innerHTML;
-  }
+  const escapeHtml = window.AppServices.escapeHtml;
 
   function formatDay(d) {
     if (!d || d.length < 8) return d || '';
diff --git a/apps/health/workspace.html b/apps/health/workspace.html
index a35eed376..7e8daac36 100644
--- a/apps/health/workspace.html
+++ b/apps/health/workspace.html
@@ -1427,12 +1427,6 @@
     return String(id).slice(-4);
   }
 
-  function escapeHtml(text) {
-    const div = document.createElement('div');
-    div.textContent = String(text ?? '');
-    return div.innerHTML;
-  }
-
   function formatNextRun(epochMs) {
     if (!epochMs) return '';
     const delta = epochMs - Date.now();
diff --git a/apps/home/workspace.html b/apps/home/workspace.html
index d6c8e9038..b66be01b2 100644
--- a/apps/home/workspace.html
+++ b/apps/home/workspace.html
@@ -1342,13 +1342,9 @@
   var skillContent = {{ skills_content|default({})|tojson|safe }};
   var sectionOrder = ['your_day', 'yesterday', 'forward_look', 'reading'];
 
-  function renderMarkdown(raw) {
-    return DOMPurify.sanitize(marked.parse(raw || '', { breaks: true, gfm: true }));
-  }
-
   if (narrativeRaw) {
     const el = document.getElementById('pulse-narrative-content');
-    if (el) el.innerHTML = renderMarkdown(narrativeRaw);
+    if (el) el.innerHTML = window.AppServices.renderMarkdown(narrativeRaw);
   }
 
   function renderBriefingSections(sections) {
@@ -1360,7 +1356,7 @@
         el.innerHTML = '';
         return;
       }
-      el.innerHTML = renderMarkdown(raw);
+      el.innerHTML = window.AppServices.renderMarkdown(raw);
       if (key === 'reading') {
         el.querySelectorAll('li').forEach(function(li) {
           var strong = li.querySelector('strong');
@@ -1417,7 +1413,7 @@
       if (!detail) return;
       if (detail.style.display === 'none') {
         if (skillContent[skillId]) {
-          detail.innerHTML = renderMarkdown(skillContent[skillId]);
+          detail.innerHTML = window.AppServices.renderMarkdown(skillContent[skillId]);
         }
         detail.style.display = 'block';
       } else {
@@ -1618,7 +1614,7 @@
       .then(data => {
         const el = document.getElementById('pulse-narrative-content');
         if (el && data.narrative_content) {
-          el.innerHTML = renderMarkdown(data.narrative_content);
+          el.innerHTML = window.AppServices.renderMarkdown(data.narrative_content);
           const hdr = document.querySelector('.pulse-narrative .pulse-section-header');
           if (hdr && data.narrative_header) hdr.textContent = data.narrative_header;
           const meta = document.querySelector('.pulse-narrative .pulse-narrative-meta');
diff --git a/apps/import/_detail.html b/apps/import/_detail.html
index 1b7faba63..84475ad03 100644
--- a/apps/import/_detail.html
+++ b/apps/import/_detail.html
@@ -176,10 +176,6 @@ let contentSearch = '';
 let contentMonth = '';
 let searchDebounce = null;
 
-function renderMarkdown(raw) {
-  return DOMPurify.sanitize(marked.parse(raw || '', { breaks: true, gfm: true }));
-}
-
 tabs.forEach(tab => {
   tab.addEventListener('click', () => {
     const target = tab.dataset.target;
@@ -333,7 +329,7 @@ function renderContentDetail(data) {
 
   return data.content.map(part => {
     if (part.type === 'markdown') {
-      return `<div class="import-content-markdown">${renderMarkdown(part.content)}</div>`;
+      return `<div class="import-content-markdown">${window.AppServices.renderMarkdown(part.content)}</div>`;
     }
     const speaker = part.speaker || 'Unknown';
     const cls = speaker === 'Human' ? 'human' : 'assistant';
diff --git a/apps/import/workspace.html b/apps/import/workspace.html
index a5bfd4952..374ebcbbc 100644
--- a/apps/import/workspace.html
+++ b/apps/import/workspace.html
@@ -639,7 +639,6 @@
   </div>
 </div>
 
-<script src="{{ vendor_lib('marked') }}"></script>
 <script>
 const facetSelect = document.getElementById('facetSelect');
 const settingInput = document.getElementById('settingInput');
@@ -671,21 +670,7 @@ let importsCache = [];
 let currentSourceFilter = '';
 let currentPage = 1;
 let totalImports = 0;
-
-function escapeHtml(str) {
-  if (str === null || str === undefined) {
-    return '';
-  }
-  return String(str)
-    .replace(/&/g, '&amp;')
-    .replace(/</g, '&lt;')
-    .replace(/>/g, '&gt;')
-    .replace(/"/g, '&quot;');
-}
-
-function renderMarkdown(raw) {
-  return DOMPurify.sanitize(marked.parse(raw || '', { breaks: true, gfm: true }));
-}
+const escapeHtml = window.AppServices.escapeHtml;
 
 function navigateTo(view, options = {}) {
   const { updateHash = true } = options;
@@ -1237,7 +1222,7 @@ async function loadGuidedFlow(sourceName) {
     const response = await fetch(`/app/import/api/guide/${sourceName}`);
     if (response.ok) {
       const markdown = await response.text();
-      guideHtml = `<li><div class="import-step"><div class="import-step-number">Step 1</div><div class="import-guide-content">${renderMarkdown(markdown)}</div></div></li>`;
+      guideHtml = `<li><div class="import-step"><div class="import-step-number">Step 1</div><div class="import-guide-content">${window.AppServices.renderMarkdown(markdown)}</div></div></li>`;
     }
   }
 
diff --git a/apps/observer/workspace.html b/apps/observer/workspace.html
index 5b7da6a48..a02667798 100644
--- a/apps/observer/workspace.html
+++ b/apps/observer/workspace.html
@@ -617,6 +617,7 @@ const copyKeyBtn = document.getElementById('copyKeyBtn');
 const doneBtn = document.getElementById('doneBtn');
 const keyModalClose = document.getElementById('keyModalClose');
 const revealKeyBtn = document.getElementById('revealKeyBtn');
+const escapeHtml = window.AppServices.escapeHtml;
 let keyModalTrigger = null;
 // Error display state
 const wsErrorContainer = document.getElementById('wsErrorContainer');
@@ -998,12 +999,6 @@ function refreshTimestamps() {
   }
 }
 
-function escapeHtml(text) {
-  const div = document.createElement('div');
-  div.textContent = text;
-  return div.innerHTML;
-}
-
 async function revokeObserver(keyPrefix, name) {
   if (!confirm(`Revoke observer "${name}"? The observer will no longer be able to upload.`)) {
     return;
diff --git a/apps/reflections/workspace.html b/apps/reflections/workspace.html
index 16a6004dd..8b1fae9fb 100644
--- a/apps/reflections/workspace.html
+++ b/apps/reflections/workspace.html
@@ -203,10 +203,6 @@
   const copyButton = document.getElementById('copyReflectionButton');
   const rawUrl = {{ raw_url|tojson|safe }};
 
-  function renderMarkdown(raw) {
-    return DOMPurify.sanitize(marked.parse(raw || '', { breaks: true, gfm: true }));
-  }
-
   function copyText(text) {
     if (navigator.clipboard && navigator.clipboard.writeText) {
       return navigator.clipboard.writeText(text);
@@ -224,7 +220,7 @@
   }
 
   if (reflectionBody) {
-    reflectionBody.innerHTML = renderMarkdown(markdownSource);
+    reflectionBody.innerHTML = window.AppServices.renderMarkdown(markdownSource);
   }
 
   if (copyButton) {
diff --git a/apps/search/workspace.html b/apps/search/workspace.html
index ec7351515..a34e05422 100644
--- a/apps/search/workspace.html
+++ b/apps/search/workspace.html
@@ -588,6 +588,7 @@ button.day-header {
   const searchUrl = '{{ url_for("app:search.search_journal_api") }}';
   const dayResultsUrl = '{{ url_for("app:search.day_results_api") }}';
   const activitiesDayBase = '{{ url_for("app:activities.activities_day", day="") }}';
+  const escapeHtml = window.AppServices.escapeHtml;
 
   // State
   let currentQuery = '';
@@ -1014,11 +1015,5 @@ button.day-header {
     }
   }
 
-  function escapeHtml(text) {
-    if (!text) return '';
-    const div = document.createElement('div');
-    div.textContent = text;
-    return div.innerHTML;
-  }
 })();
 </script>
diff --git a/apps/settings/workspace.html b/apps/settings/workspace.html
index 82643bf1b..f6eb7ce3a 100644
--- a/apps/settings/workspace.html
+++ b/apps/settings/workspace.html
@@ -2964,6 +2964,7 @@ const saveTimeouts = new Map();
 let logNextCursor = null;
 let insightsData = null;
 let keyValidationData = {};
+const escapeHtml = window.AppServices.escapeHtml;
 
 // ========== MODAL ACCESSIBILITY ==========
 function setupModalAccessibility(modalId) {
@@ -5754,11 +5755,6 @@ if (resetAgentBtn) {
   });
 }
 
-function escapeHtml(str) {
-  if (!str) return '';
-  return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
-}
-
 // ========== STORAGE ==========
 let storageData = null;
 
diff --git a/apps/sol/workspace.html b/apps/sol/workspace.html
index 67e0c37ff..ed6a972b4 100644
--- a/apps/sol/workspace.html
+++ b/apps/sol/workspace.html
@@ -1159,8 +1159,6 @@
   </div>
 </div>
 
-<script src="{{ vendor_lib('marked') }}"></script>
-
 <!-- Preview Modal -->
 <div id="preview-modal" class="modal-backdrop" role="dialog" aria-modal="true" aria-labelledby="preview-modal-title">
   <div class="modal-content">
@@ -2088,7 +2086,7 @@
       if (data.format === 'md') {
         const markdown = document.createElement('div');
         markdown.className = 'rendered-markdown';
-        markdown.innerHTML = renderMarkdown(data.content);
+        markdown.innerHTML = window.AppServices.renderMarkdown(data.content);
         container.appendChild(markdown);
       } else {
         const pre = document.createElement('pre');
@@ -2121,16 +2119,7 @@
     return d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit' });
   }
 
-  // Escape HTML to prevent XSS
-  function escapeHtml(text) {
-    const div = document.createElement('div');
-    div.textContent = text;
-    return div.innerHTML;
-  }
-
-  function renderMarkdown(raw) {
-    return DOMPurify.sanitize(marked.parse(raw || '', { breaks: true, gfm: true }));
-  }
+  const escapeHtml = window.AppServices.escapeHtml;
 
   // Render agent events as a rich interactive timeline
   function renderEventTimeline(events) {
@@ -2314,7 +2303,7 @@
     if (event.result && event.result.trim()) {
       const resultDiv = document.createElement('div');
       resultDiv.className = 'finish-result';
-      resultDiv.innerHTML = renderMarkdown(event.result);
+      resultDiv.innerHTML = window.AppServices.renderMarkdown(event.result);
       block.appendChild(resultDiv);
     } else {
       const empty = document.createElement('div');
diff --git a/apps/speakers/workspace.html b/apps/speakers/workspace.html
index 8d9ab6c84..00170fd1d 100644
--- a/apps/speakers/workspace.html
+++ b/apps/speakers/workspace.html
@@ -1098,6 +1098,7 @@
 
 <script>
 (() => {
+  const escapeHtml = window.AppServices.escapeHtml;
   const emptyIcons = {
     segment: '<svg viewBox="0 0 24 24"><rect x="4" y="8" width="2" height="8" rx="1"></rect><rect x="8" y="5" width="2" height="14" rx="1"></rect><rect x="12" y="3" width="2" height="18" rx="1"></rect><rect x="16" y="6" width="2" height="12" rx="1"></rect><rect x="20" y="9" width="2" height="6" rx="1"></rect></svg>',
     cursor: '<svg viewBox="0 0 24 24"><path d="M4 4l7.07 17 2.51-7.39L21 11.07z"></path></svg>',
@@ -2241,13 +2242,5 @@
       .replace(/_/g, ' ');
   }
 
-  function escapeHtml(value) {
-    return String(value ?? '')
-      .replace(/&/g, '&amp;')
-      .replace(/</g, '&lt;')
-      .replace(/>/g, '&gt;')
-      .replace(/"/g, '&quot;')
-      .replace(/'/g, '&#39;');
-  }
 })();
 </script>
diff --git a/apps/todos/workspace.html b/apps/todos/workspace.html
index ba81f5528..c3bf9399d 100644
--- a/apps/todos/workspace.html
+++ b/apps/todos/workspace.html
@@ -1358,7 +1358,7 @@ document.addEventListener('DOMContentLoaded', function() {
   window.addEventListener('todo.added', (e) => {
     const todo = e.detail;
     const facetName = todo.facet;
-    const escape = window.AppServices._escapeHtml;
+    const escape = window.AppServices.escapeHtml;
 
     // Find or create facet section
     let facetSection = document.querySelector(`.facet-section[data-facet="${facetName}"]`);
diff --git a/apps/tokens/workspace.html b/apps/tokens/workspace.html
index 72dcbb11e..645a0280e 100644
--- a/apps/tokens/workspace.html
+++ b/apps/tokens/workspace.html
@@ -579,14 +579,7 @@ function formatSegmentKey(segment) {
 }
 
 // Escape HTML special characters for safe innerHTML interpolation
-function escapeHtml(val) {
-  return String(val ?? '')
-    .replace(/&/g, '&amp;')
-    .replace(/</g, '&lt;')
-    .replace(/>/g, '&gt;')
-    .replace(/"/g, '&quot;')
-    .replace(/'/g, '&#39;');
-}
+const escapeHtml = window.AppServices.escapeHtml;
 
 // Create percent bar
 function createPercentBar(percent, color) {
diff --git a/apps/transcripts/workspace.html b/apps/transcripts/workspace.html
index d03b0ee0b..c6b720c3a 100644
--- a/apps/transcripts/workspace.html
+++ b/apps/transcripts/workspace.html
@@ -1449,9 +1449,9 @@ body.has-app-bar.has-date-nav .workspace:has(.tr-wrap) {
   </div>
 </div>
 
-<script src="{{ vendor_lib('marked') }}"></script>
 <script>
 (() => {
+  const escapeHtml = window.AppServices.escapeHtml;
   // Timeline bounds - computed dynamically from content
   const DEFAULT_START = 8 * 60;   // 8:00 AM default
   const DEFAULT_END = 20 * 60;    // 8:00 PM default
@@ -2515,7 +2515,7 @@ body.has-app-bar.has-date-nav .workspace:has(.tr-wrap) {
       } else if (tabId.startsWith('md-')) {
         const stem = tabId.slice(3);
         const content = (segmentData.md_files || {})[stem] || '';
-        pane.innerHTML = `<div class="tr-md-content">${renderMarkdown(content)}</div>`;
+        pane.innerHTML = `<div class="tr-md-content">${window.AppServices.renderMarkdown(content)}</div>`;
       }
     }
 
@@ -2595,7 +2595,7 @@ body.has-app-bar.has-date-nav .workspace:has(.tr-wrap) {
       } else if (item.type === 'screen') {
         if (textOnlyScreen) {
           const timeStr = item.time || '';
-          const markdown = renderMarkdown(item.markdown) || 'Screen activity';
+          const markdown = window.AppServices.renderMarkdown(item.markdown) || 'Screen activity';
           html += '<div class="tr-entry" role="listitem">';
           html += `<div class="tr-entry-time">${timeStr}</div>`;
           html += '<div class="tr-entry-content">';
@@ -2903,7 +2903,7 @@ body.has-app-bar.has-date-nav .workspace:has(.tr-wrap) {
       if (monitorPos) html += `<span class="tr-entry-badge tr-entry-badge-monitor">${monitorPos}</span>`;
     }
     if (chunk.markdown) {
-      html += renderMarkdown(chunk.markdown);
+      html += window.AppServices.renderMarkdown(chunk.markdown);
     }
     html += '</div>';
 
@@ -2911,19 +2911,6 @@ body.has-app-bar.has-date-nav .workspace:has(.tr-wrap) {
     return html;
   }
 
-  function renderMarkdown(raw) {
-    return DOMPurify.sanitize(marked.parse(raw || '', { breaks: true, gfm: true }));
-  }
-
-  function escapeHtml(str) {
-    if (!str) return '';
-    return str
-      .replace(/&/g, '&amp;')
-      .replace(/</g, '&lt;')
-      .replace(/>/g, '&gt;')
-      .replace(/"/g, '&quot;');
-  }
-
   function openImageModal(frameIndex) {
     if (frameIndex < 0 || frameIndex >= allScreenFrames.length) return;
 
diff --git a/convey/static/app.js b/convey/static/app.js
index 37ed8414c..010b8ffb2 100644
--- a/convey/static/app.js
+++ b/convey/static/app.js
@@ -1873,13 +1873,13 @@ window.AppServices = {
       const relativeTime = this._getRelativeTime(n.timestamp);
       card.innerHTML = `
         <div class="notification-header">
-          <span class="notification-app-icon">${window.AppServices._escapeHtml(n.icon)}</span>
-          <span class="notification-app-name">${window.AppServices._escapeHtml(n.app)}</span>
+          <span class="notification-app-icon">${window.AppServices.escapeHtml(n.icon)}</span>
+          <span class="notification-app-name">${window.AppServices.escapeHtml(n.app)}</span>
           ${n.dismissible ? `<button class="notification-close" onclick="event.preventDefault(); event.stopPropagation(); window.AppServices.notifications.dismiss(${n.id});">×</button>` : ''}
         </div>
         <div class="notification-body">
-          <div class="notification-title">${window.AppServices._escapeHtml(n.title)}</div>
-          ${n.message ? `<div class="notification-message">${window.AppServices._escapeHtml(n.message)}</div>` : ''}
+          <div class="notification-title">${window.AppServices.escapeHtml(n.title)}</div>
+          ${n.message ? `<div class="notification-message">${window.AppServices.escapeHtml(n.message)}</div>` : ''}
           ${n.badge ? `<span class="notification-badge">${n.badge}</span>` : ''}
 	        </div>
 	        <div class="notification-footer">
@@ -2076,15 +2076,23 @@ window.AppServices = {
   },
 
   /**
-   * Escape HTML to prevent XSS
-   * @private
+   * Escape a value for safe interpolation into HTML. DOM-based (routes
+   * through textContent/innerHTML). Nullish-safe: null/undefined become ''.
    */
-  _escapeHtml(text) {
+  escapeHtml(value) {
     const div = document.createElement('div');
-    div.textContent = text;
+    div.textContent = String(value ?? '');
     return div.innerHTML;
   },
 
+  /**
+   * Render user-supplied markdown into sanitized HTML. Calls marked + DOMPurify.
+   * Throws if `marked` or `DOMPurify` isn't loaded (shell is broken; fail loudly).
+   */
+  renderMarkdown(raw) {
+    return DOMPurify.sanitize(marked.parse(String(raw || ''), { breaks: true, gfm: true }));
+  },
+
   /**
    * Badge system for app icons and facet pills
    * Unified API with parallel app/facet namespaces
diff --git a/convey/templates/status_pane.html b/convey/templates/status_pane.html
index 192fd4e09..058314a71 100644
--- a/convey/templates/status_pane.html
+++ b/convey/templates/status_pane.html
@@ -281,7 +281,7 @@
       return;
     }
 
-    const escape = window.AppServices._escapeHtml;
+    const escape = window.AppServices.escapeHtml;
     list.innerHTML = notifs.map(n => {
       const timeAgo = window.AppServices.notifications._getRelativeTime(n.ts);
       const src = escape(n.source || '');
@@ -301,7 +301,7 @@
     const history = window.AppServices.notifications.getHistory();
     if (!statusPaneOpen && history.length === _lastHistoryLen) return;
     _lastHistoryLen = history.length;
-    const escape = window.AppServices._escapeHtml;
+    const escape = window.AppServices.escapeHtml;
 
     if (history.length === 0) {
       container.innerHTML = '<span style="color: #9ca3af;">no recent activity</span>';
diff --git a/docs/APPS.md b/docs/APPS.md
index 0b7ae1985..7a777bc0c 100644
--- a/docs/APPS.md
+++ b/docs/APPS.md
@@ -174,6 +174,8 @@ JavaScript service that runs globally, even when app is not active.
 
 **Core Methods:**
 - `AppServices.register(appName, service)` - Register background service
+- `AppServices.escapeHtml(value)` - DOM-based HTML escaping helper; null/undefined become `''`
+- `AppServices.renderMarkdown(raw)` - `marked` + `DOMPurify` markdown rendering with `{ breaks: true, gfm: true }`; requires both libraries loaded
 
 **Badge Methods:**
 
-- 
2.51.2