domma-cms 0.116.4 → 0.116.5

package/CLAUDE.md

@@ -368,6 +368,10 @@ changes shape depending on where you clicked is disorienting, and greyed-out is
 `back_forward` navigation - an honest heuristic, not a real capability check. `site-search` calls
 `window.DommaSiteSearch.open()`, the one handle `public/js/search.js` exports.
 
+A menu over a **sandboxed iframe** cannot hear the right-click at all - the mail reader's message pane
+solves it with a hash-allowed bridge script inside the frame that posts the click to the parent, which
+calls the menu's `open(x, y, target)` (see `plugins/_lib/mail/CLAUDE.md`, "The reading pane's menu").
+
 ## Collection displays & public filtering
 
 `[collection]` and `[view]` render in any of table, cards, list, block, accordion, timeline,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "domma-cms",
-  "version": "0.116.4",
+  "version": "0.116.5",
   "description": "File-based CMS powered by Domma and Fastify. Run npx domma-cms my-site to create a new project.",
   "type": "module",
   "main": "server/server.js",

package/plugins/_lib/admin/mail/body-menu.js

@@ -0,0 +1,99 @@
+/**
+ * The reading pane's right-click menu - the pure parts.
+ *
+ * The message itself renders in a sandboxed frame, and a right-click inside a
+ * frame never reaches the admin. The frame's document carries a few lines of
+ * our own (MENU_BRIDGE in `_lib/mail/render.js`) that post where the click was
+ * and what was selected; this module checks that message and builds what the
+ * menu offers for a selection. The rest of the menu is the message list's own,
+ * so the two never drift apart.
+ *
+ * @module _lib/admin/mail/body-menu
+ */
+
+/** Must match MENU_BRIDGE_TYPE in `_lib/mail/render.js`. */
+export const BODY_MENU_TYPE = 'dm-mail-body-menu';
+
+/** The most selected text carried over - the bridge caps it too. */
+export const SELECTION_MAX = 20000;
+
+/**
+ * A message event from the message frame, or null for anything else.
+ *
+ * Only the frame we put on screen may open the menu: any other window can
+ * post to this one, and a message is not trusted for being shaped right.
+ *
+ * @param   {MessageEvent} event
+ * @param   {Window|null} frameWindow - the reading pane's iframe contentWindow
+ * @returns {{x: number, y: number, selection: string}|{close: true}|null}
+ */
+export function readBridgeMessage(event, frameWindow) {
+    if (!event || !frameWindow || event.source !== frameWindow) return null;
+    const data = event.data;
+    if (!data || typeof data !== 'object' || data.type !== BODY_MENU_TYPE) return null;
+    // A click or Escape inside the frame: close an open menu.
+    if (data.close === true) return {close: true};
+    const num = (v) => (Number.isFinite(v) ? Math.max(0, Math.min(v, 100000)) : 0);
+    return {
+        x: num(data.x),
+        y: num(data.y),
+        selection: typeof data.selection === 'string' ? data.selection.slice(0, SELECTION_MAX) : ''
+    };
+}
+
+/**
+ * Where the menu opens, in the admin's coordinates. A keyboard menu (no
+ * pointer, so 0,0) opens just inside the top of the message.
+ *
+ * @param   {{left: number, top: number}} frameRect
+ * @param   {{x: number, y: number}} at
+ * @returns {{x: number, y: number}}
+ */
+export function menuPoint(frameRect, at) {
+    const keyboard = !at.x && !at.y;
+    return {
+        x: Math.round(frameRect.left + (keyboard ? 16 : at.x)),
+        y: Math.round(frameRect.top + (keyboard ? 16 : at.y))
+    };
+}
+
+/**
+ * Replace a reply draft's quote with just the selected text, keeping the
+ * attribution line the server wrote ("On …, Sam wrote:").
+ *
+ * @param   {{body?: string, html?: string|null}} draft
+ * @param   {string} selection
+ * @returns {object} a new draft
+ */
+export function quoteSelection(draft, selection) {
+    const text = String(selection ?? '').replace(/\r\n/g, '\n').trim();
+    if (!text) return draft;
+    const attribution = String(draft?.body ?? '').trim().split('\n')[0] || '';
+    const quotedText = text.split('\n').map(line => (line.startsWith('>') ? `>${line}` : `> ${line}`)).join('\n');
+    const escape = value => String(value).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
+    return {
+        ...draft,
+        body: `\n\n${attribution ? `${attribution}\n` : ''}${quotedText}\n`,
+        html: `<p><br></p>${attribution ? `<p>${escape(attribution)}</p>` : ''}`
+            + `<blockquote style="margin:0 0 0 .8em;padding-left:.8em;border-left:3px solid #d0d0d0">`
+            + `${escape(text).replace(/\n/g, '<br>')}</blockquote>`
+    };
+}
+
+/**
+ * The items a selection adds at the top of the menu. Copy is always listed
+ * (greyed with nothing selected, as a native menu does); Quote in reply only
+ * where this edition can write mail.
+ *
+ * @param   {string} selection
+ * @param   {{canSend: boolean, copy: Function, quoteReply: Function}} actions
+ * @returns {object[]}
+ */
+export function selectionItems(selection, {canSend, copy, quoteReply}) {
+    const has = Boolean(String(selection ?? '').trim());
+    return [
+        {label: 'Copy', icon: 'copy', disabled: () => !has, action: () => copy(selection)},
+        ...(canSend ? [{label: 'Quote in reply', icon: 'message-square', disabled: () => !has, action: () => quoteReply(selection)}] : []),
+        {type: 'divider'}
+    ];
+}

