domma-cms 0.3.0 → 0.5.0

package/server/services/views.js

@@ -0,0 +1,280 @@
+/**
+ * Views Service (Pro — requires MongoDB)
+ *
+ * View configs are stored in MongoDB `cms__views` on the 'default' connection.
+ * The `connection` field in each view config specifies which connection to use
+ * when executing the aggregation pipeline.
+ *
+ * Allowed aggregation stage types (Phase 1):
+ *   $match, $lookup, $sort, $project, $unwind, $limit, $skip, $count,
+ *   $addFields, $group
+ *
+ * Forbidden stage types:
+ *   $out, $merge, $function, $accumulator, $graphLookup
+ */
+import {v4 as uuidv4} from 'uuid';
+import {buildRowLevelMatch} from './rowAccess.js';
+
+/** MongoDB collection where view configs are stored. */
+const VIEWS_COLLECTION = 'cms__views';
+
+/** Prefix applied to CMS data collections — mirrors MongoAdapter.PREFIX. */
+const COLLECTION_PREFIX = 'cms_';
+
+const ALLOWED_STAGES = new Set([
+    '$match', '$lookup', '$sort', '$project',
+    '$unwind', '$limit', '$skip', '$count',
+    '$addFields', '$group'
+]);
+
+const FORBIDDEN_STAGES = new Set([
+    '$out', '$merge', '$function', '$accumulator', '$graphLookup'
+]);
+
+// ---------------------------------------------------------------------------
+// Internal helpers
+// ---------------------------------------------------------------------------
+
+/**
+ * Get the Db instance for storing/reading view configs ('default' connection).
+ *
+ * @returns {Promise<import('mongodb').Db>}
+ * @throws {Error} If MongoDB is not configured
+ */
+async function getMetaDb() {
+    try {
+        const { getDb } = await import('./connectionManager.js');
+        return getDb('default');
+    } catch {
+        throw new Error('Views require a MongoDB connection. Configure a "default" connection in pro mode.');
+    }
+}
+
+/**
+ * Slugify a string to a URL-safe identifier.
+ *
+ * @param {string} str
+ * @returns {string}
+ */
+function slugify(str) {
+    return str.toLowerCase().replace(/[^a-z0-9]+/g, '-').replace(/^-|-$/g, '');
+}
+
+/**
+ * Validate that all pipeline stages use allowed types.
+ *
+ * @param {object[]} stages
+ * @throws {Error} If a stage type is forbidden or not in the allowlist
+ */
+function validateStages(stages) {
+    for (const stage of stages) {
+        if (!stage.type) throw new Error('Pipeline stage missing "type"');
+        if (FORBIDDEN_STAGES.has(stage.type)) {
+            throw new Error(`Stage type "${stage.type}" is not permitted for security reasons`);
+        }
+        if (!ALLOWED_STAGES.has(stage.type)) {
+            throw new Error(`Stage type "${stage.type}" is not in the allowed list`);
+        }
+    }
+}
+
+/**
+ * Convert stage descriptors into MongoDB aggregation stage objects.
+ *
+ * @param {object[]} stages
+ * @returns {object[]}
+ */
+function buildPipelineStages(stages) {
+    return stages.map(stage => ({ [stage.type]: stage.config }));
+}
+
+// ---------------------------------------------------------------------------
+// CRUD
+// ---------------------------------------------------------------------------
+
+/**
+ * List all view configs.
+ *
+ * @returns {Promise<object[]>}
+ * @throws {Error} If MongoDB is not available
+ */
+export async function listViews() {
+    const db = await getMetaDb();
+    return db.collection(VIEWS_COLLECTION)
+        .find({}, { projection: { _id: 0 } })
+        .sort({ 'meta.createdAt': -1 })
+        .toArray();
+}
+
+/**
+ * Get a single view config by slug.
+ *
+ * @param {string} slug
+ * @returns {Promise<object|null>}
+ * @throws {Error} If MongoDB is not available
+ */
+export async function getView(slug) {
+    const db = await getMetaDb();
+    const doc = await db.collection(VIEWS_COLLECTION).findOne({ slug }, { projection: { _id: 0 } });
+    return doc || null;
+}
+
+/**
+ * Create a new view config.
+ *
+ * @param {object} data
+ * @param {string}   data.title
+ * @param {string}   [data.slug]
+ * @param {string}   [data.description]
+ * @param {string}   [data.connection='default']
+ * @param {object}   data.pipeline   - { source: string, stages: object[] }
+ * @param {object}   [data.display]  - { mode, columns, pageSize }
+ * @param {object}   [data.access]   - { roles, public }
+ * @param {string|null} [userId]
+ * @returns {Promise<object>} Created view config
+ * @throws {Error} If slug already exists or validation fails
+ */
+export async function createView(data, userId = null) {
+    const db = await getMetaDb();
+    const { title, description = '', connection = 'default', pipeline, display, access } = data;
+
+    if (!title) throw new Error('title is required');
+    if (!pipeline?.source) throw new Error('pipeline.source is required');
+
+    const slug = data.slug ? slugify(data.slug) : slugify(title);
+    if (!slug) throw new Error('Could not derive a slug from the title');
+
+    const existing = await db.collection(VIEWS_COLLECTION).findOne({ slug });
+    if (existing) throw new Error(`A view with slug "${slug}" already exists`);
+
+    const stages = pipeline.stages || [];
+    validateStages(stages);
+
+    const now = new Date().toISOString();
+    const view = {
+        id:          uuidv4(),
+        slug,
+        title:       title.trim(),
+        description: description.trim(),
+        connection,
+        pipeline:    { source: pipeline.source, stages },
+        display:     {
+            mode:     display?.mode     || 'table',
+            columns:  display?.columns  || [],
+            pageSize: display?.pageSize || 25,
+            block: display?.block || ''
+        },
+        access: {
+            roles: access?.roles || ['admin'],
+            public: access?.public || false,
+            rowLevel: access?.rowLevel || null
+        },
+        meta: { createdAt: now, updatedAt: now, createdBy: userId }
+    };
+
+    await db.collection(VIEWS_COLLECTION).insertOne({ ...view });
+    return view;
+}
+
+/**
+ * Update an existing view config.
+ *
+ * @param {string} slug
+ * @param {object} data - Partial view fields to merge
+ * @returns {Promise<object>} Updated view config
+ * @throws {Error} If view not found or validation fails
+ */
+export async function updateView(slug, data) {
+    const db = await getMetaDb();
+    const existing = await db.collection(VIEWS_COLLECTION).findOne({ slug });
+    if (!existing) throw new Error(`View "${slug}" not found`);
+
+    const stages = data.pipeline?.stages ?? existing.pipeline?.stages ?? [];
+    validateStages(stages);
+
+    const { _id, id, meta, ...rest } = data;
+    const updated = {
+        ...existing,
+        ...rest,
+        slug,
+        pipeline: {
+            ...existing.pipeline,
+            ...data.pipeline,
+            stages
+        },
+        meta: { ...existing.meta, updatedAt: new Date().toISOString() }
+    };
+
+    await db.collection(VIEWS_COLLECTION).replaceOne({ slug }, { ...updated });
+    const { _id: _stripped, ...result } = updated;
+    return result;
+}
+
+/**
+ * Delete a view config.
+ *
+ * @param {string} slug
+ * @returns {Promise<void>}
+ * @throws {Error} If view not found
+ */
+export async function deleteView(slug) {
+    const db = await getMetaDb();
+    const result = await db.collection(VIEWS_COLLECTION).deleteOne({ slug });
+    if (result.deletedCount === 0) throw new Error(`View "${slug}" not found`);
+}
+
+// ---------------------------------------------------------------------------
+// Execution
+// ---------------------------------------------------------------------------
+
+/**
+ * Execute a view's aggregation pipeline and return paginated results.
+ *
+ * @param {string} slug
+ * @param {object} [opts]
+ * @param {number}  [opts.page=1]
+ * @param {number}  [opts.limit=25]
+ * @param {object|null} [opts.user=null] - Authenticated user (for row-level filtering)
+ * @returns {Promise<{ results: object[], total: number, page: number, limit: number }>}
+ * @throws {Error} If view not found, connection unavailable, or stage validation fails
+ */
+export async function executeView(slug, {page = 1, limit = 25, user = null} = {}) {
+    const view = await getView(slug);
+    if (!view) throw new Error(`View "${slug}" not found`);
+
+    const { getDb } = await import('./connectionManager.js');
+    const db = getDb(view.connection || 'default');
+
+    const sourceCollection = `${COLLECTION_PREFIX}${view.pipeline.source}`;
+    const stages = view.pipeline?.stages || [];
+    validateStages(stages);
+
+    const pipeline = buildPipelineStages(stages);
+
+    // Prepend row-level $match if configured
+    const rowFilter = buildRowLevelMatch(user, view.access?.rowLevel);
+    if (rowFilter) {
+        pipeline.unshift({$match: rowFilter});
+    }
+
+    // Count total without pagination
+    const countPipeline = [...pipeline, { $count: 'total' }];
+    const countResult = await db.collection(sourceCollection)
+        .aggregate(countPipeline)
+        .toArray();
+    const total = countResult[0]?.total ?? 0;
+
+    // Add pagination stages
+    const offset = (page - 1) * limit;
+    pipeline.push({ $skip: offset });
+    pipeline.push({ $limit: limit });
+
+    const docs = await db.collection(sourceCollection)
+        .aggregate(pipeline, { allowDiskUse: true })
+        .toArray();
+
+    // Strip MongoDB internal _id from all results
+    const results = docs.map(({ _id, ...rest }) => rest);
+
+    return { results, total, page, limit };
+}

