domma-cms 0.54.2 → 0.66.0

package/plugins/blog/admin/views/post-editor.js

@@ -18,7 +18,14 @@ export const postEditorView = {
     templateUrl: '/plugins/blog/admin/templates/post-editor.html',
 
     async onMount($container) {
-        const id = R.current?.params?.id !== 'new' ? R.current?.params?.id : null;
+        // Domma's router hands onMount ONE argument and never the route params,
+        // and `R.current` is a METHOD - `R.current?.params` is undefined on the
+        // function object, so this view opened blank on every edit and Save
+        // created a duplicate. Read the slug off the hash, as every core editor
+        // view does.
+        const routeMatch = location.hash.match(/^#\/plugins\/blog\/posts\/([^?#]+)/);
+        const routeId = routeMatch ? decodeURIComponent(routeMatch[1]) : null;
+        const id = routeId && routeId !== 'new' ? routeId : null;
         const isEdit = Boolean(id);
 
         let post = null;
@@ -40,7 +47,7 @@ export const postEditorView = {
                 post = res.data ?? res;
             } catch {
                 E.toast('Failed to load post.', { type: 'error' });
-                R.navigate('#/plugins/blog');
+                R.navigate('#/plugins/blog/posts');
                 return;
             }
         }
@@ -87,11 +94,11 @@ export const postEditorView = {
                 const img = document.createElement('img');
                 img.src = featuredImageUrl;
                 img.alt = 'Featured image';
-                img.style.cssText = 'max-width:100%;border-radius:.25rem;display:block;margin-bottom:.5rem;';
+                img.className = 'blog-image-preview';
                 imagePreviewEl.appendChild(img);
-                if (clearImageBtn) clearImageBtn.style.display = '';
+                if (clearImageBtn) clearImageBtn.classList.remove('blog-hidden');
             } else {
-                if (clearImageBtn) clearImageBtn.style.display = 'none';
+                if (clearImageBtn) clearImageBtn.classList.add('blog-hidden');
             }
         }
 
@@ -99,14 +106,13 @@ export const postEditorView = {
             while (catsListEl.firstChild) catsListEl.removeChild(catsListEl.firstChild);
             if (categories.length === 0) {
                 const p = document.createElement('p');
-                p.className = 'text-muted small';
+                p.className = 'text-muted text-sm';
                 p.textContent = 'No categories yet.';
                 catsListEl.appendChild(p);
             } else {
                 categories.forEach((cat) => {
                     const label = document.createElement('label');
-                    label.className = 'd-flex align-items-center gap-2 mb-2';
-                    label.style.cursor = 'pointer';
+                    label.className = 'flex items-center gap-2 mb-2 blog-clickable';
 
                     const cb = document.createElement('input');
                     cb.type = 'checkbox';
@@ -175,9 +181,9 @@ export const postEditorView = {
         if (slugAutoEl) {
             slugAutoEl.addEventListener('change', () => {
                 if (!slugAutoEl.checked && isEdit && post?.status === 'published') {
-                    if (slugWarnEl) slugWarnEl.style.display = '';
+                    if (slugWarnEl) slugWarnEl.classList.remove('blog-hidden');
                 } else {
-                    if (slugWarnEl) slugWarnEl.style.display = 'none';
+                    if (slugWarnEl) slugWarnEl.classList.add('blog-hidden');
                 }
                 if (slugAutoEl.checked && postTitleEl && postSlugEl) {
                     postSlugEl.value = slugify(postTitleEl.value);
@@ -189,7 +195,7 @@ export const postEditorView = {
         const seoPanel  = $container.find('#seo-panel').get(0);
         if (seoToggle && seoPanel) {
             seoToggle.addEventListener('click', () => {
-                seoPanel.style.display = seoPanel.style.display === 'none' ? '' : 'none';
+                seoPanel.classList.toggle('blog-hidden');
             });
         }
 
@@ -223,15 +229,16 @@ export const postEditorView = {
 
         const scheduleBtn = $container.find('#btn-schedule').get(0);
         if (scheduleBtn) {
-            scheduleBtn.style.display = '';
+            scheduleBtn.classList.remove('blog-hidden');
             scheduleBtn.addEventListener('click', async () => {
-                if (scheduleEl) scheduleEl.style.display = scheduleEl.style.display === 'none' ? '' : 'none';
-                if (scheduleEl && scheduleEl.style.display !== 'none') return;
+                // First click reveals the picker; the second one schedules.
+                if (scheduleEl) scheduleEl.classList.toggle('blog-hidden');
+                if (scheduleEl && !scheduleEl.classList.contains('blog-hidden')) return;
 
                 const publishedAt = schedAtEl?.value;
                 if (!publishedAt) {
                     E.toast('Please select a scheduled date/time.', { type: 'error' });
-                    if (scheduleEl) scheduleEl.style.display = '';
+                    if (scheduleEl) scheduleEl.classList.remove('blog-hidden');
                     return;
                 }
 
@@ -271,7 +278,7 @@ export const postEditorView = {
             }
 
             const grid = document.createElement('div');
-            grid.style.cssText = 'display:grid;grid-template-columns:repeat(auto-fill, minmax(120px, 1fr));gap:.75rem;padding:.5rem;';
+            grid.className = 'blog-media-grid';
 
             if (!media.length) {
                 const p = document.createElement('p');
@@ -282,14 +289,14 @@ export const postEditorView = {
                 media.forEach((m) => {
                     const tile = document.createElement('button');
                     tile.type = 'button';
-                    tile.style.cssText = 'border:1px solid var(--dm-border,#333);background:transparent;border-radius:.25rem;padding:.25rem;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.25rem;';
+                    tile.className = 'blog-media-tile';
                     const img = document.createElement('img');
                     img.src = m.url;
                     img.alt = m.name;
-                    img.style.cssText = 'width:100%;height:90px;object-fit:cover;border-radius:.15rem;';
+
                     const cap = document.createElement('span');
                     cap.textContent = m.name;
-                    cap.style.cssText = 'font-size:.7rem;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;width:100%;';
+
                     tile.appendChild(img);
                     tile.appendChild(cap);
                     tile.addEventListener('click', () => {
@@ -301,7 +308,19 @@ export const postEditorView = {
                 });
             }
 
-            const slideover = E.slideover({ title: 'Pick Featured Image', size: 'lg', position: 'right', content: grid });
+            // close() only hides the panel and destroy() tears the component down
+            // without detaching its element, so every trip to the media library
+            // used to leave another slideover in the document.
+            const slideover = E.slideover({
+                title: 'Pick Featured Image',
+                size: 'lg',
+                position: 'right',
+                content: grid,
+                onClose: () => setTimeout(() => {
+                    slideover.destroy();
+                    slideover.element?.remove();
+                }, 350)
+            });
             slideover.open();
         }
 

package/plugins/blog/admin/views/settings.js

@@ -37,61 +37,63 @@ export const settingsView = {
         const formEl = $container.find('#settings-form').get(0);
         if (!formEl) return;
 
-        F.create(formEl, {
-            blueprint: [
-                {
-                    key: 'basePath',
-                    label: 'Base path',
-                    type: 'text',
-                    placeholder: '/blog',
-                    value: settings.basePath ?? '/blog',
-                    hint: 'URL prefix for all blog pages (e.g. /blog).'
+        // F.create takes a SCHEMA, initial data and options, and renders with
+        // .renderTo() - it does not take a container. Passing the element as the
+        // first argument made it the schema, so this form rendered nothing at
+        // all. See admin/js/views/plugins.js for the house pattern.
+        const form = F.create(
+            {
+                basePath: {
+                    type: 'string', label: 'Base path', default: '/blog',
+                    // placeholder and hint live under formConfig - Forma reads
+                    // fieldDef.formConfig, and a top-level `placeholder` or
+                    // `help` is silently ignored.
+                    formConfig: {placeholder: '/blog', hint: 'URL prefix for all blog pages (e.g. /blog).'}
                 },
-                {
-                    key: 'postsPerPage',
-                    label: 'Posts per page',
-                    type: 'number',
-                    placeholder: '10',
-                    value: settings.postsPerPage ?? 10,
-                    hint: 'Number of posts shown per listing page.'
+                postsPerPage: {
+                    type: 'number', label: 'Posts per page', default: 10,
+                    formConfig: {placeholder: '10', hint: 'Number of posts shown per listing page.'}
                 },
-                {
-                    key: 'commentsEnabled',
-                    label: 'Enable comments',
-                    type: 'toggle',
-                    value: settings.commentsEnabled ?? true,
-                    hint: 'Allow readers to submit comments on posts.'
+                commentsEnabled: {
+                    type: 'boolean', label: 'Enable comments',
+                    formConfig: {hint: 'Allow readers to submit comments on posts.'}
                 },
-                {
-                    key: 'commentModeration',
-                    label: 'Moderate comments',
-                    type: 'toggle',
-                    value: settings.commentModeration ?? true,
-                    hint: 'Hold new comments for approval before they appear.'
+                commentModeration: {
+                    type: 'boolean', label: 'Moderate comments',
+                    formConfig: {hint: 'Hold new comments for approval before they appear.'}
                 },
-                {
-                    key: 'feedLength',
-                    label: 'RSS feed length',
-                    type: 'number',
-                    placeholder: '20',
-                    value: settings.feedLength ?? 20,
-                    hint: 'Maximum number of items in the RSS/Atom feed.'
-                }
-            ],
-            onSubmit: async (values) => {
-                try {
-                    const res = await H.put(`${BASE}/settings`, {
-                        basePath: values.basePath,
-                        postsPerPage: Number(values.postsPerPage) || 10,
-                        commentsEnabled: Boolean(values.commentsEnabled),
-                        commentModeration: Boolean(values.commentModeration),
-                        feedLength: Number(values.feedLength) || 20
-                    });
-                    if (res.error) throw new Error(res.error);
-                    E.toast('Settings saved.', { type: 'success' });
-                } catch (err) {
-                    E.toast(err?.message ?? 'Failed to save settings.', { type: 'error' });
+                feedLength: {
+                    type: 'number', label: 'RSS feed length', default: 20,
+                    formConfig: {placeholder: '20', hint: 'Maximum number of items in the RSS/Atom feed.'}
                 }
+            },
+            {
+                basePath:          settings.basePath ?? '/blog',
+                postsPerPage:      settings.postsPerPage ?? 10,
+                commentsEnabled:   settings.commentsEnabled ?? true,
+                commentModeration: settings.commentModeration ?? true,
+                feedLength:        settings.feedLength ?? 20
+            },
+            { showSubmitButton: false }
+        );
+        form.renderTo(formEl);
+
+        const saveBtn = $container.find('#btn-save-settings').get(0);
+        saveBtn?.addEventListener('click', async () => {
+            if (!form.validate()) return;
+            const values = form.getData();
+            try {
+                const res = await H.put(`${BASE}/settings`, {
+                    basePath:          values.basePath,
+                    postsPerPage:      Number(values.postsPerPage) || 10,
+                    commentsEnabled:   Boolean(values.commentsEnabled),
+                    commentModeration: Boolean(values.commentModeration),
+                    feedLength:        Number(values.feedLength) || 20
+                });
+                if (res.error) throw new Error(res.error);
+                E.toast('Settings saved.', { type: 'success' });
+            } catch (err) {
+                E.toast(err?.message ?? 'Failed to save settings.', { type: 'error' });
             }
         });
 

package/plugins/blog/collections/categories/schema.json

@@ -1,12 +1,13 @@
 {
-  "name": "blog-categories",
-  "label": "Blog Categories",
   "slug": "blog-categories",
+  "title": "Blog Categories",
+  "description": "Post categories managed by the Blog plugin.",
+  "plugin": "blog",
   "storage": { "adapter": "file" },
   "fields": [
-    { "key": "name",        "label": "Name",        "type": "text",     "required": true },
-    { "key": "slug",        "label": "Slug",        "type": "text",     "required": true },
-    { "key": "description", "label": "Description", "type": "textarea", "required": false },
-    { "key": "parentId",    "label": "Parent",      "type": "text",     "required": false }
+    { "name": "name",        "label": "Name",        "type": "text",     "required": true },
+    { "name": "slug",        "label": "Slug",        "type": "text",     "required": true },
+    { "name": "description", "label": "Description", "type": "textarea", "required": false },
+    { "name": "parentId",    "label": "Parent",      "type": "text",     "required": false }
   ]
 }

package/plugins/blog/collections/comments/schema.json

@@ -1,16 +1,17 @@
 {
-  "name": "blog-comments",
-  "label": "Blog Comments",
   "slug": "blog-comments",
+  "title": "Blog Comments",
+  "description": "Post comments managed by the Blog plugin.",
+  "plugin": "blog",
   "storage": { "adapter": "file" },
   "fields": [
-    { "key": "postId",      "label": "Post",         "type": "text",     "required": true },
-    { "key": "parentId",    "label": "Parent",       "type": "text",     "required": false },
-    { "key": "authorName",  "label": "Author Name",  "type": "text",     "required": true },
-    { "key": "authorEmail", "label": "Author Email", "type": "text",     "required": true },
-    { "key": "authorUrl",   "label": "Author URL",   "type": "text",     "required": false },
-    { "key": "body",        "label": "Body",         "type": "textarea", "required": true },
-    { "key": "status",      "label": "Status",       "type": "select",   "required": true, "options": ["pending", "approved", "rejected", "spam"] },
-    { "key": "createdAt",   "label": "Created At",   "type": "datetime", "required": false }
+    { "name": "postId",      "label": "Post",         "type": "text",     "required": true },
+    { "name": "parentId",    "label": "Parent",       "type": "text",     "required": false },
+    { "name": "authorName",  "label": "Author Name",  "type": "text",     "required": true },
+    { "name": "authorEmail", "label": "Author Email", "type": "text",     "required": true },
+    { "name": "authorUrl",   "label": "Author URL",   "type": "text",     "required": false },
+    { "name": "body",        "label": "Body",         "type": "textarea", "required": true },
+    { "name": "status",      "label": "Status",       "type": "select",   "required": true, "options": ["pending", "approved", "rejected", "spam"] },
+    { "name": "createdAt",   "label": "Created At",   "type": "datetime", "required": false }
   ]
 }

package/plugins/blog/collections/posts/schema.json

@@ -1,19 +1,20 @@
 {
-  "name": "blog-posts",
-  "label": "Blog Posts",
   "slug": "blog-posts",
+  "title": "Blog Posts",
+  "description": "Posts managed by the Blog plugin.",
+  "plugin": "blog",
   "storage": { "adapter": "file" },
   "fields": [
-    { "key": "title",         "label": "Title",          "type": "text",     "required": true },
-    { "key": "slug",          "label": "Slug",           "type": "text",     "required": true },
-    { "key": "excerpt",       "label": "Excerpt",        "type": "textarea", "required": false },
-    { "key": "content",       "label": "Content",        "type": "markdown", "required": false },
-    { "key": "featuredImage", "label": "Featured Image", "type": "text",     "required": false },
-    { "key": "categories",    "label": "Categories",     "type": "array",    "required": false },
-    { "key": "tags",          "label": "Tags",           "type": "array",    "required": false },
-    { "key": "authorId",      "label": "Author",         "type": "text",     "required": true },
-    { "key": "status",        "label": "Status",         "type": "select",   "required": true, "options": ["draft", "scheduled", "published"] },
-    { "key": "publishedAt",   "label": "Published At",   "type": "datetime", "required": false },
-    { "key": "seo",           "label": "SEO",            "type": "object",   "required": false }
+    { "name": "title",         "label": "Title",          "type": "text",     "required": true },
+    { "name": "slug",          "label": "Slug",           "type": "text",     "required": true },
+    { "name": "excerpt",       "label": "Excerpt",        "type": "textarea", "required": false },
+    { "name": "content",       "label": "Content",        "type": "markdown", "required": false },
+    { "name": "featuredImage", "label": "Featured Image", "type": "text",     "required": false },
+    { "name": "categories",    "label": "Categories",     "type": "array",    "required": false },
+    { "name": "tags",          "label": "Tags",           "type": "array",    "required": false },
+    { "name": "authorId",      "label": "Author",         "type": "text",     "required": true },
+    { "name": "status",        "label": "Status",         "type": "select",   "required": true, "options": ["draft", "scheduled", "published"] },
+    { "name": "publishedAt",   "label": "Published At",   "type": "datetime", "required": false },
+    { "name": "seo",           "label": "SEO",            "type": "object",   "required": false }
   ]
 }

package/plugins/blog/plugin.js

@@ -1,6 +1,6 @@
 import defaultConfig from './config.js';
 import {createEntry, deleteEntry, getEntry, listEntries, updateEntry} from '../../server/services/collections.js';
-import {getConfig, saveConfig} from '../../server/config.js';
+import {getPluginStates, savePluginState} from '../../server/services/plugins.js';
 
 const POSTS_SLUG      = 'blog-posts';
 const CATEGORIES_SLUG = 'blog-categories';
@@ -217,12 +217,19 @@ export default async function blogPlugin(fastify, options) {
             categories, tags, status, slug
         } = body;
 
+        // The schema marks title, slug, authorId and status required, so an
+        // empty title reaches createEntry and throws - a 500 where the
+        // categories and comments routes both answer 400. Say so here instead.
+        if (!title || typeof title !== 'string' || !title.trim()) {
+            return reply.code(400).send({ error: 'title is required' });
+        }
+
         const derivedSlug = slug
             ? String(slug).trim()
-            : slugify(title ?? '');
+            : slugify(title);
 
         const entry = await createEntry(POSTS_SLUG, {
-            title:         typeof title === 'string' ? title.trim() : '',
+            title:         title.trim(),
             slug:          derivedSlug,
             content:       typeof content === 'string' ? content : '',
             excerpt:       typeof excerpt === 'string' ? excerpt.trim() : '',
@@ -465,21 +472,37 @@ export default async function blogPlugin(fastify, options) {
     // Settings
     // -------------------------------------------------------------------------
 
+    // Plugin settings live in config/plugins.json under blog.settings, and the
+    // way to reach them is getPluginStates() / savePluginState(). These used to
+    // call getConfig() and saveConfig() from server/config.js, which take a FILE
+    // NAME: getConfig() with no argument read config/undefined.json and threw,
+    // so this endpoint answered 500 every time, and saveConfig(cfg) passed the
+    // whole config object as the name.
+
     /** GET /api/plugins/blog/settings */
     fastify.get('/settings', { preHandler: [authenticate] }, async (request, reply) => {
-        const cfg      = getConfig();
-        const overrides = cfg.plugins?.blog?.settings ?? {};
-        return reply.send({ ...defaultConfig, ...overrides });
+        const stored = getPluginStates()?.blog?.settings ?? {};
+        return reply.send({ ...defaultConfig, ...stored });
     });
 
     /** PUT /api/plugins/blog/settings */
-    fastify.put('/settings', { preHandler: [requireAdmin] }, async (request, reply) => {
+    // requireAdmin reads request.user, which only `authenticate` populates -
+    // on its own it answers 401 to everyone, admin included.
+    fastify.put('/settings', { preHandler: [authenticate, requireAdmin] }, async (request, reply) => {
         const body = request.body ?? {};
-        const cfg  = getConfig();
-        cfg.plugins            ??= {};
-        cfg.plugins.blog       ??= {};
-        cfg.plugins.blog.settings = body;
-        await saveConfig(cfg);
-        return reply.send({ ok: true });
+
+        // Whitelist rather than merge: every key here is read back by the
+        // public routes, and storing whatever was posted invites surprises.
+        const merged = {
+            ...defaultConfig,
+            ...(body.basePath          !== undefined && { basePath: String(body.basePath) }),
+            ...(body.postsPerPage      !== undefined && { postsPerPage: Number(body.postsPerPage) || defaultConfig.postsPerPage }),
+            ...(body.commentsEnabled   !== undefined && { commentsEnabled: Boolean(body.commentsEnabled) }),
+            ...(body.commentModeration !== undefined && { commentModeration: Boolean(body.commentModeration) }),
+            ...(body.feedLength        !== undefined && { feedLength: Number(body.feedLength) || defaultConfig.feedLength })
+        };
+
+        savePluginState('blog', { settings: merged });
+        return reply.send({ ok: true, settings: merged });
     });
 }

package/plugins/blog/plugin.json

@@ -7,6 +7,9 @@
   "date": "2026-04-07",
   "icon": "file-text",
   "admin": {
+    "css": [
+      "admin/css/index.css"
+    ],
     "sidebar": [
       {
         "id": "blog",
@@ -39,6 +42,11 @@
       }
     ],
     "routes": [
+      {
+        "path": "/plugins/blog",
+        "view": "plugin-blog-posts",
+        "title": "Blog - Domma CMS"
+      },
       {
         "path": "/plugins/blog/posts",
         "view": "plugin-blog-posts",
@@ -72,23 +80,23 @@
     ],
     "views": {
       "plugin-blog-posts": {
-        "entry": "blog/admin/views/blog.js?v=da5c1a46",
+        "entry": "blog/admin/views/blog.js?v=01f8b54e",
         "exportName": "blogView"
       },
       "plugin-blog-post-editor": {
-        "entry": "blog/admin/views/post-editor.js?v=d4d7a514",
+        "entry": "blog/admin/views/post-editor.js?v=58c616ec",
         "exportName": "postEditorView"
       },
       "plugin-blog-categories": {
-        "entry": "blog/admin/views/categories.js?v=7e3946ca",
+        "entry": "blog/admin/views/categories.js?v=17f4038c",
         "exportName": "categoriesView"
       },
       "plugin-blog-comments": {
-        "entry": "blog/admin/views/comments.js?v=ee2146e9",
+        "entry": "blog/admin/views/comments.js?v=55dd8ad9",
         "exportName": "commentsView"
       },
       "plugin-blog-settings": {
-        "entry": "blog/admin/views/settings.js?v=3fab4235",
+        "entry": "blog/admin/views/settings.js?v=bd2310f3",
         "exportName": "settingsView"
       }
     }