domma-cms 0.74.0 → 0.75.0

package/server/routes/api/collections.js

@@ -3,6 +3,7 @@
  *
  * Admin endpoints (authenticated + collections role):
  * GET    /collections                    - List all collections
+ * GET    /collections/_count             - The sidebar badge (count + popover details)
  * POST   /collections                    - Create collection
  * GET    /collections/:slug              - Get schema
  * PUT    /collections/:slug              - Update schema
@@ -64,6 +65,45 @@ import {isProjectEnabled, resolveArtefactProject} from '../../services/projects.
 
 const ALL_PRESET_SLUGS = new Set(['roles', 'user-profiles', ...PRESET_COLLECTION_SLUGS]);
 
+/**
+ * The sidebar badge on Collections (GET /collections/_count): how many
+ * collections this user sees and how many entries they hold, with where they
+ * are stored and the biggest ones. Plain text throughout - the popover sets it
+ * with textContent.
+ *
+ * @param {object[]} list - collections with entryCount, as listCollections answers
+ * @returns {{count: number, label: string, tone: string, details: object}}
+ */
+export function collectionsBadge(list = []) {
+    const plural = (n, one, many = `${one}s`) => `${n.toLocaleString('en-GB')} ${n === 1 ? one : many}`;
+    const kind = (c) => (ALL_PRESET_SLUGS.has(c.slug) ? 'builtin' : c.plugin ? 'plugin' : 'own');
+    const counts = {own: 0, builtin: 0, plugin: 0};
+    for (const c of list) counts[kind(c)]++;
+    const entries = list.reduce((s, c) => s + (Number(c.entryCount) || 0), 0);
+    const mongo = list.filter(c => c.storage?.adapter === 'mongodb').length;
+    const biggest = list.filter(c => Number(c.entryCount) > 0)
+        .sort((a, b) => b.entryCount - a.entryCount || String(a.title || a.slug).localeCompare(String(b.title || b.slug)));
+    return {
+        count: list.length,
+        label: `${plural(list.length, 'collection')}, ${plural(entries, 'entry', 'entries')}`,
+        tone: 'info',
+        details: {
+            title: 'Collections',
+            rows: [
+                {label: 'Yours', value: String(counts.own)},
+                {label: 'Built in', value: String(counts.builtin)},
+                {label: 'Plugins', value: String(counts.plugin)},
+                {label: 'On MongoDB', value: String(mongo)}
+            ],
+            items: biggest.slice(0, 6).map(c => ({
+                text: String(c.title || c.slug),
+                meta: `${plural(Number(c.entryCount), 'entry', 'entries')} · ${c.slug}`
+            })),
+            empty: 'No entries in any collection yet.'
+        }
+    };
+}
+
 /**
  * Resolve the role level number for a named role.
  *
@@ -242,11 +282,23 @@ export async function collectionsRoutes(fastify) {
         for (const c of all) {
             // listCollections returns metadata only; getCollection returns full record with meta
             const full = await getCollection(c.slug);
-            if (canSeeArtefact(request.user, full)) filtered.push(c);
+            // builtIn: the ones DELETE refuses (seeding turns `preset` into `bundled`, which
+            // also covers deletable seeded collections - so the list says which is which).
+            if (canSeeArtefact(request.user, full)) filtered.push(ALL_PRESET_SLUGS.has(c.slug) ? {...c, builtIn: true} : c);
         }
         return filtered;
     });
 
+    // The sidebar badge. Static, so it wins over /collections/:slug; `_` is never in a slug.
+    fastify.get('/collections/_count', canRead, async (request) => {
+        const {canSeeArtefact} = await import('../../services/projects.js');
+        const visible = [];
+        for (const c of await listCollections()) {
+            if (canSeeArtefact(request.user, await getCollection(c.slug))) visible.push(c);
+        }
+        return collectionsBadge(visible);
+    });
+
     fastify.get('/collections/pro-status', canRead, async () => {
     try {
       const connections = getConfig('connections');

package/server/routes/api/components.js

@@ -3,6 +3,7 @@
  * CRUD + compilation + export/import for .dmc components.
  *
  * GET    /api/components              - list
+ * GET    /api/components/_count       - the sidebar badge (`_` is outside NAME_RE, so no component shadows it)
  * GET    /api/components/:name        - raw source + parsed props
  * GET    /api/components/:name.js     - compiled JS module (public)
  * POST   /api/components/compile      - transient compile for preview
@@ -12,6 +13,7 @@
  * DELETE /api/components/:name        - delete
  */
 import {authenticate, requirePermission} from '../../middleware/auth.js';