package/server/templates/page.html

@@ -1,113 +1,119 @@
-<!DOCTYPE html>
-<html lang="en-GB">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>{{seoTitle}}</title>
-    <meta name="description" content="{{seoDescription}}">
-    {{#if ogImage}}<meta property="og:image" content="{{ogImage}}">{{/if}}
-
-    <!-- Fonts -->
-  {{#if fontLink}}{{fontLink}}{{/if}}
-
-    <!-- DommaJS CSS -->
-    <link rel="stylesheet" href="/dist/domma/domma.css">
-    <link rel="stylesheet" href="/dist/domma/grid.css">
-    <link rel="stylesheet" href="/dist/domma/elements.css">
-    <link rel="stylesheet" href="/dist/domma/themes/domma-themes.css">
-
-    <!-- Site CSS -->
-    <link rel="stylesheet" href="/public/css/site.css">
-
-  <!-- Font overrides -->
-  {{fontStyleTag}}
-
-    <!-- Plugin head injection -->
-    {{headInject}}
-
-  <!-- Late head injection — custom CSS always loads last so it can override everything -->
-  {{headInjectLate}}
-</head>
-<body class="dm-cloaked dm-theme-{{theme}}" data-layout="{{layout}}">
-
-    {{#if showNavbar}}
-    <nav id="site-navbar"></nav>
-    {{/if}}
-
-    <main class="site-main {{#if showSidebar}}with-sidebar{{/if}}">
-        {{#if showSidebar}}
-        <aside id="site-sidebar" class="site-sidebar"></aside>
-        {{/if}}
-
-        <article class="site-content">
-            <div class="container">
-                <div class="page-body">
-                    {{html}}
-                </div>
-            </div>
-        </article>
-    </main>
-
-    {{#if showFooter}}
-    <footer id="site-footer" class="page-footer"></footer>
-    {{/if}}
-
-    <!-- DOMPurify - must load before DommaJS -->
-    <script src="https://cdn.jsdelivr.net/npm/dompurify@3/dist/purify.min.js"></script>
-
-    <!-- DommaJS -->
-    <script src="/dist/domma/domma.min.js"></script>
-
-    <!-- Initialise DommaJS before module loads -->
-    <script>
-      (function () {
-        var _stored;
-        try {
-          _stored = JSON.parse(localStorage.getItem('domma:reduced_motion'));
-        } catch (e) {
-        }
-        if (_stored === true) {
-          document.documentElement.classList.add('dm-reduced-motion');
-        }
-        // Override window.matchMedia so Domma JS effects (scribe, breathe, etc.)
-        // respect the stored preference. When explicitly set to false the user is
-        // overriding the OS "reduce" preference to allow motion on this site.
-        if (_stored !== null && _stored !== undefined && window.matchMedia) {
-          var _orig = window.matchMedia.bind(window);
-          window.matchMedia = function (q) {
-            if (q === '(prefers-reduced-motion: reduce)') {
-              return {
-                matches: !!_stored, media: q, onchange: null,
-                addListener: function () {
-                }, removeListener: function () {
-                },
-                addEventListener: function () {
-                }, removeEventListener: function () {
-                },
-                dispatchEvent: function () {
-                  return false;
-                }
-              };
-            }
-            return _orig(q);
-          };
-        }
-      }());
-        if (window.Domma && typeof window.Domma.init === 'function') {
-            window.Domma.init();
-        }
-        if (window.Domma && window.Domma.theme) {
-            window.Domma.theme.init({ theme: '{{theme}}', persist: false });
-        }
-        window.__CMS_NAV__ = {{navJson}};
-        window.__CMS_SITE__ = {{siteJson}};
-      {{dconfigScript}}
-    </script>
-
-    <!-- Site initialisation -->
-    <script src="/public/js/site.js" type="module"></script>
-
-    <!-- Plugin body-end injection -->
-    {{bodyEndInject}}
-</body>
-</html>
+<!DOCTYPE html>
+<html lang="en-GB">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{{seoTitle}}</title>
+    <meta name="description" content="{{seoDescription}}">
+    {{#if ogImage}}<meta property="og:image" content="{{ogImage}}">{{/if}}
+
+    <!-- Fonts -->
+  {{#if fontLink}}{{fontLink}}{{/if}}
+
+    <!-- DommaJS CSS -->
+    <link rel="stylesheet" href="/dist/domma/domma.css">
+    <link rel="stylesheet" href="/dist/domma/grid.css">
+    <link rel="stylesheet" href="/dist/domma/elements.css">
+    <link rel="stylesheet" href="/dist/domma/themes/domma-themes.css">
+
+    <!-- Site CSS -->
+    <link rel="stylesheet" href="/public/css/site.css">
+    <link rel="stylesheet" href="/public/css/forms.css">
+
+  <!-- Font overrides -->
+  {{fontStyleTag}}
+
+    <!-- Plugin head injection -->
+    {{headInject}}
+
+  <!-- Late head injection — custom CSS always loads last so it can override everything -->
+  {{headInjectLate}}
+</head>
+<body class="dm-cloaked dm-theme-{{theme}}" data-layout="{{layout}}">
+
+    {{#if showNavbar}}
+    <nav id="site-navbar"></nav>
+    {{/if}}
+
+    <main class="site-main {{#if showSidebar}}with-sidebar{{/if}}">
+        {{#if showSidebar}}
+        <aside id="site-sidebar" class="site-sidebar"></aside>
+        {{/if}}
+
+        <article class="site-content">
+            <div class="container">
+                {{breadcrumbsHtml}}
+                <div class="page-body">
+                    {{html}}
+                </div>
+            </div>
+        </article>
+    </main>
+
+    {{#if showFooter}}
+    <footer id="site-footer" class="page-footer"></footer>
+    {{/if}}
+
+    <!-- DOMPurify - must load before DommaJS -->
+    <script src="https://cdn.jsdelivr.net/npm/dompurify@3/dist/purify.min.js"></script>
+
+    <!-- DommaJS -->
+    <script src="/dist/domma/domma.min.js"></script>
+
+    <!-- Initialise DommaJS before module loads -->
+    <script>
+      (function () {
+        var _stored;
+        try {
+          _stored = JSON.parse(localStorage.getItem('domma:reduced_motion'));
+        } catch (e) {
+        }
+        if (_stored === true) {
+          document.documentElement.classList.add('dm-reduced-motion');
+        }
+        // Override window.matchMedia so Domma JS effects (scribe, breathe, etc.)
+        // respect the stored preference. When explicitly set to false the user is
+        // overriding the OS "reduce" preference to allow motion on this site.
+        if (_stored !== null && _stored !== undefined && window.matchMedia) {
+          var _orig = window.matchMedia.bind(window);
+          window.matchMedia = function (q) {
+            if (q === '(prefers-reduced-motion: reduce)') {
+              return {
+                matches: !!_stored, media: q, onchange: null,
+                addListener: function () {
+                }, removeListener: function () {
+                },
+                addEventListener: function () {
+                }, removeEventListener: function () {
+                },
+                dispatchEvent: function () {
+                  return false;
+                }
+              };
+            }
+            return _orig(q);
+          };
+        }
+      }());
+        if (window.Domma && typeof window.Domma.init === 'function') {
+            window.Domma.init();
+        }
+        if (window.Domma && window.Domma.theme) {
+            window.Domma.theme.init({ theme: '{{theme}}', persist: false });
+        }
+        window.__CMS_NAV__ = {{navJson}};
+        window.__CMS_SITE__ = {{siteJson}};
+      {{dconfigScript}}
+    </script>
+
+    <!-- Site initialisation -->
+    <script src="/public/js/site.js" type="module"></script>
+
+    <!-- Core Forms (logic engine must load before renderer) -->
+    <script src="/public/js/form-logic-engine.js"></script>
+    <script src="/public/js/forms.js" type="module"></script>
+
+    <!-- Plugin body-end injection -->
+    {{bodyEndInject}}
+</body>
+</html>

package/plugins/form-builder/admin/templates/form-settings.html

@@ -1,29 +0,0 @@
-<div class="view-header">
-    <h1><span data-icon="settings"></span> Form Builder Settings</h1>
-    <div style="display:flex;gap:.5rem;">
-        <a href="#/plugins/form-builder" class="btn btn-ghost btn-sm">
-            <span data-icon="layout"></span> All Forms
-        </a>
-    </div>
-</div>
-
-<div class="card mb-4">
-    <div class="card-body" style="display:flex;align-items:center;gap:1rem;">
-        <span data-icon="info" style="flex-shrink:0;"></span>
-        <div>
-            <p style="margin:0 0 .25rem;">SMTP and email identity settings have moved to <a href="#/settings" class="link">Site Settings</a>.</p>
-            <p class="text-muted" style="margin:0;font-size:.85rem;">Configure your mail server there, then use the button below to verify the connection.</p>
-        </div>
-    </div>
-</div>
-
-<div class="card">
-    <div class="card-header"><h2>Test Email</h2></div>
-    <div class="card-body">
-        <p class="text-muted" style="margin:0 0 1rem;font-size:.9rem;">Send a test email using the SMTP settings configured in Site Settings to verify your mail server connection.</p>
-        <button id="test-email-btn" class="btn btn-primary">
-            <span data-icon="send"></span> Send Test Email
-        </button>
-        <p id="test-email-result" class="form-hint" style="margin-top:.75rem;display:none;"></p>
-    </div>
-</div>