domma-cms 1.6.56 → 1.6.57

package/plugins/shopping-cart/admin/views/sales.js

@@ -24,6 +24,8 @@ export async function mount(root, ctx) {
     <button type="button" class="btn btn-sm btn-outline" data-act="csv"><span data-icon="download" data-icon-size="13"></span> CSV</button>
   </div>
   <p class="shp-muted" data-part="span"></p>
+  <div class="shp-loading-slot" data-part="loading">Loading…</div>
+  <p class="shp-error" data-part="error" hidden></p>
   <div class="shp-tiles" data-part="tiles"></div>
   <section class="shp-card shp-chart-card"><header><h3>Takings</h3><span class="shp-muted" data-part="chart-total"></span></header><div class="shp-chart" data-part="chart"></div></section>
   <div class="shp-sales-cols">
@@ -97,14 +99,30 @@ export async function mount(root, ctx) {
         I.scan(root);
     }
 
+    // The first load runs under a skeleton; a new range or grouping keeps the figures on screen until the next arrive.
+    let first = true;
+    let asked = 0;
     async function load() {
+        const mine = ++asked;
+        root.querySelector('.shp-sales').classList.toggle('is-busy', !first);
         try {
-            report = await api.sales(q);
-            if (!here()) return;
+            const res = first ? await kit.whileLoading(part('loading'), api.sales(q), kit.SHAPES.tiles) : await api.sales(q);
+            // Gone, or a later range was asked for meanwhile: this answer is not wanted.
+            if (!here() || mine !== asked) return;
+            report = res;
+            part('error').hidden = true;
             try { sessionStorage.setItem('shop-sales', JSON.stringify({range: q.range, by: q.by})); } catch { /* private mode */ }
             render();
         } catch (err) {
-            part('tiles').textContent = `Sales could not load: ${err.message || err}`;
+            if (!here() || mine !== asked) return;
+            part('error').hidden = false;
+            part('error').textContent = `Sales could not load: ${err.message || err}`;
+        } finally {
+            if (here() && mine === asked) {
+                first = false;
+                part('loading').hidden = true;
+                root.querySelector('.shp-sales').classList.remove('is-busy');
+            }
         }
     }
 

package/plugins/shopping-cart/admin/views/settings.js

@@ -3,9 +3,16 @@
  * Payment, each field explained in place. Secrets arrive masked and are never
  * shown; leaving a mask as it is keeps the stored key. "Test" tries the keys
  * typed (before saving) against Stripe or PayPal.
+ *
+ * What is typed is kept as a draft while the panel is open - WITHOUT the
+ * payment keys, which never reach the browser's storage - so leaving the
+ * screen loses nothing; opening the settings again asks whether to throw
+ * those changes away (OK) or keep them (Cancel / Escape), and says when the
+ * settings have been changed since.
  */
 
-import {api, copy, esc, moneyIn, moneyOut, openPanel, setCurrency} from '../lib/kit.js';
+import {api, ask, copy, esc, moneyIn, moneyOut, openPanel, setCurrency, store} from '../lib/kit.js';
+import {SETTINGS_DRAFT_KEY, draftDiffers, draftValues, isDraft, keepableSettings, settingsDraftQuestion, settingsFingerprint, stableJson} from '../lib/drafts.js';
 import {CURRENCIES} from '/plugins/shopping-cart/public/lib/money.js';
 import {COUNTRIES} from '/plugins/shopping-cart/public/lib/orders.js';
 
@@ -19,9 +26,16 @@ const MONEY_KEYS = ['shippingFlat', 'freeShippingOver'];
 const BOOL_KEYS = ['showSearch', 'showCategories', 'floatingCart', 'showStockLeft', 'accounts', 'allowCollection', 'pricesIncludeTax', 'taxShipping',
     'stripeEnabled', 'paypalEnabled', 'offlineEnabled'];
 
+/**
+ * Open the settings panel. `ctx.here()` says whether the Shop screen is still
+ * up; the returned promise resolves with the panel handle (null if it never
+ * opened), so the caller can close it when the screen goes.
+ */
 export async function openSettings(ctx, section = 'store') {
+    const here = ctx.here || (() => true);
     let info;
-    try { info = await api.settings.get(); } catch (err) { E.toast(`Settings did not load: ${err.message || err}`, {type: 'error'}); return; }
+    try { info = await api.settings.get(); } catch (err) { if (here()) E.toast(`Settings did not load: ${err.message || err}`, {type: 'error'}); return null; }
+    if (!here()) return null;
     const s = info.settings;
     const f = {};
     for (const [k, v] of Object.entries(s)) f[k] = M.observable(MONEY_KEYS.includes(k) ? moneyIn(v) : Array.isArray(v) ? [...v] : v);
@@ -30,6 +44,37 @@ export async function openSettings(ctx, section = 'store') {
     const testing = M.observable('');
     const snapshot = () => JSON.stringify(Object.fromEntries(Object.entries(f).map(([k, o]) => [k, o.peek()])));
     const opened = snapshot();
+    const formValues = () => keepableSettings(Object.fromEntries(Object.entries(f).map(([k, o]) => [k, o.peek()])));
+    const recordValues = formValues();
+    const recordJson = stableJson(recordValues);
+    let was = settingsFingerprint(s);
+
+    // A kept draft: asked about first; removed only once the person has answered (leaving while asked keeps it).
+    const kept = store.get(SETTINGS_DRAFT_KEY);
+    let restored = false;
+    if (isDraft(kept) && draftDiffers(kept, recordValues)) {
+        const q = settingsDraftQuestion(kept, was);
+        const question = ask(q.text, q.options);
+        ctx.scope?.(() => question.dismiss());
+        const throwAway = await question.answer;
+        if (!here()) return null;
+        if (throwAway) store.remove(SETTINGS_DRAFT_KEY);
+        else {
+            for (const [k, v] of Object.entries(draftValues(kept, recordValues))) f[k].value = Array.isArray(v) ? [...v] : v;
+            was = kept.was ?? was; // a picked-up draft keeps its own `was`
+            restored = true;
+        }
+    } else if (kept) store.remove(SETTINGS_DRAFT_KEY);
+
+    // Rewritten on every change while open; never holds a payment key.
+    let drafting = true;
+    const keepDraft = () => {
+        if (!drafting) return;
+        const v = formValues();
+        if (stableJson(v) === recordJson) store.remove(SETTINGS_DRAFT_KEY);
+        else store.set(SETTINGS_DRAFT_KEY, {values: v, was, at: new Date().toISOString()});
+    };
+    const stopDraft = M.effect(() => { Object.values(f).forEach(o => o.value); keepDraft(); });
 
     const model = {
         ...f, tab, saving, testing,
@@ -54,6 +99,7 @@ export async function openSettings(ctx, section = 'store') {
 
     const check = (k, label, help = '') => `<label class="shp-check"><input type="checkbox" data-bool="${k}"> ${label}${help ? ` <span data-help="${esc(help)}"></span>` : ''}</label>`;
     const html = `<div class="shp-form shp-settings">
+  ${restored ? '<p class="shp-callout shp-restored">These are the changes you left unsaved (payment keys are never kept). Save to keep them, or close and discard them.</p>' : ''}
   <div class="shp-seg shp-settings-nav" role="tablist">
     ${SECTIONS.map(x => `<button type="button" role="tab" data-tab="${x.key}" data-bind-class="tab.value === '${x.key}' && 'is-on'"><span data-icon="${x.icon}" data-icon-size="13"></span> ${x.label}</button>`).join('')}
   </div>
@@ -192,6 +238,9 @@ export async function openSettings(ctx, section = 'store') {
         html,
         model,
         dirty: () => snapshot() !== opened,
+        busy: () => saving.peek(),
+        discarded: () => { drafting = false; store.remove(SETTINGS_DRAFT_KEY); },
+        cleanup: () => { drafting = false; stopDraft(); },
         before: (el) => {
             for (const box of el.querySelectorAll('[data-bool]')) {
                 box.checked = Boolean(f[box.dataset.bool].peek());
@@ -218,6 +267,7 @@ export async function openSettings(ctx, section = 'store') {
             testStripe: () => test('stripe'),
             testPaypal: () => test('paypal'),
             async save() {
+                if (saving.peek() || !panel?.isOpen()) return;
                 const out = {};
                 for (const [k, o] of Object.entries(f)) out[k] = o.peek();
                 for (const k of MONEY_KEYS) {
@@ -229,21 +279,30 @@ export async function openSettings(ctx, section = 'store') {
                 out.columns = Number(out.columns);
                 out.taxRate = Number(out.taxRate) || 0;
                 out.lowStockAt = Number(out.lowStockAt) || 0;
+                // The panel closes after a save, so the form is locked while it runs: nothing typed meanwhile is lost.
                 saving.value = true;
+                panel.lock(true);
+                const sent = formValues();
                 try {
                     const r = await api.settings.save(out);
                     Object.assign(ctx.settings, r.settings);
                     setCurrency(r.settings.currency);
+                    drafting = false;
+                    if (stableJson(store.get(SETTINGS_DRAFT_KEY)?.values) === stableJson(sent)) store.remove(SETTINGS_DRAFT_KEY);
                     E.toast('Shop settings saved.', {type: 'success'});
                     const moved = r.settings.currency !== s.currency || r.settings.shopPath !== s.shopPath;
+                    saving.value = false;
                     panel.close(true);
-                    if (moved) location.reload();
+                    if (moved && here()) location.reload();
                 } catch (err) {
                     E.toast(`Not saved: ${err.message || err}`, {type: 'error', duration: 8000});
                 } finally {
                     saving.value = false;
+                    if (panel.isOpen()) panel.lock(false);
                 }
             }
         }
     });
+    if (!here()) panel.close(true);
+    return panel;
 }

package/plugins/shopping-cart/admin/views/shop.js

@@ -12,7 +12,7 @@
  * Settings are behind the banner's cog, in a slideover.
  */
 
-import {api, loadKit, setCurrency, store} from '../lib/kit.js';
+import {api, claims, loadKit, setCurrency, store} from '../lib/kit.js';
 
 const ROUTE = /^#\/plugins\/shopping-cart(\/|$)/;
 const V = '1.6.2';
@@ -51,6 +51,7 @@ export const shopView = {
         try {
             [settingsRes, ext] = await Promise.all([api.settings.get(), api.extensions().catch(() => ({tabs: []}))]);
         } catch (err) {
+            if (!here()) return;
             root.innerHTML = '';
             const p = document.createElement('p');
             p.className = 'shp-error';
@@ -100,12 +101,26 @@ export const shopView = {
         root.append(nav, body);
         I.scan(nav);
 
+        // The settings panel: one at a time, closed when the screen goes.
+        const once = claims();
+        let settingsPanel = null;
+        scope(() => { try { settingsPanel?.close(true); } catch { /* gone */ } });
         const ctx = {
             kit, scope, here, root: body, container, settings, settingsInfo: settingsRes, id, extensions: ext,
             go(t, i = '') { location.hash = `#/plugins/shopping-cart${t && t !== 'overview' ? `/${t}` : ''}${i ? `/${encodeURIComponent(i)}` : ''}`; },
             async openSettings(section) {
-                const m = await import(`/plugins/shopping-cart/admin/views/settings.js?v=${V}`);
-                m.openSettings(ctx, section);
+                if (settingsPanel?.isOpen()) return;
+                const release = once.take('settings');
+                if (!release) return;
+                try {
+                    const m = await import(`/plugins/shopping-cart/admin/views/settings.js?v=${V}`);
+                    if (!here()) return;
+                    settingsPanel = await m.openSettings(ctx, section);
+                } catch (err) {
+                    if (here()) E.toast(`Settings could not open: ${err.message || err}`, {type: 'error'});
+                } finally {
+                    release();
+                }
             }
         };
 

package/plugins/shopping-cart/plugin.json

@@ -1,11 +1,11 @@
 {
   "name": "shopping-cart",
   "displayName": "Shopping Cart",
-  "version": "1.6.3",
+  "version": "1.7.0",
   "tier": "free",
   "description": "Sell from your site: products with options, stock and pictures, a storefront and a cart that follows shoppers from page to page, and checkout with Stripe, PayPal or payment offline. Orders to fulfil in the sidebar, refunds from the order.",
   "author": "Domma CMS",
-  "date": "2026-10-13",
+  "date": "2026-10-15",
   "icon": "shopping-bag",
   "permissions": [
     {
@@ -45,7 +45,7 @@
     ],
     "views": {
       "plugin-shopping-cart": {
-        "entry": "shopping-cart/admin/views/shop.js?v=1.6.2",
+        "entry": "shopping-cart/admin/views/shop.js?v=1.7.0",
         "exportName": "shopView"
       }
     }

package/plugins/shopping-cart/tests/accounts.test.js

@@ -2,6 +2,8 @@
  * Customer accounts against the real user and collection services in the domma-cms checkout `make test` runs in.
  * The test's authenticate reads `x-user` (a real user id) the way core's reads a token; mail is caught with
  * setAccountMailer. Every user it makes, and its collections, are removed; config/plugins.json is restored.
+ * Emailed links need a trusted address (1.6.1: never a request's Host), so the test gives the site a Site URL
+ * (config/site.json baseUrl) and puts the file back afterwards.
  */
 import {test, before, after} from 'node:test';
 import assert from 'node:assert/strict';
@@ -14,9 +16,12 @@ import {deleteUser, getUserByEmail, getUserById} from '../../../server/services/
 import {checkResetToken} from '../../../server/services/passwordReset.js';
 
 const PLUGINS = path.resolve('config/plugins.json');
+const SITE = path.resolve('config/site.json');
+const SITE_URL = 'https://shop.example.test';
 const DIRS = ['shop-products', 'shop-orders'].map(c => path.resolve('content/collections', c));
 const EMAILS = ['acc-ann@example.test', 'acc-bo@example.test'];
 let saved;
+let savedSite;
 let app;
 const mail = [];
 
@@ -26,6 +31,10 @@ async function cleanUsers() {
 
 before(async () => {
     saved = await fs.readFile(PLUGINS, 'utf8').catch(() => null);
+    savedSite = await fs.readFile(SITE, 'utf8').catch(() => null);
+    let site = {};
+    try { site = JSON.parse(savedSite || '{}'); } catch { /* replaced below, restored after */ }
+    await fs.writeFile(SITE, JSON.stringify({...site, baseUrl: SITE_URL}, null, 2) + '\n');
     for (const d of DIRS) await fs.rm(d, {recursive: true, force: true});
     await cleanUsers();
     setAccountMailer((m) => { mail.push(m); });
@@ -50,6 +59,8 @@ after(async () => {
     for (const d of DIRS) await fs.rm(d, {recursive: true, force: true});
     if (saved === null) await fs.rm(PLUGINS, {force: true});
     else await fs.writeFile(PLUGINS, saved);
+    if (savedSite === null) await fs.rm(SITE, {force: true});
+    else await fs.writeFile(SITE, savedSite);
 });
 
 const call = async (method, url, body, user = null) => {

package/plugins/shopping-cart/tests/drafts.test.js

@@ -0,0 +1,118 @@
+/**
+ * Kept drafts (admin/lib/drafts.js) - pure, no DOM.
+ */
+import {test} from 'node:test';
+import assert from 'node:assert/strict';
+import {readFileSync} from 'node:fs';
+import {fileURLToPath} from 'node:url';
+import {
+    NEW_KEY, esc, SECRET_KEYS, adoptAsNew, draftDiffers, draftFate, draftKey, draftValues, isDraft, keepableSettings, productDraftQuestion,
+    readMap, replaceNewDraftQuestion, settingsDraftQuestion, settingsFingerprint, stableJson, withDraft
+} from '../admin/lib/drafts.js';
+
+const T0 = '2026-10-15T10:00:00.000Z';
+const T1 = '2026-10-15T11:00:00.000Z';
+
+test('drafts: keys, the stored map cleaned, one entry changed at a time', () => {
+    assert.equal(draftKey(''), NEW_KEY);
+    assert.equal(draftKey(null), NEW_KEY);
+    assert.equal(draftKey('abc'), 'abc');
+    assert.equal(esc('<a href="x">&</a>'), '&lt;a href=&quot;x&quot;&gt;&amp;&lt;/a&gt;');
+    assert.deepEqual(readMap(null), {});
+    assert.deepEqual(readMap([1, 2]), {});
+    assert.deepEqual(readMap({a: {values: {name: 'x'}}, b: 'junk', c: {values: []}}), {a: {values: {name: 'x'}}});
+    const raw = {a: {values: {name: 'x'}}};
+    const next = withDraft(raw, 'b', {values: {name: 'y'}});
+    assert.deepEqual(Object.keys(next).sort(), ['a', 'b']);
+    assert.deepEqual(Object.keys(raw), ['a'], 'the input is left alone');
+    assert.deepEqual(Object.keys(withDraft(next, 'a', null)), ['b']);
+    assert.equal(isDraft({values: {}}), true);
+    assert.equal(isDraft({values: null}), false);
+});
+
+test('drafts: compared by the form\'s own fields, keys in any order', () => {
+    assert.equal(stableJson({b: 1, a: [1, {d: 2, c: 3}]}), stableJson({a: [1, {c: 3, d: 2}], b: 1}));
+    const form = {name: 'Mug', price: '12.00'};
+    assert.equal(draftDiffers({values: {price: '12.00', name: 'Mug', old: 'x'}}, form), false, 'a field the form no longer has is ignored');
+    assert.equal(draftDiffers({values: {name: 'Mug!', price: '12.00'}}, form), true);
+    assert.equal(draftDiffers(null, form), false);
+    assert.deepEqual(draftValues({values: {name: 'A', old: 1}}, form), {name: 'A'});
+});
+
+test('drafts: what became of the record since', () => {
+    assert.equal(draftFate({was: T0}, null), 'deleted');
+    assert.equal(draftFate({was: T0}, T0), '');
+    assert.equal(draftFate({was: T0}, T1), 'changed');
+    assert.equal(draftFate({was: null}, T1), '', 'no `was` (a new record) is never "changed"');
+    assert.equal(draftFate({was: T0}, ''), '', 'a record with no updatedAt cannot be judged');
+});
+
+test('drafts: the restore question puts the throwing away on OK, the keeping on Cancel', () => {
+    const d = {values: {name: 'Mug'}, was: T0, at: T1};
+    const same = productDraftQuestion(d, {name: 'Mug', updatedAt: T0});
+    assert.match(same.text, /^Throw away the changes you left unsaved on “Mug”/);
+    assert.equal(same.options.confirmText, 'Throw away');
+    assert.equal(same.options.cancelText, 'Keep them');
+    assert.equal(same.asNew, false);
+    assert.doesNotMatch(same.text, /changed since/);
+
+    const changed = productDraftQuestion(d, {name: 'Mug', updatedAt: T1});
+    assert.match(changed.text, /has been changed since/);
+    assert.equal(changed.asNew, false);
+
+    const gone = productDraftQuestion(d, null);
+    assert.match(gone.text, /deleted since/);
+    assert.equal(gone.asNew, true);
+    assert.equal(gone.options.confirmText, 'Throw away');
+    assert.match(gone.options.cancelText, /new product/);
+
+    const fresh = productDraftQuestion({values: {name: 'Tote'}, was: null, at: T1}, null, {isNew: true});
+    assert.match(fresh.text, /a new product \(“Tote”\)/);
+    assert.equal(fresh.asNew, false, 'a new product\'s draft is never "deleted since"');
+});
+
+test('drafts: names reach the questions escaped (E.confirm renders HTML)', () => {
+    const evil = 'Mug <img src=x onerror=alert(1)> & "Co"';
+    const d = {values: {name: evil}, was: T0, at: T1};
+    for (const q of [productDraftQuestion(d, {name: evil, updatedAt: T0}), productDraftQuestion(d, null),
+        productDraftQuestion(d, null, {isNew: true}), replaceNewDraftQuestion(d)]) {
+        assert.doesNotMatch(q.text, /<img/);
+        assert.match(q.text, /Mug &lt;img src=x onerror=alert\(1\)&gt; &amp; &quot;Co&quot;/);
+    }
+});
+
+test('drafts: a deleted product\'s draft adopted as new starts with no `was` and no option ids', () => {
+    const d = {values: {name: 'Mug', variants: [{id: 'v1', name: 'S'}]}, slugTouched: true, was: T0, at: T1};
+    const a = adoptAsNew(d, '2026-10-15T12:00:00.000Z');
+    assert.equal(a.was, null);
+    assert.equal(a.adopted, true);
+    assert.equal(a.at, T1, 'keeps when it was left');
+    assert.deepEqual(a.values.variants, [{id: '', name: 'S'}]);
+    assert.equal(d.values.variants[0].id, 'v1', 'the original is left alone');
+    const q = replaceNewDraftQuestion({values: {name: 'Tote'}, at: T1});
+    assert.match(q.text, /already a new product left unsaved - “Tote”/);
+    assert.equal(q.options.confirmText, 'Throw it away');
+    assert.equal(q.options.cancelText, 'Keep both');
+});
+
+test('drafts: settings drafts never hold a payment key', () => {
+    const s = {shopTitle: 'Shop', stripeSecretKey: 'sk_test_x', stripeWebhookSecret: 'whsec_x', paypalClientId: 'id', paypalSecret: 'sec', taxRate: 20};
+    const kept = keepableSettings(s);
+    for (const k of SECRET_KEYS) assert.equal(k in kept, false, k);
+    assert.deepEqual(kept, {shopTitle: 'Shop', taxRate: 20});
+    assert.equal(settingsFingerprint(s), settingsFingerprint({...s, stripeSecretKey: '••••••••'}), 'a masked key does not count as a change');
+    const was = settingsFingerprint(s);
+    assert.doesNotMatch(settingsDraftQuestion({values: {}, was, at: T1}, was).text, /changed since/);
+    const q = settingsDraftQuestion({values: {}, was, at: T1}, settingsFingerprint({...s, taxRate: 5}));
+    assert.match(q.text, /changed since/);
+    assert.equal(q.options.confirmText, 'Throw away');
+});
+
+test('admin: no restore question makes Cancel (false) the throwing away', () => {
+    // E.confirm answers false for Cancel, Escape and the backdrop alike - so "discard" must always be OK.
+    for (const f of ['products.js', 'settings.js']) {
+        const src = readFileSync(fileURLToPath(new URL(`../admin/views/${f}`, import.meta.url)), 'utf8');
+        assert.doesNotMatch(src, /cancelText:\s*'(Discard|Throw away)/, f);
+        assert.doesNotMatch(src, /E\.prompt\([^)]*(inputValue|defaultValue)/, `${f}: a starting value goes in through promptWith`);
+    }
+});

package/plugins/support/CLAUDE.md

@@ -140,3 +140,17 @@ every id on that list - so a request Domma deleted left its screenshots on the s
 narrows `files` with `keepFiles(files, remote, items)` (PURE, tested): only ids in a message of a request the manager
 still holds (its `/fleet/mine` is complete for the site) or named by an outbox item. The next prune (older than a day)
 removes the rest. Found on the dcm click-through.
+
+## 1.2.0 (2026-10-15 Tool Upgrade, second pass)
+
+- Panels keep drafts under one key per panel and record (`support.draft.*`, `admin/lib/drafts.js`, tested), holding only
+  the changed fields, with `was` a fingerprint of the record. The restore question puts "Throw away" on OK, so Cancel,
+  Escape and the backdrop keep; a draft goes only after an answer; leaving closes panels and keeps drafts. Picked files
+  are never kept in a draft.
+- `kit.guardPanel` must be called after `openPanel`. It can still write after its panel closed: `rebase()` keeps
+  what is left unsent, `settle()` removes the draft once a save/send succeeded - call it on every success, or leaving
+  mid-send keeps a draft of text already sent (and invites a second send).
+- `rowKeys` stops Enter/Space and runs the row's main action on the next tick: Domma's confirm adds its document
+  keydown while the opening Enter is still bubbling and would read it as OK = Throw away.
+- Opening a request: only a 404 counts as deleted; any other failure toasts and keeps the draft. The desk's file picker
+  has `drop(ids)` - remove only the attachments that went with the message.

package/plugins/support/admin/css/index.css

@@ -112,3 +112,13 @@
   .sp-row { flex-wrap: wrap; }
   .sp-msg { max-width: 100%; }
 }
+
+/* The first load's skeleton slot (admin/js/lib/loading.js): a block, never a flex row, or it collapses. */
+.sp-loading { display: block; margin: .5rem 0; color: var(--dm-text-secondary); font-size: var(--dm-font-size-sm); }
+/* A panel saving before it closes is locked (inert): show it. */
+.sp-form.is-saving, .sp-detail.is-saving { opacity: .65; cursor: progress; }
+/* A message's menu button: quiet until the message is hovered or focused. */
+.sp-msg-head small { margin-left: auto; }
+.sp-msg-head .sp-msg-kebab { padding: 0 .3rem; opacity: .55; }
+.sp-msg:hover .sp-msg-kebab, .sp-msg:focus-within .sp-msg-kebab { opacity: 1; }
+.sp-msg:focus-visible { outline: 2px solid var(--dm-primary); outline-offset: 1px; }

package/plugins/support/admin/lib/drafts.js

@@ -0,0 +1,162 @@
+/**
+ * Support - kept drafts (PURE: no DOM, no globals; tested in tests/drafts.test.js).
+ *
+ * Every panel that takes typing keeps what was typed and not yet saved under its
+ * own storage key (one key per panel and record - never a shared map, so work
+ * finishing after a screen has gone cannot write a stale copy of someone else's).
+ *
+ * A draft is `{data, was, at}`: the form's values, the fingerprint of the record
+ * when the edits began (empty for something new), and when it was last typed in.
+ * `was` lets the "unsaved changes from last time" question say the record has
+ * changed - or gone - since.
+ *
+ * The question's DESTRUCTIVE answer is always OK ("Throw away"): Domma's E.confirm
+ * answers false for Cancel, Escape and a backdrop click alike, so false must KEEP.
+ *
+ * Support carries its own copy of Feedback's module (either plugin can be installed
+ * alone), plus what a conversation needs: `ticketPrint` and `afterSend`.
+ *
+ * @module support/admin/lib/drafts
+ */
+
+/** Storage keys. */
+export const DRAFT_KEYS = {
+    /** A new request, not yet sent (a site). */
+    compose: 'support.draft.compose',
+    /** A message being written on one of this site's requests (by ref). */
+    reply: (ref) => `support.draft.reply.${ref}`,
+    /** Domma's reply and notes on a request in the inbox (by entry id). */
+    answer: (id) => `support.draft.answer.${id}`,
+    settings: 'support.draft.settings'
+};
+
+/** JSON with object keys sorted, so two equal values always compare equal. */
+export function stableJson(v) {
+    if (Array.isArray(v)) return `[${v.map(stableJson).join(',')}]`;
+    if (v && typeof v === 'object') {
+        return `{${Object.keys(v).sort().filter(k => v[k] !== undefined).map(k => `${JSON.stringify(k)}:${stableJson(v[k])}`).join(',')}}`;
+    }
+    return JSON.stringify(v ?? null);
+}
+
+/** Do two form states differ? */
+export const differs = (a, b) => stableJson(a) !== stableJson(b);
+
+/**
+ * Only what was changed from the saved values: a kept draft holds these, so
+ * picking it up later puts back the person's own edits and leaves every field
+ * they did not touch as the record has it NOW (someone else's change survives).
+ */
+export function changedFields(values = {}, baseline = {}) {
+    return Object.fromEntries(Object.entries(values).filter(([k, v]) => stableJson(v) !== stableJson(baseline[k])));
+}
+
+/** A draft as kept. */
+export function makeDraft(data, was = '', at = new Date().toISOString()) {
+    return {data, was: String(was || ''), at};
+}
+
+/** Is this something this module wrote (and not an older build's leftovers)? */
+export function isDraft(d) {
+    return Boolean(d && typeof d === 'object' && d.data && typeof d.data === 'object' && !Array.isArray(d.data));
+}
+
+/** The draft's values over a form's defaults - only the keys the form has, as strings. */
+export function draftValues(draft, defaults) {
+    const out = {...defaults};
+    if (!isDraft(draft)) return out;
+    for (const k of Object.keys(defaults)) {
+        if (draft.data[k] !== undefined && draft.data[k] !== null) out[k] = String(draft.data[k]);
+    }
+    return out;
+}
+
+/**
+ * A request's fingerprint for `was`: its conversation (how many messages, the
+ * latest) and - for the inbox - its internal notes. "Changed since" then means
+ * someone has written since the draft began, or the notes moved.
+ */
+export function ticketPrint(t, {notes = false} = {}) {
+    if (!t) return '';
+    const messages = Array.isArray(t.messages) ? t.messages : [];
+    return stableJson({count: messages.length, last: messages.at(-1)?.id || '', ...(notes && {notes: String(t.notes || '')})});
+}
+
+/**
+ * What is left in a reply box once a message has gone: nothing, if it still
+ * holds just what was sent; what was typed AFTER it, if the person carried on
+ * at the end while it was sending; everything, if they changed the text itself.
+ */
+export function afterSend(current, sent) {
+    const c = String(current ?? '');
+    const s = String(sent ?? '');
+    if (c === s) return '';
+    if (s && c.startsWith(s)) return c.slice(s.length).replace(/^\s+/, '');
+    return c;
+}
+
+/** The settings' fingerprint for `was`: the values the panel loaded. */
+export const settingsPrint = (values = {}) => stableJson(values);
+
+/**
+ * What became of the record since the draft's edits began.
+ * @param {{was?: string}} draft
+ * @param {string|null} now - the record's fingerprint now; null when it has been deleted
+ * @returns {'deleted'|'changed'|''}
+ */
+export function draftFate(draft, now) {
+    if (now === null) return 'deleted';
+    return draft?.was && now && draft.was !== now ? 'changed' : '';
+}
+
+const MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+/** "15 Oct, 14:02" - local time. */
+export function shortWhen(iso) {
+    const t = Date.parse(iso);
+    if (!Number.isFinite(t)) return '';
+    const d = new Date(t);
+    const p = (n) => String(n).padStart(2, '0');
+    return `${d.getDate()} ${MONTHS[d.getMonth()]}, ${p(d.getHours())}:${p(d.getMinutes())}`;
+}
+
+/** E.confirm options for every restore question: OK throws away; Cancel, Escape and the backdrop keep. */
+export const RESTORE_CONFIRM = {title: 'Unsaved changes', confirmText: 'Throw away', cancelText: 'Keep them'};
+
+/** E.confirm options for closing a panel with changes: Cancel (or Escape) keeps the panel open. */
+export const DISCARD_CONFIRM = {title: 'Unsaved changes', confirmText: 'Discard', cancelText: 'Keep editing'};
+
+/**
+ * The question a kept draft on an existing record is offered back with.
+ *
+ * @param {object} draft
+ * @param {string|null} now - the record's fingerprint now (null: deleted)
+ * @param {{what: string, changedAt?: string, changed?: string}} o - `what`: "your reply to “Site down”"; `changed`: how a change is said
+ * @returns {{text: string, fate: string, options: object}}
+ */
+export function draftQuestion(draft, now, {what, changedAt = '', changed = 'It has been changed since'}) {
+    const at = shortWhen(draft?.at);
+    const ask = `Throw away the changes you left unsaved on ${what}${at ? ` (${at})` : ''}?`;
+    const fate = draftFate(draft, now);
+    if (fate === 'deleted') {
+        return {fate, options: {...RESTORE_CONFIRM, cancelText: 'Copy them'},
+            text: `${ask} It has been deleted since, so they can no longer be saved - keeping them copies them, so you can paste them elsewhere.`};
+    }
+    if (fate === 'changed') {
+        const since = shortWhen(changedAt);
+        return {fate, options: RESTORE_CONFIRM,
+            text: `${ask} ${changed}${since ? ` (${since})` : ''} - keeping them puts your changes over that.`};
+    }
+    return {fate, options: RESTORE_CONFIRM, text: `${ask} Keeping them puts them back in the form.`};
+}
+
+/** The question for something new that was never sent (no record, so nothing to change). */
+export function newDraftQuestion(draft, what = 'the request') {
+    const at = shortWhen(draft?.at);
+    return {options: RESTORE_CONFIRM, text: `Throw away ${what} you left unsent${at ? ` (${at})` : ''}? Keeping it puts it back in the form.`};
+}
+
+/** Plain text of a draft, for copying when its record has gone. */
+export function draftText(draft) {
+    if (!isDraft(draft)) return '';
+    return Object.entries(draft.data).filter(([, v]) => typeof v === 'string' && v.trim()).map(([k, v]) => `${k}:\n${v}`).join('\n\n');
+}