+import {ago, plural} from '../../services/sidebarBadges.js';
 import {
     compileComponent,
     deleteComponent,
@@ -23,6 +25,43 @@ import {
     saveComponent
 } from '../../services/components.js';
 
+/**
+ * The sidebar badge on Components (its countUrl): how many there are, split
+ * by where they come from, with the most recently changed ones in the popover.
+ * A count to glance at, never a warning. Plain text throughout - the popover
+ * sets it with textContent.
+ *
+ * @param {object[]} list - as listComponents() returns them, already scoped to the viewer
+ * @param {number} [now]
+ * @returns {{count: number, label: string, tone: string, details: object}}
+ */
+export function componentsBadge(list = [], now = Date.now()) {
+    const plugin = list.filter(c => c.origin === 'plugin');
+    const builtin = list.filter(c => c.origin !== 'plugin' && c.bundled);
+    const mine = list.length - plugin.length - builtin.length;
+    const recent = list.filter(c => c.updatedAt)
+        .sort((a, b) => String(b.updatedAt).localeCompare(String(a.updatedAt)))
+        .slice(0, 6);
+    return {
+        count: list.length,
+        label: `${plural(list.length, 'component')}${mine ? `, ${mine} of yours` : ''}`,
+        tone: 'info',
+        details: {
+            title: 'Components',
+            rows: [
+                {label: 'Yours', value: String(mine)},
+                {label: 'Built in', value: String(builtin.length)},
+                {label: 'From plugins', value: String(plugin.length)}
+            ],
+            items: recent.map(c => {
+                const props = Object.keys(c.props || {}).length;
+                return {text: `<dm-${c.name}>`, meta: `${plural(props, 'prop')} · changed ${ago(c.updatedAt, now)}`};
+            }),
+            empty: 'No components yet.'
+        }
+    };
+}
+
 export async function componentsRoutes(fastify) {
     const canRead   = {preHandler: [authenticate, requirePermission('components', 'read')]};
     const canUpdate = {preHandler: [authenticate, requirePermission('components', 'update')]};
@@ -53,6 +92,13 @@ export async function componentsRoutes(fastify) {
         return all.filter(c => canSeeArtefact(request.user, c));
     });
 
+    // Static, so it wins over /components/:name; `_count` can never be a component name.
+    fastify.get('/components/_count', canRead, async (request) => {
+        const {canSeeArtefact} = await import('../../services/projects.js');
+        const all = await listComponents();
+        return componentsBadge(all.filter(c => canSeeArtefact(request.user, c)));
+    });
+
     fastify.get('/components/:name', canRead, async (request, reply) => {
         let component;
         try { component = await getComponent(request.params.name); }

package/server/routes/api/context-menus.js

@@ -2,6 +2,7 @@
  * Context menus API
  *
  * GET    /api/context-menus                  - list (metadata only)
+ * GET    /api/context-menus/_count           - the sidebar badge (the underscore can never be a slug)
  * GET    /api/context-menus/:slug            - full menu
  * POST   /api/context-menus                  - create
  * PUT    /api/context-menus/:slug            - replace
@@ -18,6 +19,7 @@ import {
 } from '../../middleware/auth.js';
 import {
     ACTION_TYPES,
+    contextMenusBadge,
     createContextMenu,
     deleteContextMenu,
     duplicateContextMenu,
@@ -45,6 +47,12 @@ export async function contextMenusRoutes(fastify, opts = {}) {
         return all.filter((m) => canSeeArtefact(request.user, m));
     });
 
+    // Registered before /context-menus/:slug; `_` is outside the slug alphabet, so no menu can shadow it.
+    fastify.get('/context-menus/_count', canRead, async (request) => {
+        const {canSeeArtefact} = await import('../../services/projects.js');
+        return contextMenusBadge((await listContextMenus()).filter((m) => canSeeArtefact(request.user, m)));
+    });
+
     fastify.get('/context-menus/:slug', canRead, async (request, reply) => {
         const menu = await getContextMenu(request.params.slug);
         if (!menu) return reply.code(404).send({error: 'Context menu not found'});

package/server/routes/api/forms.js

@@ -36,6 +36,7 @@ import {authenticate, requireAdmin, requirePermission} from '../../middleware/au
 import {hooks} from '../../services/hooks.js';
 import {saveMedia} from '../../services/content.js';
 import {v4 as uuidv4} from 'uuid';
+import {ago, clip, plural} from '../../services/sidebarBadges.js';
 
 /**
  * Detect form↔collection mismatches at save time so admins know BEFORE
@@ -228,6 +229,104 @@ function submissionsToCSV(form, entries) {
     return [headers.join(','), ...rows].join('\n');
 }
 
+/**
+ * Where a form's submissions are stored: its collection action's collection
+ * when that is on, else a collection named after the form. The submissions
+ * screen reads from here, so every count must too - the list used to count
+ * `form.slug` and disagreed with it for any form writing elsewhere.
+ *
+ * @param {object} form
+ * @returns {string}
+ */
+export function submissionsCollectionFor(form) {
+    const c = form?.actions?.collection;
+    return c?.enabled && c.slug ? c.slug : form?.slug;
+}
+
+const DAY_MS = 86_400_000;
+
+/**
+ * Submission figures for one form: total, this week (last 7 days), today
+ * (last 24 hours) and the newest one's time. A form whose collection does not
+ * exist yet has none.
+ *
+ * @param {object} form
+ * @param {number} [now]
+ * @returns {Promise<{total: number, week: number, today: number, last: string|null}>}
+ */
+async function submissionStats(form, now = Date.now()) {
+    try {
+        const r = await listEntries(submissionsCollectionFor(form), {limit: 0});
+        const entries = r.entries || [];
+        let week = 0;
+        let today = 0;
+        let last = null;
+        for (const e of entries) {
+            const at = e.meta?.createdAt;
+            const t = at ? Date.parse(at) : NaN;
+            if (!Number.isFinite(t)) continue;
+            if (now - t <= 7 * DAY_MS) week++;
+            if (now - t <= DAY_MS) today++;
+            if (!last || at > last) last = at;
+        }
+        return {total: r.total ?? entries.length, week, today, last};
+    } catch {
+        return {total: 0, week: 0, today: 0, last: null};
+    }
+}
+
+/**
+ * The sidebar badge on Forms (its countUrl, GET /api/forms/_count): the
+ * submissions that came in over the last 7 days, with the forms they came
+ * through. There is no "read" state for a submission, so recent is the
+ * useful number. Plain text throughout - the popover sets it with textContent.
+ *
+ * @param {{title: string, slug: string, stats: {total, week, today, last}}[]} forms
+ * @param {number} [now]
+ */
+/**
+ * Each form's submission stats, kept a minute: the sidebar asks for the Forms
+ * badge every minute from every open admin tab, and stats read every
+ * submission. Per form, not per user - who may see which form is still
+ * decided on each request.
+ */
+const statsCache = new Map();
+async function cachedStats(form, now) {
+    const hit = statsCache.get(form.slug);
+    if (hit && now - hit.at < 60_000) return hit.value;
+    const value = await submissionStats(form, now);
+    statsCache.set(form.slug, {at: now, value});
+    return value;
+}
+
+export function formsBadge(forms = [], now = Date.now()) {
+    const week = forms.reduce((n, f) => n + (f.stats?.week || 0), 0);
+    const today = forms.reduce((n, f) => n + (f.stats?.today || 0), 0);
+    const total = forms.reduce((n, f) => n + (f.stats?.total || 0), 0);
+    const busy = forms.filter(f => f.stats?.week > 0)
+        .sort((a, b) => String(b.stats.last).localeCompare(String(a.stats.last)));
+    return {
+        // The number stays what the sidebar has always shown on Forms (how many); submissions are the label.
+        count: forms.length,
+        label: `${plural(forms.length, 'form')}${week ? `, ${plural(week, 'submission')} this week` : ', no submissions this week'}`,
+        tone: 'info',
+        details: {
+            title: 'Forms',
+            rows: [
+                {label: 'Last 24 hours', value: String(today)},
+                {label: 'Last 7 days', value: String(week)},
+                {label: 'All time', value: String(total)},
+                {label: 'Forms', value: String(forms.length)}
+            ],
+            items: busy.slice(0, 6).map(f => ({
+                text: clip(f.title || f.slug),
+                meta: `${f.stats.week} this week · last ${ago(f.stats.last, now)}`
+            })),
+            empty: 'No submissions in the last 7 days.'
+        }
+    };
+}
+
 export async function formsRoutes(fastify) {
     await ensureFormsDir();
 
@@ -242,26 +341,40 @@ export async function formsRoutes(fastify) {
     fastify.get('/forms', canRead, async (request) => {
         const {canSeeArtefact} = await import('../../services/projects.js');
         const forms = await listForms();
+        const now = Date.now();
         const result = await Promise.all(forms.map(async form => {
-            let submissionCount = 0;
-            try {
-                // listEntries returns { entries, total, page, limit } - total is the
-                // unpaginated count which is what we want for the badge here.
-                const r = await listEntries(form.slug, { limit: 0 });
-                submissionCount = r.total ?? (r.entries || []).length;
-            } catch {
-                // collection may not exist yet
-            }
+            // Counted where the submissions screen reads them (submissionsCollectionFor).
+            const stats = await submissionStats(form, now);
             // listForms returns metadata only; readForm returns full record with meta
             let full = null;
             try { full = await readForm(form.slug); } catch { /* skip */ }
-            return { form: { ...form, submissionCount }, full };
+            return {
+                form: {...form, submissionCount: stats.total, submissionsThisWeek: stats.week, lastSubmissionAt: stats.last},
+                full
+            };
         }));
         return result
             .filter(({ full }) => canSeeArtefact(request.user, full))
             .map(({ form }) => form);
     });
 
+    // -----------------------------------------------------------------------
+    // GET /forms/_count - the sidebar badge (formsBadge). `_` is outside the
+    // slug alphabet (slugify), so no form can shadow it.
+    // -----------------------------------------------------------------------
+    fastify.get('/forms/_count', canRead, async (request) => {
+        const {canSeeArtefact} = await import('../../services/projects.js');
+        const now = Date.now();
+        const forms = await listForms();
+        const seen = await Promise.all(forms.map(async (form) => {
+            let full = null;
+            try { full = await readForm(form.slug); } catch { /* skip */ }
+            if (!canSeeArtefact(request.user, full)) return null;
+            return {title: form.title, slug: form.slug, stats: await cachedStats(form, now)};
+        }));
+        return formsBadge(seen.filter(Boolean), now);
+    });
+
     // -----------------------------------------------------------------------
     // POST /forms - create new form
     // -----------------------------------------------------------------------

package/server/routes/api/media.js

@@ -1,6 +1,7 @@
 /**
  * Media API
  * GET    /api/media       - list media files
+ * GET    /api/media/_count - the sidebar badge (plain text; see mediaBadge)
  * POST   /api/media       - upload a file
  * DELETE /api/media/:name - delete a file
  */
@@ -8,6 +9,7 @@ import path from 'path';
 import {deleteMedia, listMedia, renameMedia, saveMedia} from '../../services/content.js';
 import {getImageInfo, isEditableImage, transformImage} from '../../services/images.js';
 import {authenticate, requirePermission} from '../../middleware/auth.js';
+import {ago, clip, plural} from '../../services/sidebarBadges.js';
 
 const ALLOWED_MIME_TYPES = new Set([
   // Images
@@ -30,6 +32,50 @@ function sanitiseFilename(name) {
     return path.basename(name).replace(/[^a-zA-Z0-9._-]/g, '_');
 }
 
+/** 0 B, 812 B, 14.2 KB, 3.1 MB - the badge's sizes. */
+function bytes(n) {
+    const v0 = Number(n) || 0;
+    if (v0 < 1024) return `${v0} B`;
+    const units = ['KB', 'MB', 'GB', 'TB'];
+    let v = v0 / 1024;
+    let i = 0;
+    while (v >= 1024 && i < units.length - 1) { v /= 1024; i++; }
+    return `${v.toFixed(1)} ${units[i]}`;
+}
+
+const IMAGE_RE = /\.(png|jpe?g|gif|webp|svg|avif|ico|bmp|tiff?)$/i;
+
+/**
+ * The badge on Content › Media: how many files, how much space, the newest
+ * few. Informational - nothing on this screen is ever overdue. Every value is
+ * plain text; the sidebar popover sets it with textContent (file names are
+ * whatever was uploaded).
+ *
+ * @param {{name: string, size: number, createdAt: string}[]} files
+ * @param {number} [now]
+ */
+export function mediaBadge(files = [], now = Date.now()) {
+    const total = files.reduce((s, f) => s + (Number(f.size) || 0), 0);
+    const images = files.filter(f => IMAGE_RE.test(f.name)).length;
+    const newest = [...files].sort((a, b) => String(b.createdAt).localeCompare(String(a.createdAt)));
+    return {
+        count: files.length,
+        label: files.length ? `${plural(files.length, 'file')}, ${bytes(total)}` : 'No media yet',
+        tone: 'info',
+        details: {
+            title: 'Media',
+            rows: [
+                {label: 'Files', value: String(files.length)},
+                {label: 'Images', value: String(images)},
+                {label: 'Other files', value: String(files.length - images)},
+                {label: 'Space used', value: bytes(total)}
+            ],
+            items: newest.slice(0, 5).map(f => ({text: clip(f.name, 48), meta: `${bytes(f.size)} · ${ago(f.createdAt, now)}`})),
+            empty: 'Nothing uploaded yet.'
+        }
+    };
+}
+
 export async function mediaRoutes(fastify) {
     const canRead = {preHandler: [authenticate, requirePermission('media', 'read')]};
     const canCreate = {preHandler: [authenticate, requirePermission('media', 'create')]};
@@ -40,6 +86,9 @@ export async function mediaRoutes(fastify) {
         return listMedia();
     });
 
+    // `_count` is not a file route: the only GET under /media/:name is /media/:name/info.
+    fastify.get('/media/_count', canRead, async () => mediaBadge(await listMedia()));
+
     fastify.post('/media', canCreate, async (request, reply) => {
       const results = [];
       for await (const data of request.files()) {
@@ -84,7 +133,13 @@ export async function mediaRoutes(fastify) {
 
     fastify.delete('/media/:name', canDelete, async (request, reply) => {
         const name = sanitiseFilename(request.params.name);
-        await deleteMedia(name);
+        try {
+            await deleteMedia(name);
+        } catch (err) {
+            // Gone already (another tab, another admin) is a 404, not a server error.
+            if (err.code === 'ENOENT') return reply.status(404).send({error: 'File not found'});
+            throw err;
+        }
         return { success: true };
     });
 

package/server/routes/api/menus.js

@@ -2,6 +2,7 @@
  * Menus API
  *
  * GET    /api/menus                  - list (metadata only)
+ * GET    /api/menus/_count           - the sidebar badge (the underscore can never be a slug)
  * GET    /api/menus/:slug            - full menu
  * POST   /api/menus                  - create
  * PUT    /api/menus/:slug            - replace
@@ -21,6 +22,7 @@ import {
     createMenu,
     deleteMenu,
     duplicateMenu,
+    getLocationRegistry,
     getLocations,
     getMenu,
     listMenus,
@@ -28,6 +30,43 @@ import {
 } from '../../services/menus.js';
 import * as cache from '../../services/cache/index.js';
 
+/**
+ * The sidebar badge on Menus (its countUrl): how many menus, which locations
+ * have none, and which menus are in no location. A count to glance at, not a
+ * warning. Plain text throughout - the popover sets it with textContent.
+ *
+ * "Not in a location" is not "unused": a `[menu]` shortcode can show any menu.
+ * The overlay slot is left out of "empty" - it is optional by design.
+ *
+ * @param {{menus: object[], locations: Record<string, string>, registry: object[]}} state
+ * @returns {{count: number, label: string, tone: string, details: object}}
+ */
+export function menusBadge({menus = [], locations = {}, registry = []} = {}) {
+    const mapped = new Set(Object.values(locations || {}).filter(Boolean));
+    const placed = (m) => mapped.has(m.slug) || Boolean(m.binding?.slot);
+    const unplaced = menus.filter(m => !placed(m));
+    const bindable = registry.filter(r => r.slot !== 'overlay');
+    const empty = bindable.filter(r => !locations?.[r.slot]);
+    const n = menus.length;
+    return {
+        count: n,
+        label: `${n} menu${n === 1 ? '' : 's'}${unplaced.length ? `, ${unplaced.length} not in a location` : ''}`,
+        tone: 'info',
+        details: {
+            title: 'Menus',
+            rows: [
+                {label: 'In a location', value: `${n - unplaced.length} of ${n}`},
+                {label: 'Locations filled', value: `${bindable.length - empty.length} of ${bindable.length}`}
+            ],
+            items: [
+                ...empty.map(r => ({text: r.label || r.slot, meta: 'location - no menu'})),
+                ...unplaced.map(m => ({text: m.name || m.slug, meta: `${m.slug} · not in a location`}))
+            ].slice(0, 8),
+            empty: 'Every location has a menu, and every menu is in one.'
+        }
+    };
+}
+
 /**
  * Register the menus routes.
  *
@@ -44,17 +83,25 @@ export async function menusRoutes(fastify, opts = {}) {
     const canUpdate = {preHandler: [authenticate, requirePermission('menus', 'update')]};
     const canDelete = {preHandler: [authenticate, requirePermission('menus', 'delete')]};
 
-    fastify.get('/menus', canRead, async (request) => {
+    /** The menus this user may see - listMenus is metadata only, so each is read for its meta. */
+    async function visibleMenus(user) {
         const {canSeeArtefact} = await import('../../services/projects.js');
-        const all = await listMenus();
         const filtered = [];
-        for (const m of all) {
-            // listMenus returns metadata only; getMenu returns full record with meta
+        for (const m of await listMenus()) {
             const full = await getMenu(m.slug);
-            if (canSeeArtefact(request.user, full)) filtered.push(m);
+            if (canSeeArtefact(user, full)) filtered.push(m);
         }
         return filtered;
-    });
+    }
+
+    fastify.get('/menus', canRead, async (request) => visibleMenus(request.user));
+
+    // Registered before /menus/:slug; `_` is outside the slug alphabet, so no menu can shadow it.
+    fastify.get('/menus/_count', canRead, async (request) => menusBadge({
+        menus: await visibleMenus(request.user),
+        locations: await getLocations(),
+        registry: getLocationRegistry()
+    }));
 
     fastify.get('/menus/:slug', canRead, async (request, reply) => {
         const menu = await getMenu(request.params.slug);

package/server/routes/api/pages.js

@@ -1,6 +1,7 @@
 /**
  * Pages API
  * GET    /api/pages          - list all pages
+ * GET    /api/pages/_count   - the sidebar badge on Pages (drafts)
  * GET    /api/pages/*        - get single page by URL path
  * POST   /api/pages          - create page
  * PUT    /api/pages/*        - update page
@@ -23,6 +24,44 @@ import {
 import {getVersionCount} from '../../services/versions.js';
 import {authenticate, requirePermission} from '../../middleware/auth.js';
 import {getConfig, saveConfig} from '../../config.js';
+import {ago, clip, plural} from '../../services/sidebarBadges.js';
+
+/**
+ * The sidebar badge on Pages (its countUrl): the drafts - unpublished work -
+ * with a popover of what is published, restricted and recently changed, and
+ * the drafts themselves, newest first. No drafts, no badge. Plain text
+ * throughout: the popover sets it with textContent.
+ *
+ * @param {object[]} pages - listPages()
+ * @param {number} [now]
+ */
+export function pagesBadge(pages, now = Date.now()) {
+    const list = pages || [];
+    const drafts = list.filter(p => p.status !== 'published')
+        .sort((a, b) => String(b.updatedAt || '').localeCompare(String(a.updatedAt || '')));
+    const restricted = list.filter(p => p.visibility && p.visibility !== 'public').length;
+    const week = list.filter(p => p.updatedAt && now - new Date(p.updatedAt).getTime() < 7 * 86_400_000).length;
+    return {
+        // The number stays what the sidebar has always shown on Pages (all of them); drafts are the label.
+        count: list.length,
+        label: drafts.length ? `${plural(list.length, 'page')}, ${plural(drafts.length, 'draft')}` : `${plural(list.length, 'page')}, no drafts`,
+        tone: 'info',
+        details: {
+            title: 'Pages',
+            rows: [
+                {label: 'Published', value: String(list.length - drafts.length)},
+                {label: 'Drafts', value: String(drafts.length)},
+                {label: 'Not public', value: String(restricted)},
+                {label: 'Changed this week', value: String(week)}
+            ],
+            items: drafts.slice(0, 6).map(p => ({
+                text: clip(p.title || p.urlPath),
+                meta: [p.urlPath, p.updatedAt ? ago(p.updatedAt, now) : ''].filter(Boolean).join(' · ')
+            })),
+            empty: 'No drafts - everything is published.'
+        }
+    };
+}
 
 export async function pagesRoutes(fastify) {
     const canRead = {preHandler: [authenticate, requirePermission('pages', 'read')]};
@@ -116,6 +155,9 @@ export async function pagesRoutes(fastify) {
         return { tags: [...tagSet].sort() };
     });
 
+    // The sidebar badge. Static, so it is matched before the /pages/* wildcard below.
+    fastify.get('/pages/_count', canRead, async () => pagesBadge(await listPages()));
+
     // List all pages
     fastify.get('/pages', canRead, async (request, reply) => {
         const pages = await listPages();
@@ -133,6 +175,10 @@ export async function pagesRoutes(fastify) {
             tags: p.tags || [],
             project: p.project ?? null,
             resolvedProject: p.resolvedProject ?? null,
+            // The list's "managed by a plugin" chip and delete warning read these;
+            // they were dropped here, so neither ever showed.
+            plugin: p.plugin || null,
+            bundled: p.bundled === true,
             updatedAt: p.updatedAt,
             createdAt: p.createdAt,
             versionCount: counts[i]

package/server/routes/api/theme.js

@@ -10,6 +10,7 @@
  *                            user - everyone's admin needs one)
  * POST /api/theme/compile  - compile a candidate config to CSS without saving,
  *                            so the admin previews exactly what the page gets
+ * GET  /api/theme/count    - the sidebar badge on Theme (themeBadge below)
  *
  * Auth middlewares are injectable so tests can pass no-ops, the same DI pattern
  * as menus.js and context-menus.js.
@@ -32,6 +33,57 @@ import {
     validateThemeConfig
 } from '../../services/themeSettings.js';
 
+/**
+ * The sidebar badge on Content › Theme. It REPLACES the core count the sidebar
+ * shows there (how many element overrides - a registered countUrl wins), so it
+ * keeps that number, and adds two things: a popover saying what is live where,
+ * and a red count when a theme in use no longer exists (a custom theme whose
+ * plugin went away - the page keeps its base, but the look it was given is
+ * gone). Plain text throughout.
+ *
+ * Mirrors themeProblems() in admin/js/lib/theme-settings-arrange.js.
+ *
+ * @param {object} cfg
+ * @param {string[]} builtins - listThemeIds()
+ * @param {string[]} custom   - ids of the custom themes plugins offer now
+ */
+/** Themes Domma knows without the stylesheet declaring them (resolveThemeClasses passes them through). */
+export const DOMMA_OWN_THEMES = ['core-light', 'core-dark'];
+
+export function themeBadge(cfg = {}, builtins = [], custom = []) {
+    // No catalogue (the stylesheet did not load) means nothing can be judged -
+    // the same rule as themeProblems() in admin/js/lib/theme-settings-arrange.js.
+    const known = builtins.length ? new Set([...builtins, ...custom, ...DOMMA_OWN_THEMES]) : null;
+    const auto = cfg.autoTheme?.enabled ? cfg.autoTheme : null;
+    const problems = [];
+    const check = (where, id) => { if (known && id && !known.has(id)) problems.push({where, id}); };
+    if (auto) { check('Day theme', auto.dayTheme); check('Night theme', auto.nightTheme); }
+    else check('Site theme', cfg.theme);
+    check('Admin theme', cfg.adminTheme);
+    const overrides = Array.isArray(cfg.overrides) ? cfg.overrides : [];
+    overrides.forEach((o, i) => check(`Override "${o.label || o.scope || i + 1}"`, o.theme));
+    const on = overrides.filter(o => o.enabled !== false).length;
+    const n = problems.length;
+    const plural = (k, one) => `${k} ${one}${k === 1 ? '' : 's'}`;
+    return {
+        count: n || overrides.length,
+        label: n ? `${plural(n, 'theme')} in use no longer available` : plural(overrides.length, 'element override'),
+        tone: n ? 'danger' : 'info',
+        details: {
+            title: 'Theme',
+            rows: [
+                auto
+                    ? {label: 'Site (day / night)', value: `${auto.dayTheme} / ${auto.nightTheme}`}
+                    : {label: 'Site theme', value: String(cfg.theme || '-')},
+                {label: 'Admin theme', value: String(cfg.adminTheme || '-')},
+                {label: 'Element overrides', value: `${on} on${overrides.length - on ? `, ${overrides.length - on} off` : ''}`}
+            ],
+            items: problems.slice(0, 8).map(p => ({text: `${p.where}: ${p.id}`, meta: 'no longer available - showing its base', tone: 'danger'})),
+            empty: 'Every theme in use is available.'
+        }
+    };
+}
+
 export async function themeRoutes(fastify, opts = {}) {
     const authenticate      = opts.authenticate      || defaultAuthenticate;
     const requirePermission = opts.requirePermission || defaultRequirePermission;
@@ -41,6 +93,9 @@ export async function themeRoutes(fastify, opts = {}) {
 
     fastify.get('/theme', canRead, async () => loadThemeConfig());
 
+    fastify.get('/theme/count', canRead, async () =>
+        themeBadge(await loadThemeConfig(), listThemeIds(), listCustomThemes().map(t => t.id)));
+
     // The editor's theme picker and token picker build themselves from this
     // rather than from a hardcoded list that would drift from the CSS.
     fastify.get('/theme/catalog', canRead, async () => ({