domma-cms 0.14.10 → 0.16.0

package/plugins/blog/plugin.json

@@ -1,7 +1,7 @@
 {
   "name": "blog",
   "displayName": "Blog",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "Public-facing blog with posts, categories, and comments.",
   "author": "Domma CMS",
   "date": "2026-04-07",
@@ -72,11 +72,11 @@
     ],
     "views": {
       "plugin-blog-posts": {
-        "entry": "blog/admin/views/blog.js?v=73a4a936",
+        "entry": "blog/admin/views/blog.js?v=2722ac2e",
         "exportName": "blogView"
       },
       "plugin-blog-post-editor": {
-        "entry": "blog/admin/views/post-editor.js?v=3288949c",
+        "entry": "blog/admin/views/post-editor.js?v=d3f2c327",
         "exportName": "postEditorView"
       },
       "plugin-blog-categories": {

package/plugins/blog/templates/post.html

@@ -1,10 +1,11 @@
 <main class="container" style="padding: 2rem 0;">
-  <article>
+  <article class="blog-post">
     <header class="mb-4">
       <h1>{{title}}</h1>
       <p class="text-muted">by {{authorName}} &bull; <time>{{publishedAt}}</time></p>
       <div class="mb-2">{{categories}}{{tags}}</div>
     </header>
+    {{featuredImage}}
     <div class="post-content mb-5">
       {{content}}
     </div>

package/plugins/invoice/admin/templates/editor.html

@@ -0,0 +1,129 @@
+<div class="view-header d-flex align-items-center justify-content-between mb-4">
+  <h1 class="h3 mb-0" id="editor-title">New Invoice</h1>
+  <div class="d-flex gap-2">
+    <a id="btn-print" class="btn btn-secondary" href="#" target="_blank" style="display:none;">
+      <span data-icon="printer"></span> Print / PDF
+    </a>
+    <button id="btn-save" class="btn btn-primary">
+      <span data-icon="save"></span> Save
+    </button>
+  </div>
+</div>
+
+<div class="d-flex gap-4" style="align-items:flex-start;">
+
+  <div style="flex:1; min-width:0;">
+
+    <div class="card mb-3">
+      <div class="card-body">
+        <div class="grid grid-cols-2 gap-3">
+          <div>
+            <label class="form-label">Invoice Number</label>
+            <input id="f-number" type="text" class="form-control font-monospace" placeholder="auto-generated">
+            <div class="text-muted small">Leave blank to auto-number</div>
+          </div>
+          <div>
+            <label class="form-label">Status</label>
+            <select id="f-status" class="form-select">
+              <option value="draft">Draft</option>
+              <option value="sent">Sent</option>
+              <option value="paid">Paid</option>
+              <option value="overdue">Overdue</option>
+              <option value="cancelled">Cancelled</option>
+            </select>
+          </div>
+          <div>
+            <label class="form-label">Issue Date</label>
+            <input id="f-issue-date" type="date" class="form-control">
+          </div>
+          <div>
+            <label class="form-label">Due Date</label>
+            <input id="f-due-date" type="date" class="form-control">
+          </div>
+          <div>
+            <label class="form-label">Issuer</label>
+            <select id="f-issuer" class="form-select"></select>
+          </div>
+          <div>
+            <label class="form-label">Receiver</label>
+            <select id="f-receiver" class="form-select"></select>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="card mb-3">
+      <div class="card-header d-flex justify-content-between align-items-center">
+        <strong>Line Items</strong>
+        <button id="btn-add-line" type="button" class="btn btn-sm btn-outline">
+          <span data-icon="plus"></span> Add Line
+        </button>
+      </div>
+      <div class="card-body">
+        <table class="table mb-0" id="line-items-table">
+          <thead>
+            <tr>
+              <th style="width:55%;">Description</th>
+              <th style="width:10%;">Qty</th>
+              <th style="width:15%;">Unit (net)</th>
+              <th style="width:15%; text-align:right;">Total</th>
+              <th style="width:5%;"></th>
+            </tr>
+          </thead>
+          <tbody id="line-items-body"></tbody>
+        </table>
+      </div>
+    </div>
+
+    <div class="card mb-3">
+      <div class="card-header"><strong>Notes</strong></div>
+      <div class="card-body">
+        <textarea id="f-notes" class="form-control" rows="3" placeholder="Optional notes printed on the invoice"></textarea>
+      </div>
+    </div>
+  </div>
+
+  <div style="width:300px; flex-shrink:0;">
+
+    <div class="card mb-3">
+      <div class="card-header"><strong>Totals</strong></div>
+      <div class="card-body">
+        <div class="d-flex justify-content-between mb-2">
+          <span class="text-muted">Subtotal</span>
+          <span id="t-subtotal" style="font-variant-numeric:tabular-nums;">—</span>
+        </div>
+        <div class="d-flex justify-content-between mb-2" id="vat-row">
+          <span class="text-muted">VAT (<span id="t-vat-rate">20</span>%)</span>
+          <span id="t-vat" style="font-variant-numeric:tabular-nums;">—</span>
+        </div>
+        <hr>
+        <div class="d-flex justify-content-between">
+          <strong>Total</strong>
+          <strong id="t-total" style="font-variant-numeric:tabular-nums;">—</strong>
+        </div>
+      </div>
+    </div>
+
+    <div class="card mb-3">
+      <div class="card-header"><strong>VAT</strong></div>
+      <div class="card-body">
+        <label class="d-flex align-items-center gap-2 mb-2" style="cursor:pointer;">
+          <input id="f-vat-enabled" type="checkbox" checked> Apply VAT
+        </label>
+        <label class="form-label">Rate %</label>
+        <input id="f-vat-rate" type="number" min="0" max="100" step="0.01" class="form-control" value="20">
+      </div>
+    </div>
+
+    <div class="card mb-3">
+      <div class="card-header"><strong>Currency</strong></div>
+      <div class="card-body">
+        <select id="f-currency" class="form-select">
+          <option value="GBP">GBP — British Pound</option>
+          <option value="EUR">EUR — Euro</option>
+          <option value="USD">USD — US Dollar</option>
+        </select>
+      </div>
+    </div>
+  </div>
+</div>

package/plugins/invoice/admin/templates/index.html

@@ -0,0 +1,43 @@
+<div class="view-header d-flex align-items-center justify-content-between mb-4">
+  <h1 class="h3 mb-0"><span data-icon="file-text"></span> Invoices</h1>
+  <button id="btn-new-invoice" class="btn btn-primary">
+    <span data-icon="plus"></span> New Invoice
+  </button>
+</div>
+
+<div class="grid grid-cols-4 gap-3 mb-4">
+  <div class="card"><div class="card-body">
+    <div class="text-muted small">Total invoices</div>
+    <div class="h3 mb-0" id="kpi-total">—</div>
+  </div></div>
+  <div class="card"><div class="card-body">
+    <div class="text-muted small">Outstanding</div>
+    <div class="h3 mb-0" id="kpi-outstanding">—</div>
+  </div></div>
+  <div class="card"><div class="card-body">
+    <div class="text-muted small">Paid</div>
+    <div class="h3 mb-0" id="kpi-paid">—</div>
+  </div></div>
+  <div class="card"><div class="card-body">
+    <div class="text-muted small">Drafts</div>
+    <div class="h3 mb-0" id="kpi-drafts">—</div>
+  </div></div>
+</div>
+
+<div class="card mb-3">
+  <div class="card-body">
+    <div class="d-flex gap-2 flex-wrap">
+      <select id="filter-status" class="form-select" style="width:auto;">
+        <option value="">All statuses</option>
+        <option value="draft">Draft</option>
+        <option value="sent">Sent</option>
+        <option value="paid">Paid</option>
+        <option value="overdue">Overdue</option>
+        <option value="cancelled">Cancelled</option>
+      </select>
+      <input id="filter-search" type="search" class="form-control" style="width:240px;" placeholder="Search number or receiver…">
+    </div>
+  </div>
+</div>
+
+<div id="invoices-table"></div>

package/plugins/invoice/admin/templates/issuers.html

@@ -0,0 +1,5 @@
+<div class="view-header d-flex align-items-center justify-content-between mb-4">
+  <h1 class="h3 mb-0"><span data-icon="briefcase"></span> Issuers</h1>
+  <button id="btn-new" class="btn btn-primary"><span data-icon="plus"></span> New Issuer</button>
+</div>
+<div id="party-table"></div>

package/plugins/invoice/admin/templates/receivers.html

@@ -0,0 +1,5 @@
+<div class="view-header d-flex align-items-center justify-content-between mb-4">
+  <h1 class="h3 mb-0"><span data-icon="users"></span> Receivers</h1>
+  <button id="btn-new" class="btn btn-primary"><span data-icon="plus"></span> New Receiver</button>
+</div>
+<div id="party-table"></div>

package/plugins/invoice/admin/views/editor.js

@@ -0,0 +1,267 @@
+/**
+ * Invoice plugin — editor view. Create or edit a single invoice.
+ */
+function escapeHtml(s) {
+    return String(s ?? '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;');
+}
+
+function fmt(amount, currency) {
+    try {
+        return new Intl.NumberFormat('en-GB', { style: 'currency', currency: currency || 'GBP' }).format(Number(amount) || 0);
+    } catch {
+        return `${currency || 'GBP'} ${Number(amount).toFixed(2)}`;
+    }
+}
+
+function round2(n) {
+    return Math.round((Number(n) + Number.EPSILON) * 100) / 100;
+}
+
+const BASE = '/api/plugins/invoice';
+
+export const editorView = {
+    templateUrl: '/plugins/invoice/admin/templates/editor.html',
+
+    async onMount($container) {
+        const id = R.current?.params?.id ?? null;
+        const isEdit = Boolean(id);
+        let invoice = null;
+        let issuers = [];
+        let receivers = [];
+        let lineItems = [];
+
+        try {
+            const [issRes, recRes] = await Promise.all([
+                H.get(`${BASE}/issuers`),
+                H.get(`${BASE}/receivers`)
+            ]);
+            issuers   = issRes.data ?? issRes ?? [];
+            receivers = recRes.data ?? recRes ?? [];
+        } catch {
+            E.toast('Could not load issuers / receivers.', { type: 'error' });
+        }
+
+        if (isEdit) {
+            try {
+                const res = await H.get(`${BASE}/invoices/${id}`);
+                invoice = res.data ?? res;
+                lineItems = Array.isArray(invoice.lineItems) ? [...invoice.lineItems] : [];
+            } catch {
+                E.toast('Invoice not found.', { type: 'error' });
+                R.navigate('#/plugins/invoice');
+                return;
+            }
+        }
+
+        const $title       = $container.find('#editor-title');
+        const $number      = $container.find('#f-number');
+        const $status      = $container.find('#f-status');
+        const $issueDate   = $container.find('#f-issue-date');
+        const $dueDate     = $container.find('#f-due-date');
+        const $issuer      = $container.find('#f-issuer');
+        const $receiver    = $container.find('#f-receiver');
+        const $vatEnabled  = $container.find('#f-vat-enabled');
+        const $vatRate     = $container.find('#f-vat-rate');
+        const $currency    = $container.find('#f-currency');
+        const $notes       = $container.find('#f-notes');
+        const $print       = $container.find('#btn-print');
+        const $body        = $container.find('#line-items-body');
+        const $vatRow      = $container.find('#vat-row');
+        const $tSubtotal   = $container.find('#t-subtotal');
+        const $tVat        = $container.find('#t-vat');
+        const $tVatRate    = $container.find('#t-vat-rate');
+        const $tTotal      = $container.find('#t-total');
+
+        function populateSelect($select, list, valueKey, labelFn, selected) {
+            const el = $select.get(0);
+            while (el.firstChild) el.removeChild(el.firstChild);
+            const placeholder = document.createElement('option');
+            placeholder.value = '';
+            placeholder.textContent = '— select —';
+            el.appendChild(placeholder);
+            for (const item of list) {
+                const opt = document.createElement('option');
+                opt.value = item[valueKey];
+                opt.textContent = labelFn(item);
+                if (item[valueKey] === selected) opt.selected = true;
+                el.appendChild(opt);
+            }
+        }
+
+        populateSelect($issuer, issuers, 'id', (i) => i.name || '(unnamed)', invoice?.issuerId);
+        populateSelect($receiver, receivers, 'id', (r) => r.company || r.name || '(unnamed)', invoice?.receiverId);
+
+        const today = new Date().toISOString().slice(0, 10);
+        $title.text(isEdit ? `Edit Invoice ${invoice?.number ?? ''}` : 'New Invoice');
+        $number.val(invoice?.number ?? '');
+        $status.val(invoice?.status ?? 'draft');
+        $issueDate.val(invoice?.issueDate ?? today);
+        $dueDate.val(invoice?.dueDate ?? '');
+        $vatEnabled.prop('checked', invoice?.vatEnabled !== false);
+        $vatRate.val(invoice?.vatRate ?? 20);
+        $currency.val(invoice?.currency ?? 'GBP');
+        $notes.val(invoice?.notes ?? '');
+
+        if (isEdit) {
+            $print.attr('href', `${BASE}/invoices/${id}/print`).css('display', '');
+        }
+
+        if (!lineItems.length) {
+            lineItems.push({ description: '', quantity: 1, unitPrice: 0 });
+        }
+        renderLineItems();
+        recomputeTotals();
+
+        function makeCell(child) {
+            const td = document.createElement('td');
+            td.appendChild(child);
+            return td;
+        }
+
+        function renderLineItems() {
+            const body = $body.get(0);
+            while (body.firstChild) body.removeChild(body.firstChild);
+
+            lineItems.forEach((item, idx) => {
+                const tr = document.createElement('tr');
+
+                const desc = document.createElement('input');
+                desc.type = 'text';
+                desc.className = 'form-control li-desc';
+                desc.dataset.idx = idx;
+                desc.value = item.description ?? '';
+                desc.placeholder = 'Description';
+
+                const qty = document.createElement('input');
+                qty.type = 'number';
+                qty.className = 'form-control li-qty';
+                qty.dataset.idx = idx;
+                qty.min = '0';
+                qty.step = '0.01';
+                qty.value = Number(item.quantity) || 0;
+
+                const price = document.createElement('input');
+                price.type = 'number';
+                price.className = 'form-control li-price';
+                price.dataset.idx = idx;
+                price.min = '0';
+                price.step = '0.01';
+                price.value = Number(item.unitPrice) || 0;
+
+                const totalCell = document.createElement('td');
+                totalCell.style.cssText = 'text-align:right;font-variant-numeric:tabular-nums;';
+                totalCell.id = `line-total-${idx}`;
+                totalCell.textContent = '—';
+
+                const removeBtn = document.createElement('button');
+                removeBtn.type = 'button';
+                removeBtn.className = 'btn btn-sm btn-ghost li-remove';
+                removeBtn.dataset.idx = idx;
+                removeBtn.title = 'Remove';
+                removeBtn.textContent = '×';
+
+                tr.appendChild(makeCell(desc));
+                tr.appendChild(makeCell(qty));
+                tr.appendChild(makeCell(price));
+                tr.appendChild(totalCell);
+                tr.appendChild(makeCell(removeBtn));
+                body.appendChild(tr);
+            });
+
+            updateLineTotals();
+        }
+
+        function updateLineTotals() {
+            const currency = $currency.val();
+            lineItems.forEach((item, idx) => {
+                const lineTotal = round2((Number(item.quantity) || 0) * (Number(item.unitPrice) || 0));
+                const cell = $container.find(`#line-total-${idx}`).get(0);
+                if (cell) cell.textContent = fmt(lineTotal, currency);
+            });
+        }
+
+        function recomputeTotals() {
+            const currency = $currency.val();
+            const vatEnabled = $vatEnabled.prop('checked');
+            const vatRate = Number($vatRate.val()) || 0;
+
+            let subtotal = 0;
+            for (const item of lineItems) {
+                subtotal += (Number(item.quantity) || 0) * (Number(item.unitPrice) || 0);
+            }
+            subtotal = round2(subtotal);
+            const vat = vatEnabled ? round2(subtotal * (vatRate / 100)) : 0;
+            const total = round2(subtotal + vat);
+
+            $tSubtotal.text(fmt(subtotal, currency));
+            $tVat.text(fmt(vat, currency));
+            $tVatRate.text(vatRate);
+            $tTotal.text(fmt(total, currency));
+            $vatRow.css('display', vatEnabled ? '' : 'none');
+            updateLineTotals();
+        }
+
+        $body.on('input', '.li-desc', function () {
+            lineItems[Number(this.dataset.idx)].description = this.value;
+        });
+        $body.on('input', '.li-qty', function () {
+            lineItems[Number(this.dataset.idx)].quantity = Number(this.value) || 0;
+            recomputeTotals();
+        });
+        $body.on('input', '.li-price', function () {
+            lineItems[Number(this.dataset.idx)].unitPrice = Number(this.value) || 0;
+            recomputeTotals();
+        });
+        $body.on('click', '.li-remove', function () {
+            const idx = Number(this.dataset.idx);
+            lineItems.splice(idx, 1);
+            if (!lineItems.length) lineItems.push({ description: '', quantity: 1, unitPrice: 0 });
+            renderLineItems();
+            recomputeTotals();
+        });
+
+        $container.find('#btn-add-line').on('click', () => {
+            lineItems.push({ description: '', quantity: 1, unitPrice: 0 });
+            renderLineItems();
+            recomputeTotals();
+        });
+
+        $vatEnabled.on('change', recomputeTotals);
+        $vatRate.on('input', recomputeTotals);
+        $currency.on('change', recomputeTotals);
+
+        $container.find('#btn-save').on('click', async () => {
+            const issuerId   = $issuer.val();
+            const receiverId = $receiver.val();
+            if (!issuerId)   { E.toast('Pick an issuer.',   { type: 'error' }); return; }
+            if (!receiverId) { E.toast('Pick a receiver.', { type: 'error' }); return; }
+
+            const body = {
+                number:     $number.val()?.trim() || undefined,
+                status:     $status.val(),
+                issueDate:  $issueDate.val(),
+                dueDate:    $dueDate.val() || '',
+                issuerId,
+                receiverId,
+                vatEnabled: $vatEnabled.prop('checked'),
+                vatRate:    Number($vatRate.val()) || 0,
+                currency:   $currency.val(),
+                notes:      $notes.val() ?? '',
+                lineItems
+            };
+
+            try {
+                const res = isEdit
+                    ? await H.put(`${BASE}/invoices/${id}`, body)
+                    : await H.post(`${BASE}/invoices`, body);
+                if (res.error) throw new Error(res.error);
+                E.toast(isEdit ? 'Invoice saved.' : 'Invoice created.', { type: 'success' });
+                R.navigate('#/plugins/invoice');
+            } catch (err) {
+                E.toast(err?.message ?? 'Save failed.', { type: 'error' });
+            }
+        });
+
+        Domma.icons.scan();
+    }
+};

package/plugins/invoice/admin/views/index.js

@@ -0,0 +1,155 @@
+/**
+ * Invoice plugin — list view.
+ */
+function escapeHtml(s) {
+    return String(s ?? '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;');
+}
+
+const BASE = '/api/plugins/invoice';
+
+const STATUS_BADGE = {
+    draft:     'badge-secondary',
+    sent:      'badge-info',
+    paid:      'badge-success',
+    overdue:   'badge-danger',
+    cancelled: 'badge-secondary'
+};
+
+export const indexView = {
+    templateUrl: '/plugins/invoice/admin/templates/index.html',
+
+    async onMount($container) {
+        let invoices = [];
+        let receivers = [];
+        let table = null;
+
+        function receiverName(id) {
+            const r = receivers.find((x) => x.id === id);
+            if (!r) return '—';
+            return r.company || r.name || id;
+        }
+
+        function fmt(amount, currency) {
+            try {
+                return new Intl.NumberFormat('en-GB', { style: 'currency', currency: currency || 'GBP' }).format(Number(amount) || 0);
+            } catch {
+                return `${currency || 'GBP'} ${Number(amount).toFixed(2)}`;
+            }
+        }
+
+        function buildTable(data) {
+            const el = $container.find('#invoices-table').get(0);
+            if (!el) return;
+            if (table) {
+                table.setData(data);
+                Domma.icons.scan(el);
+                return;
+            }
+            table = T.create(el, {
+                data,
+                columns: [
+                    {
+                        key: 'number', title: 'Number', sortable: true,
+                        render: (v, row) => `<a href="#/plugins/invoice/edit/${escapeHtml(row.id)}" style="font-weight:600;">${escapeHtml(v || '—')}</a>`
+                    },
+                    { key: 'receiverId', title: 'Billed To', sortable: false,
+                        render: (v) => escapeHtml(receiverName(v))
+                    },
+                    { key: 'issueDate', title: 'Issue Date', sortable: true,
+                        render: (v) => v ? escapeHtml(D(v).format('DD MMM YYYY')) : '—'
+                    },
+                    { key: 'totals', title: 'Total', sortable: false,
+                        render: (totals, row) => `<span style="font-variant-numeric:tabular-nums;">${escapeHtml(fmt(totals?.total ?? 0, row.currency))}</span>`
+                    },
+                    { key: 'status', title: 'Status', sortable: true,
+                        render: (v) => `<span class="badge ${STATUS_BADGE[v] || 'badge-secondary'}">${escapeHtml(v || 'draft')}</span>`
+                    },
+                    { key: 'id', title: 'Actions', sortable: false,
+                        render: (id) => `<div style="display:flex;gap:.4rem;">
+  <button class="btn btn-sm btn-outline edit-btn" data-id="${escapeHtml(id)}"><span data-icon="edit" data-icon-size="14"></span></button>
+  <a class="btn btn-sm btn-outline" href="${BASE}/invoices/${escapeHtml(id)}/print" target="_blank" title="Print / PDF"><span data-icon="printer" data-icon-size="14"></span></a>
+  <button class="btn btn-sm btn-danger delete-btn" data-id="${escapeHtml(id)}"><span data-icon="trash" data-icon-size="14"></span></button>
+</div>`
+                    }
+                ],
+                emptyMessage: 'No invoices yet. Click “New Invoice” to create your first.'
+            });
+
+            el.addEventListener('click', async (e) => {
+                const editBtn = e.target.closest('.edit-btn');
+                const delBtn  = e.target.closest('.delete-btn');
+                if (editBtn) R.navigate('#/plugins/invoice/edit/' + editBtn.dataset.id);
+                if (delBtn) {
+                    const id = delBtn.dataset.id;
+                    const inv = invoices.find((x) => x.id === id);
+                    const ok = await E.confirm(`Delete invoice ${inv?.number ?? ''}?`);
+                    if (!ok) return;
+                    try {
+                        await H.delete(`${BASE}/invoices/${id}`);
+                        E.toast('Invoice deleted.', { type: 'success' });
+                        await reload();
+                    } catch {
+                        E.toast('Delete failed.', { type: 'error' });
+                    }
+                }
+            });
+
+            Domma.icons.scan(el);
+        }
+
+        function refreshKpis() {
+            const counts = { total: invoices.length, outstanding: 0, paid: 0, drafts: 0 };
+            for (const i of invoices) {
+                if (i.status === 'paid') counts.paid++;
+                else if (i.status === 'draft') counts.drafts++;
+                else if (i.status === 'sent' || i.status === 'overdue') counts.outstanding++;
+            }
+            $container.find('#kpi-total').text(counts.total);
+            $container.find('#kpi-outstanding').text(counts.outstanding);
+            $container.find('#kpi-paid').text(counts.paid);
+            $container.find('#kpi-drafts').text(counts.drafts);
+        }
+
+        function applyFilters() {
+            const status = $container.find('#filter-status').val() || '';
+            const q = ($container.find('#filter-search').val() || '').toString().toLowerCase().trim();
+            let filtered = invoices;
+            if (status) filtered = filtered.filter((i) => i.status === status);
+            if (q) {
+                filtered = filtered.filter((i) =>
+                    (i.number ?? '').toLowerCase().includes(q) ||
+                    receiverName(i.receiverId).toLowerCase().includes(q)
+                );
+            }
+            buildTable(filtered);
+        }
+
+        async function reload() {
+            try {
+                const [invRes, recRes] = await Promise.all([
+                    H.get(`${BASE}/invoices`),
+                    H.get(`${BASE}/receivers`).catch(() => ({ data: [] }))
+                ]);
+                invoices  = invRes.data ?? invRes ?? [];
+                receivers = recRes.data ?? recRes ?? [];
+            } catch {
+                invoices = [];
+                receivers = [];
+                E.toast('Could not load invoices.', { type: 'error' });
+            }
+            refreshKpis();
+            applyFilters();
+        }
+
+        $container.find('#btn-new-invoice').on('click', () => R.navigate('#/plugins/invoice/new'));
+        $container.find('#filter-status').on('change', applyFilters);
+        let timer = null;
+        $container.find('#filter-search').on('input', () => {
+            clearTimeout(timer);
+            timer = setTimeout(applyFilters, 200);
+        });
+
+        await reload();
+        Domma.icons.scan();
+    }
+};

package/plugins/invoice/admin/views/issuers.js

@@ -0,0 +1,23 @@
+/**
+ * Invoice plugin — issuers CRUD view.
+ */
+import {mountPartyView} from './party-view.js?v=1';
+
+export const issuersView = {
+    templateUrl: '/plugins/invoice/admin/templates/issuers.html',
+    onMount: ($container) => mountPartyView($container, {
+        kind: 'issuer',
+        endpoint: '/api/plugins/invoice/issuers',
+        label: 'Issuer',
+        fields: [
+            { key: 'name',        label: 'Trading Name',  required: true,  type: 'text' },
+            { key: 'email',       label: 'Email',         type: 'text' },
+            { key: 'phone',       label: 'Phone',         type: 'text' },
+            { key: 'website',     label: 'Website',       type: 'text' },
+            { key: 'vatNumber',   label: 'VAT Number',    type: 'text' },
+            { key: 'logoUrl',     label: 'Logo URL',      type: 'text' },
+            { key: 'address',     label: 'Address',       type: 'textarea' },
+            { key: 'bankDetails', label: 'Bank Details',  type: 'textarea' }
+        ]
+    })
+};