package/plugins/_lib/admin/mail/reader-view.js

@@ -45,6 +45,7 @@ const {whenClosed} = await import(versioned('when-closed.js'));
 const {addContact, isKnownAddress, loadContacts} = await import(versioned('contacts.js'));
 const {fillMessageAction, loadMessageActions, messageFacts} = await import(versioned('message-actions.js'));
 const {isPlainKey, isTyping, resolveKey, SHORTCUTS} = await import(versioned('keyboard.js'));
+const {menuPoint, quoteSelection, readBridgeMessage, selectionItems} = await import(versioned('body-menu.js'));
 const {describeWhen, quickTimes} = await import(versioned('scheduling.js'));
 
 /**
@@ -447,6 +448,12 @@ return {
         let markReadTimer = null;
         /** The registered right-click menu, so it can be destroyed on unmount. */
         let messageMenu = null;
+        /** The reading pane's menu, the frame the message is in, and its listener. */
+        let bodyMenu = null;
+        let bodyFrame = null;
+        let onBodyBridge = null;
+        /** Text selected inside the frame, handed from its message to the menu. */
+        let pendingSelection = null;
         /** Hides the undo strip once its moment has passed. */
         let undoTimer = null;
 
@@ -567,6 +574,11 @@ return {
             disposeRowEffects();
             messageMenu?.destroy?.();
             messageMenu = null;
+            bodyMenu?.destroy?.();
+            bodyMenu = null;
+            if (onBodyBridge) window.removeEventListener('message', onBodyBridge);
+            onBodyBridge = null;
+            bodyFrame = null;
             folderMenu?.destroy?.();
             folderMenu = null;
             stopFitting?.();
@@ -2353,10 +2365,13 @@ return {
                 Domma.icons.scan(wrap);
             }
 
-            // The message renders in a sandboxed iframe with neither
-            // allow-scripts nor allow-same-origin, so its content has no script
-            // execution and no origin to reach back into the admin with.
-            // allow-popups is there only so its links can open in a new tab.
+            // The message renders in a sandboxed iframe without
+            // allow-same-origin, so its content has no origin to reach back
+            // into the admin with. allow-popups is there only so its links can
+            // open in a new tab. allow-scripts runs exactly one script: the
+            // menu bridge render.js adds, allowed by its hash in the body's
+            // CSP - the mail's own scripts are stripped and refused by it -
+            // which posts a right-click to attachBodyMenu() below.
             //
             // Loaded by `src`, never `srcdoc`: a srcdoc document inherits the
             // admin's CSP, whose img-src is 'self' data: blob:, so every remote
@@ -2364,10 +2379,11 @@ return {
             // could not work. Fetched from a route, the body carries its own
             // policy.
             const frame = document.createElement('iframe');
-            frame.setAttribute('sandbox', 'allow-popups allow-popups-to-escape-sandbox');
+            frame.setAttribute('sandbox', 'allow-scripts allow-popups allow-popups-to-escape-sandbox');
             frame.setAttribute('referrerpolicy', 'no-referrer');
             frame.src = message.bodyUrl;
             readerBodyEl.appendChild(frame);
+            bodyFrame = frame;
         }
 
         /**
@@ -2624,6 +2640,69 @@ return {
             });
         }
 
+        /**
+         * The reading pane's right-click menu: what a selection allows (Copy,
+         * Quote in reply), then the message list's own menu for the message on
+         * screen, so the two always offer the same.
+         *
+         * Registered on the pane, so a right-click beside the message (the
+         * attachments, the margin) opens it directly; inside the message's
+         * frame the bridge posts the click here and it is opened at that point.
+         * Links and images in the message keep the browser's own menu.
+         *
+         * @returns {void}
+         */
+        function attachBodyMenu() {
+            const elements = (typeof E !== 'undefined' && E?.contextMenu) ? E
+                : (typeof Domma !== 'undefined' ? Domma?.elements : null);
+            if (typeof elements?.contextMenu !== 'function' || !readerBodyEl) return;
+
+            bodyMenu = elements.contextMenu(readerBodyEl, {
+                cursor: 'glyph',
+                inherit: false,
+                items: [],
+                onBeforeOpen: () => {
+                    const selection = pendingSelection ?? String(window.getSelection?.() ?? '');
+                    pendingSelection = null;
+                    const message = messages.find(m => m.uid === selectedUid$.value);
+                    if (!message || !bodyFrame?.isConnected) return false;
+                    bodyMenu.setItems(bodyMenuItems(message, openFolder ?? currentFolder, selection));
+                    return true;
+                }
+            });
+
+            onBodyBridge = (event) => {
+                const at = readBridgeMessage(event, bodyFrame?.contentWindow ?? null);
+                if (!at || !bodyMenu) return;
+                if (at.close) { if (bodyMenu.isOpen?.()) bodyMenu.close(); return; }
+                pendingSelection = at.selection;
+                const point = menuPoint(bodyFrame.getBoundingClientRect(), at);
+                bodyMenu.open(point.x, point.y, bodyFrame);
+            };
+            window.addEventListener('message', onBodyBridge);
+        }
+
+        /**
+         * The items for the message on screen, with what a selection adds.
+         *
+         * @param   {object} message
+         * @param   {string} folder
+         * @param   {string} selection
+         * @returns {object[]}
+         */
+        function bodyMenuItems(message, folder, selection) {
+            const target = {...message, folder};
+            return [
+                ...selectionItems(selection, {
+                    canSend: features.send && !isDraft(target),
+                    copy: text => copyText(text, 'Copied.'),
+                    quoteReply: text => compose(target, 'reply', {quote: text})
+                }),
+                // "Open" is the list's way in; here the message is already open.
+                ...messageMenuItems(message, folder).filter(item => item.label !== 'Open')
+            ];
+        }
+
         /**
          * The items for one message.
          *
@@ -4366,7 +4445,7 @@ return {
          * @param   {'reply'|'replyAll'|'forward'} mode
          * @returns {Promise<void>}
          */
-        async function compose(message, mode) {
+        async function compose(message, mode, {quote = null} = {}) {
             try {
                 const params = new URLSearchParams({
                     account: currentAccountId ?? '',
@@ -4375,7 +4454,9 @@ return {
                 });
                 const result = await api(`${BASE}/messages/${message.uid}/draft?${params}`);
                 openCompose(composeOptions(await identitySoon(), {
-                    draft: result.draft,
+                    // Quote in reply: just the selected text under the
+                    // attribution line, not the whole message.
+                    draft: quote ? quoteSelection(result.draft, quote) : result.draft,
                     mode
                 }));
             } catch (err) {
@@ -4653,6 +4734,7 @@ return {
         // Every edition gets the message menu; what is in it depends on what
         // this one can do (readOnlyMenuItems for the free reader).
         attachMessageMenu();
+        attachBodyMenu();
         if (features.folders) attachFolderMenu();
 
         // Shift+F10 opens the menu of the focused row, as the keyboard's

package/plugins/_lib/mail/readRoutes.js

@@ -35,7 +35,7 @@ import {ENVELOPE_QUERY, hasAttachment, parseHeaderBlock} from './envelope.js';
 import {describeError} from './imapPool.js';
 import {resolveSubscriptions} from './folders.js';
 import {readPriority} from './priority.js';
-import {listAttachments, renderBody} from './render.js';
+import {listAttachments, MENU_BRIDGE_CSP, renderBody} from './render.js';
 import {readUnsubscribe} from './unsubscribe.js';
 import {MailKeyError} from './secretbox.js';
 import {unreadBadge} from './unreadBadge.js';
@@ -592,7 +592,7 @@ export function registerReadRoutes(fastify, {auth, hooks, config, pool, pluginNa
                 .header('Content-Security-Policy',
                     "default-src 'none'; " +
                     (grant.images ? "img-src data: http: https:; " : "img-src data:; ") +
-                    "style-src 'unsafe-inline'; font-src data:; frame-ancestors 'self'")
+                    `style-src 'unsafe-inline'; font-src data:; script-src ${MENU_BRIDGE_CSP}; frame-ancestors 'self'`)
                 .header('X-Content-Type-Options', 'nosniff')
                 .header('Referrer-Policy', 'no-referrer')
                 // Someone else's mail has no business in a cache.

package/plugins/_lib/mail/render.js

@@ -15,8 +15,17 @@
  * The CSP meta below is a fourth layer that costs nothing. None of these are
  * individually sufficient, which is the point.
  *
+ * One exception to "no scripts" since 0.117: MENU_BRIDGE, our own few lines,
+ * allowed by its hash and nothing else. A right-click inside a sandboxed frame
+ * never reaches the admin, so the reading pane had no menu on the message
+ * itself; the bridge posts where the click was (and any selected text) to the
+ * parent, which opens the menu. The frame still has no `allow-same-origin`, so
+ * the script runs in an opaque origin with nothing of the admin's to reach, and
+ * a script in the mail itself is stripped by layer 1 and refused by the hash.
+ *
  * @module mail-reader/services/render
  */
+import {createHash} from 'node:crypto';
 import sanitizeHtml from 'sanitize-html';
 
 /** A 1x1 transparent GIF - stands in for a blocked remote image. */
@@ -174,6 +183,34 @@ function escapeHtml(value) {
         .replace(/'/g, ''');
 }
 
+/** What the bridge posts to the reading pane; the parent checks for it. */
+export const MENU_BRIDGE_TYPE = 'dm-mail-body-menu';
+
+/**
+ * The reading pane's menu, from inside the message frame. Links and images
+ * keep the browser's own menu (open in a new tab, copy the address); anywhere
+ * else the click is posted to the parent with the selection, capped. The
+ * keyboard's menu key and Shift+F10 fire `contextmenu` too, with no pointer
+ * position, which the parent reads as "at the top of the message" - and are
+ * also caught as keys, since not every browser turns them into a contextmenu
+ * event (preventDefault on the key stops a second one where it does). A click or
+ * Escape inside the frame posts `close`, since neither reaches the parent's
+ * document, where an open menu listens for them.
+ */
+export const MENU_BRIDGE = `(function(){document.addEventListener('contextmenu',function(e){`
+    + `var t=e.target;if(t&&t.closest&&t.closest('a[href],img'))return;e.preventDefault();`
+    + `var s=String(window.getSelection?window.getSelection():'').slice(0,20000);`
+    + `parent.postMessage({type:'${MENU_BRIDGE_TYPE}',x:e.clientX||0,y:e.clientY||0,selection:s},'*');});`
+    + `function c(){parent.postMessage({type:'${MENU_BRIDGE_TYPE}',close:true},'*');}`
+    + `document.addEventListener('mousedown',function(e){if(e.button===0)c();});`
+    + `document.addEventListener('keydown',function(e){if(e.key==='Escape')c();`
+    + `if((e.key==='F10'&&e.shiftKey)||e.key==='ContextMenu'){e.preventDefault();`
+    + `var s=String(window.getSelection?window.getSelection():'').slice(0,20000);`
+    + `parent.postMessage({type:'${MENU_BRIDGE_TYPE}',x:0,y:0,selection:s},'*');}});})();`;
+
+/** The CSP source that allows MENU_BRIDGE and no other script. */
+export const MENU_BRIDGE_CSP = `'sha256-${createHash('sha256').update(MENU_BRIDGE).digest('base64')}'`;
+
 /**
  * Wrap a sanitised body in a self-contained document for iframe srcdoc.
  *
@@ -188,7 +225,7 @@ function wrapDocument(bodyHtml) {
     return `<!DOCTYPE html>
 <html><head>
 <meta charset="utf-8">
-<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src data: http: https:; style-src 'unsafe-inline'; font-src data:;">
+<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src data: http: https:; style-src 'unsafe-inline'; font-src data:; script-src ${MENU_BRIDGE_CSP};">
 <base target="_blank">
 <style>
   html, body { margin: 0; padding: 16px; }
@@ -204,7 +241,7 @@ function wrapDocument(bodyHtml) {
     border-left: 3px solid #d0d0d0; color: #555;
   }
 </style>
-</head><body>${bodyHtml}</body></html>`;
+</head><body>${bodyHtml}<script>${MENU_BRIDGE}</script></body></html>`;
 }
 
 /**

package/plugins/free-tier.lock.json

@@ -1,6 +1,6 @@
 {
   "note": "Written by `make sync-free-tier` in dcms-marketplace. Do not edit these plugins here - edit them there and sync.",
-  "source": "dcms-marketplace@149aff8",
+  "source": "dcms-marketplace@c9103e9",
   "plugins": {
     "blog": {
       "version": "1.9.4",
@@ -138,14 +138,14 @@
       }
     },
     "mail-reader": {
-      "version": "1.2.3",
+      "version": "1.2.4",
       "files": {
-        "CLAUDE.md": "e7722bf8464087e6568bac2f3cf2cf1eb4a84702e3f5d591737976db4fe5313e",
+        "CLAUDE.md": "29a46b6113dafb37c5e4c728a0d1f7286e805301e7d3d2bbae0c72eb43d5f456",
         "admin/views/mail.js": "c5c6483f9618c75cac8f4be32d3aea99511db76d4b9d38b8ef43bdc1d35db3c5",
         "config.js": "6e65803ad822a9acda40c203631b8eb32a87cf9d9e5f1c7cb59d01aa406075c6",
-        "docs/guide.md": "518441f4dcbd95c1318e1db9ad002b024dbe7b2aa3dee479ebb6976f00355d18",
+        "docs/guide.md": "14f8c45663c1325f681cce418d59d4093cc858d605a98630cce0030fff5e479d",
         "plugin.js": "7f602a60c4eca7d3637659d03d5de9e242584666846b16c9e5a1b758e4856c9f",
-        "plugin.json": "2cae5b11f9975bcf76aa6369001e42ba4e5cf5bc3cee169f125720383acd7fdb"
+        "plugin.json": "0d928f4a6dc5bcca9e23e35280d026eb133a8bb1120daea54cbe754c2b4e7773"
       }
     },
     "security": {

package/plugins/mail-reader/CLAUDE.md

@@ -97,3 +97,8 @@ pool leaves nothing open; it does not verify folder listing or rendering, which
 
 plugin.json `uses: {contacts}` - Add sender to contacts comes from core Contacts (`_lib/admin/mail/contacts.js`).
 With the Tool switched off its API 404s and the action is simply absent.
+
+## Reading pane menu (guide only, 1.2.4; core domma-cms PR #93)
+
+Right-click on the open message is engine code (`_lib/admin/mail/body-menu.js`, the `MENU_BRIDGE` in
+`_lib/mail/render.js`); this version only documents it in docs/guide.md. Ship after the core release.

package/plugins/mail-reader/docs/guide.md

@@ -53,6 +53,7 @@ You need your mailbox's IMAP details from your email provider: the server name,
 - If a message has remote images, a notice says how many were blocked. Click **Load images** to load them for this message only. Loading them tells the sender you opened it.
 - **Always from** (followed by the sender's address) trusts that sender, so their images load straight away in future. It appears only when **Offer to remember senders** is on (see Settings).
 - Click an attachment to download it.
+- Right-click the message itself (or press Shift+F10 or the menu key while reading it) for **Copy** when you have selected some text, plus the message list's menu. Right-clicking a link or picture in the message gives your browser's own menu.
 
 ### Keyboard
 

package/plugins/mail-reader/plugin.json

@@ -1,7 +1,7 @@
 {
   "name": "mail-reader",
   "displayName": "Mail Reader",
-  "version": "1.2.3",
+  "version": "1.2.4",
   "tier": "free",
   "description": "Read-only IMAP mailbox reader. Connects to a standard IMAP server and reads mail without ever writing to it.",
   "author": "Darryl Waterhouse",