npm - @intranefr/superbackend - Versions diffs - 1.4.3 - Mend

@intranefr/superbackend 1.4.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (188) hide show

package/.commiat +4 -0
package/.env.example +47 -0
package/README.md +110 -0
package/index.js +94 -0
package/package.json +67 -0
package/public/css/styles.css +139 -0
package/public/js/animations.js +41 -0
package/sdk/error-tracking/browser/package.json +16 -0
package/sdk/error-tracking/browser/src/core.js +270 -0
package/sdk/error-tracking/browser/src/embed.js +18 -0
package/sdk/error-tracking/browser/src/index.js +1 -0
package/server.js +5 -0
package/src/admin/endpointRegistry.js +300 -0
package/src/controllers/admin.controller.js +321 -0
package/src/controllers/adminAssets.controller.js +530 -0
package/src/controllers/adminAssetsStorage.controller.js +260 -0
package/src/controllers/adminEjsVirtual.controller.js +354 -0
package/src/controllers/adminFeatureFlags.controller.js +155 -0
package/src/controllers/adminHeadless.controller.js +1071 -0
package/src/controllers/adminI18n.controller.js +604 -0
package/src/controllers/adminJsonConfigs.controller.js +97 -0
package/src/controllers/adminLlm.controller.js +273 -0
package/src/controllers/adminMigration.controller.js +257 -0
package/src/controllers/adminSeoConfig.controller.js +515 -0
package/src/controllers/adminStats.controller.js +121 -0
package/src/controllers/adminUploadNamespaces.controller.js +208 -0
package/src/controllers/assets.controller.js +248 -0
package/src/controllers/auth.controller.js +93 -0
package/src/controllers/billing.controller.js +223 -0
package/src/controllers/featureFlags.controller.js +35 -0
package/src/controllers/forms.controller.js +217 -0
package/src/controllers/globalSettings.controller.js +252 -0
package/src/controllers/headlessCrud.controller.js +126 -0
package/src/controllers/i18n.controller.js +12 -0
package/src/controllers/invite.controller.js +249 -0
package/src/controllers/jsonConfigs.controller.js +19 -0
package/src/controllers/metrics.controller.js +149 -0
package/src/controllers/notificationAdmin.controller.js +264 -0
package/src/controllers/notifications.controller.js +131 -0
package/src/controllers/org.controller.js +357 -0
package/src/controllers/orgAdmin.controller.js +491 -0
package/src/controllers/stripeAdmin.controller.js +410 -0
package/src/controllers/user.controller.js +361 -0
package/src/controllers/userAdmin.controller.js +277 -0
package/src/controllers/waitingList.controller.js +167 -0
package/src/controllers/webhook.controller.js +200 -0
package/src/middleware/auth.js +66 -0
package/src/middleware/errorCapture.js +170 -0
package/src/middleware/headlessApiTokenAuth.js +57 -0
package/src/middleware/org.js +108 -0
package/src/middleware.js +901 -0
package/src/models/ActionEvent.js +31 -0
package/src/models/ActivityLog.js +41 -0
package/src/models/Asset.js +84 -0
package/src/models/AuditEvent.js +93 -0
package/src/models/EmailLog.js +28 -0
package/src/models/ErrorAggregate.js +72 -0
package/src/models/FormSubmission.js +41 -0
package/src/models/GlobalSetting.js +38 -0
package/src/models/HeadlessApiToken.js +24 -0
package/src/models/HeadlessModelDefinition.js +41 -0
package/src/models/I18nEntry.js +77 -0
package/src/models/I18nLocale.js +33 -0
package/src/models/Invite.js +70 -0
package/src/models/JsonConfig.js +46 -0
package/src/models/Notification.js +60 -0
package/src/models/Organization.js +57 -0
package/src/models/OrganizationMember.js +43 -0
package/src/models/StripeCatalogItem.js +77 -0
package/src/models/StripeWebhookEvent.js +57 -0
package/src/models/User.js +89 -0
package/src/models/VirtualEjsFile.js +60 -0
package/src/models/VirtualEjsFileVersion.js +43 -0
package/src/models/VirtualEjsGroupChange.js +32 -0
package/src/models/WaitingList.js +41 -0
package/src/models/Webhook.js +63 -0
package/src/models/Workflow.js +29 -0
package/src/models/WorkflowExecution.js +12 -0
package/src/routes/admin.routes.js +26 -0
package/src/routes/adminAssets.routes.js +28 -0
package/src/routes/adminAssetsStorage.routes.js +13 -0
package/src/routes/adminAudit.routes.js +196 -0
package/src/routes/adminEjsVirtual.routes.js +17 -0
package/src/routes/adminErrors.routes.js +164 -0
package/src/routes/adminFeatureFlags.routes.js +12 -0
package/src/routes/adminHeadless.routes.js +38 -0
package/src/routes/adminI18n.routes.js +22 -0
package/src/routes/adminJsonConfigs.routes.js +15 -0
package/src/routes/adminLlm.routes.js +12 -0
package/src/routes/adminMigration.routes.js +81 -0
package/src/routes/adminSeoConfig.routes.js +20 -0
package/src/routes/adminUploadNamespaces.routes.js +13 -0
package/src/routes/assets.routes.js +21 -0
package/src/routes/auth.routes.js +12 -0
package/src/routes/billing.routes.js +11 -0
package/src/routes/errorTracking.routes.js +31 -0
package/src/routes/featureFlags.routes.js +9 -0
package/src/routes/forms.routes.js +9 -0
package/src/routes/formsAdmin.routes.js +13 -0
package/src/routes/globalSettings.routes.js +18 -0
package/src/routes/headless.routes.js +15 -0
package/src/routes/i18n.routes.js +8 -0
package/src/routes/invite.routes.js +9 -0
package/src/routes/jsonConfigs.routes.js +8 -0
package/src/routes/log.routes.js +111 -0
package/src/routes/metrics.routes.js +9 -0
package/src/routes/notificationAdmin.routes.js +15 -0
package/src/routes/notifications.routes.js +12 -0
package/src/routes/org.routes.js +31 -0
package/src/routes/orgAdmin.routes.js +20 -0
package/src/routes/publicAssets.routes.js +7 -0
package/src/routes/stripeAdmin.routes.js +20 -0
package/src/routes/user.routes.js +22 -0
package/src/routes/userAdmin.routes.js +15 -0
package/src/routes/waitingList.routes.js +13 -0
package/src/routes/waitingListAdmin.routes.js +9 -0
package/src/routes/webhook.routes.js +32 -0
package/src/routes/workflowWebhook.routes.js +54 -0
package/src/routes/workflows.routes.js +110 -0
package/src/services/assets.service.js +110 -0
package/src/services/audit.service.js +62 -0
package/src/services/auditLogger.js +165 -0
package/src/services/ejsVirtual.service.js +614 -0
package/src/services/email.service.js +351 -0
package/src/services/errorLogger.js +221 -0
package/src/services/featureFlags.service.js +202 -0
package/src/services/forms.service.js +214 -0
package/src/services/globalSettings.service.js +49 -0
package/src/services/headlessApiTokens.service.js +158 -0
package/src/services/headlessCrypto.service.js +31 -0
package/src/services/headlessModels.service.js +356 -0
package/src/services/i18n.service.js +314 -0
package/src/services/i18nInferredKeys.service.js +337 -0
package/src/services/jsonConfigs.service.js +392 -0
package/src/services/llm.service.js +749 -0
package/src/services/migration.service.js +581 -0
package/src/services/migrationAssets/fsLocal.js +58 -0
package/src/services/migrationAssets/index.js +134 -0
package/src/services/migrationAssets/s3.js +75 -0
package/src/services/migrationAssets/sftp.js +92 -0
package/src/services/notification.service.js +212 -0
package/src/services/objectStorage.service.js +514 -0
package/src/services/seoConfig.service.js +402 -0
package/src/services/storage.js +150 -0
package/src/services/stripe.service.js +185 -0
package/src/services/stripeHelper.service.js +264 -0
package/src/services/uploadNamespaces.service.js +326 -0
package/src/services/webhook.service.js +157 -0
package/src/services/workflow.service.js +271 -0
package/src/utils/asyncHandler.js +5 -0
package/src/utils/encryption.js +80 -0
package/src/utils/jwt.js +40 -0
package/src/utils/orgRoles.js +156 -0
package/src/utils/validation.js +26 -0
package/src/utils/webhookRetry.js +93 -0
package/views/admin-assets.ejs +444 -0
package/views/admin-audit.ejs +283 -0
package/views/admin-coolify-deploy.ejs +207 -0
package/views/admin-dashboard-home.ejs +291 -0
package/views/admin-dashboard.ejs +397 -0
package/views/admin-ejs-virtual.ejs +280 -0
package/views/admin-errors.ejs +368 -0
package/views/admin-feature-flags.ejs +390 -0
package/views/admin-forms.ejs +526 -0
package/views/admin-global-settings.ejs +436 -0
package/views/admin-headless.ejs +2020 -0
package/views/admin-i18n-locales.ejs +221 -0
package/views/admin-i18n.ejs +728 -0
package/views/admin-json-configs.ejs +410 -0
package/views/admin-llm.ejs +884 -0
package/views/admin-metrics.ejs +274 -0
package/views/admin-migration.ejs +814 -0
package/views/admin-notifications.ejs +430 -0
package/views/admin-organizations.ejs +984 -0
package/views/admin-seo-config.ejs +673 -0
package/views/admin-stripe-pricing.ejs +558 -0
package/views/admin-test.ejs +342 -0
package/views/admin-users.ejs +452 -0
package/views/admin-waiting-list.ejs +547 -0
package/views/admin-webhooks.ejs +329 -0
package/views/admin-workflows.ejs +310 -0
package/views/partials/admin-assets-script.ejs +2022 -0
package/views/partials/admin-test-sidebar.ejs +14 -0
package/views/partials/dashboard/nav-items.ejs +66 -0
package/views/partials/dashboard/palette.ejs +63 -0
package/views/partials/dashboard/sidebar.ejs +21 -0
package/views/partials/dashboard/tab-bar.ejs +26 -0
package/views/partials/footer.ejs +3 -0

package/views/admin-ejs-virtual.ejs ADDED Viewed

@@ -0,0 +1,280 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>EJS Virtual Codebase - Admin</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+  </head>
+  <body class="bg-gray-100">
+    <div class="min-h-screen">
+      <div class="bg-white shadow">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
+          <div class="flex justify-between items-center">
+            <div>
+              <h1 class="text-2xl font-bold text-gray-900">EJS Virtual Codebase</h1>
+              <p class="text-sm text-gray-600 mt-1">DB overrides + Vibe coding + History/Rollback + Cache control.</p>
+            </div>
+            <div class="flex items-center gap-4">
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6 space-y-4">
+        <div class="bg-white rounded-lg shadow p-4">
+          <div class="flex flex-wrap gap-3 items-end">
+            <div class="flex-1 min-w-[260px]">
+              <label class="block text-xs font-medium text-gray-600 mb-1">File</label>
+              <select id="fileSelect" class="w-full border rounded px-2 py-2 text-sm"></select>
+            </div>
+            <div class="min-w-[200px]">
+              <label class="block text-xs font-medium text-gray-600 mb-1">LLM Provider Key</label>
+              <input id="providerKey" class="w-full border rounded px-2 py-2 text-sm" placeholder="e.g. openrouter" />
+            </div>
+            <div class="min-w-[260px]">
+              <label class="block text-xs font-medium text-gray-600 mb-1">Model</label>
+              <input id="model" class="w-full border rounded px-2 py-2 text-sm" placeholder="e.g. x-ai/grok-code-fast-1" />
+            </div>
+            <div class="flex items-center gap-2">
+              <button id="btnReload" class="px-3 py-2 bg-gray-200 text-gray-900 rounded text-sm">Reload</button>
+              <button id="btnClearCache" class="px-3 py-2 bg-orange-600 text-white rounded text-sm">Clear Cache</button>
+            </div>
+          </div>
+        </div>
+        <div class="grid grid-cols-1 lg:grid-cols-2 gap-4">
+          <div class="bg-white rounded-lg shadow p-4">
+            <div class="flex items-center justify-between mb-2">
+              <h2 class="font-semibold text-gray-900">Editor</h2>
+              <div class="flex gap-2">
+                <button id="btnSave" class="px-3 py-1.5 bg-blue-600 text-white rounded text-sm">Save Override</button>
+                <button id="btnRevert" class="px-3 py-1.5 bg-gray-800 text-white rounded text-sm">Revert to Default</button>
+              </div>
+            </div>
+            <textarea id="editor" class="w-full h-[520px] border rounded p-2 font-mono text-xs"></textarea>
+          </div>
+          <div class="space-y-4">
+            <div class="bg-white rounded-lg shadow p-4">
+              <h2 class="font-semibold text-gray-900 mb-2">Vibe coding</h2>
+              <textarea id="prompt" class="w-full h-28 border rounded p-2 text-sm" placeholder="Describe the change you want..."></textarea>
+              <div class="mt-2 flex justify-end gap-2">
+                <button id="btnVibe" class="px-3 py-2 bg-purple-600 text-white rounded text-sm">Run Vibe Edit</button>
+              </div>
+              <div id="vibeResult" class="mt-3 text-xs text-gray-700 whitespace-pre-wrap"></div>
+            </div>
+            <div class="bg-white rounded-lg shadow p-4">
+              <h2 class="font-semibold text-gray-900 mb-2">History (latest 50)</h2>
+              <div id="history" class="space-y-2 max-h-[320px] overflow-auto"></div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <script>
+      const API_BASE = window.location.origin + "<%= baseUrl %>" || window.location.origin;
+      const STORAGE_KEYS = {
+        providerKey: 'ejsVirtual.providerKey',
+        model: 'ejsVirtual.model',
+      };
+      let files = [];
+      let selectedPath = null;
+      function escapeHtml(str) {
+        return String(str ?? '')
+          .replace(/&/g, '&amp;')
+          .replace(/</g, '&lt;')
+          .replace(/>/g, '&gt;')
+          .replace(/"/g, '&quot;')
+          .replace(/'/g, '&#039;');
+      }
+      function showMessage(el, msg) {
+        el.textContent = msg;
+      }
+      function loadSettings() {
+        const pk = localStorage.getItem(STORAGE_KEYS.providerKey) || '';
+        const model = localStorage.getItem(STORAGE_KEYS.model) || '';
+        document.getElementById('providerKey').value = pk;
+        document.getElementById('model').value = model;
+      }
+      function saveSettings() {
+        localStorage.setItem(STORAGE_KEYS.providerKey, document.getElementById('providerKey').value.trim());
+        localStorage.setItem(STORAGE_KEYS.model, document.getElementById('model').value.trim());
+      }
+      async function fetchFiles() {
+        const res = await fetch(`${API_BASE}/api/admin/ejs-virtual/files`);
+        const data = await res.json();
+        if (!res.ok) throw new Error(data?.error || 'Failed to list files');
+        files = data.items || [];
+        const select = document.getElementById('fileSelect');
+        select.innerHTML = '';
+        files.forEach((f) => {
+          const opt = document.createElement('option');
+          opt.value = f.path;
+          opt.textContent = `${f.path}${f.enabled ? ' (override)' : ''}${f.integrated ? ' [integrated]' : ''}`;
+          select.appendChild(opt);
+        });
+        if (!selectedPath && files.length) {
+          selectedPath = files[0].path;
+        }
+        select.value = selectedPath;
+      }
+      async function loadFile(p) {
+        selectedPath = p;
+        const res = await fetch(`${API_BASE}/api/admin/ejs-virtual/file?path=${encodeURIComponent(p)}`);
+        const data = await res.json();
+        if (!res.ok) throw new Error(data?.error || 'Failed to load file');
+        const editor = document.getElementById('editor');
+        editor.value = (data.db && data.db.enabled) ? (data.db.content || '') : (data.fs.content || '');
+        await loadHistory(p);
+      }
+      async function loadHistory(p) {
+        const res = await fetch(`${API_BASE}/api/admin/ejs-virtual/history?path=${encodeURIComponent(p)}`);
+        const data = await res.json();
+        const container = document.getElementById('history');
+        container.innerHTML = '';
+        if (!res.ok) {
+          container.innerHTML = `<div class="text-xs text-red-600">${escapeHtml(data?.error || 'Failed to load history')}</div>`;
+          return;
+        }
+        (data.versions || []).forEach((v) => {
+          const row = document.createElement('div');
+          row.className = 'border rounded p-2 text-xs';
+          row.innerHTML = `
+            <div class="flex justify-between gap-2">
+              <div>
+                <div class="font-semibold">${escapeHtml(v.source || '')}</div>
+                <div class="text-gray-500">${escapeHtml(new Date(v.createdAt).toLocaleString())}</div>
+                <div class="text-gray-700">${escapeHtml(v.description || '')}</div>
+              </div>
+              <button class="px-2 py-1 bg-gray-100 rounded" data-version-id="${escapeHtml(v._id)}">Rollback</button>
+            </div>
+          `;
+          row.querySelector('button').onclick = () => rollback(v._id);
+          container.appendChild(row);
+        });
+      }
+      async function saveOverride() {
+        if (!selectedPath) return;
+        const content = document.getElementById('editor').value;
+        const res = await fetch(`${API_BASE}/api/admin/ejs-virtual/file?path=${encodeURIComponent(selectedPath)}`,
+          {
+            method: 'PUT',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ content, enabled: true, description: 'Manual save' }),
+          }
+        );
+        const data = await res.json();
+        if (!res.ok) throw new Error(data?.error || 'Failed to save');
+        await fetchFiles();
+        await loadFile(selectedPath);
+      }
+      async function revertToDefault() {
+        if (!selectedPath) return;
+        const res = await fetch(`${API_BASE}/api/admin/ejs-virtual/file/revert?path=${encodeURIComponent(selectedPath)}`,
+          { method: 'POST' }
+        );
+        const data = await res.json();
+        if (!res.ok) throw new Error(data?.error || 'Failed to revert');
+        await fetchFiles();
+        await loadFile(selectedPath);
+      }
+      async function rollback(versionId) {
+        const res = await fetch(`${API_BASE}/api/admin/ejs-virtual/rollback`,
+          {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ versionId }),
+          }
+        );
+        const data = await res.json();
+        if (!res.ok) throw new Error(data?.error || 'Failed to rollback');
+        await fetchFiles();
+        await loadFile(selectedPath);
+      }
+      async function runVibe() {
+        if (!selectedPath) return;
+        saveSettings();
+        const prompt = document.getElementById('prompt').value;
+        const providerKey = document.getElementById('providerKey').value.trim();
+        const model = document.getElementById('model').value.trim();
+        const out = document.getElementById('vibeResult');
+        showMessage(out, 'Running...');
+        const res = await fetch(`${API_BASE}/api/admin/ejs-virtual/vibe`,
+          {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ prompt, paths: [selectedPath], providerKey, model }),
+          }
+        );
+        const data = await res.json();
+        if (!res.ok) {
+          showMessage(out, data?.error || 'Vibe failed');
+          return;
+        }
+        showMessage(out, `Applied via provider=${data.providerKey} model=${data.model}\nGroup=${data.group?.title || ''}`);
+        await fetchFiles();
+        await loadFile(selectedPath);
+      }
+      async function clearCache() {
+        const res = await fetch(`${API_BASE}/api/admin/ejs-virtual/cache/clear`, { method: 'POST' });
+        const data = await res.json();
+        if (!res.ok) throw new Error(data?.error || 'Failed to clear cache');
+      }
+      async function bootstrap() {
+        loadSettings();
+        await fetchFiles();
+        const select = document.getElementById('fileSelect');
+        select.onchange = async () => {
+          await loadFile(select.value);
+        };
+        document.getElementById('btnReload').onclick = async () => {
+          await fetchFiles();
+          await loadFile(selectedPath);
+        };
+        document.getElementById('btnSave').onclick = saveOverride;
+        document.getElementById('btnRevert').onclick = revertToDefault;
+        document.getElementById('btnVibe').onclick = runVibe;
+        document.getElementById('btnClearCache').onclick = clearCache;
+        if (selectedPath) {
+          await loadFile(selectedPath);
+        }
+      }
+      bootstrap().catch((err) => {
+        document.body.innerHTML = `<pre class="p-6 text-red-600">${escapeHtml(err.message || String(err))}</pre>`;
+      });
+    </script>
+<script>
+  window.addEventListener("keydown", (e) => {
+    if ((e.ctrlKey || e.metaKey) && e.key === "k") {
+      e.preventDefault();
+      window.parent.postMessage({ type: "keydown", ctrlK: true }, "*");
+    }
+  });
+</script>
+  </body>
+</html>

package/views/admin-errors.ejs ADDED Viewed

@@ -0,0 +1,368 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Error Tracking - Admin</title>
+  <script src="https://cdn.tailwindcss.com?plugins=forms"></script>
+</head>
+<body class="bg-gray-100">
+  <div class="min-h-screen">
+    <div class="bg-white shadow">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
+        <div class="flex justify-between items-center">
+          <div>
+            <h1 class="text-2xl font-bold text-gray-900">Error Tracking</h1>
+            <p class="text-sm text-gray-600 mt-1">Aggregated errors from frontend and backend</p>
+          </div>
+          <div class="flex items-center gap-4">
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+      <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-6">
+        <div class="flex gap-4 text-sm">
+          <div class="bg-white border border-gray-200 rounded-lg px-4 py-2">
+            <span class="text-gray-500">Open:</span>
+            <span id="stat-open" class="text-orange-600 font-semibold ml-1">—</span>
+          </div>
+          <div class="bg-white border border-gray-200 rounded-lg px-4 py-2">
+            <span class="text-gray-500">Last 24h:</span>
+            <span id="stat-24h" class="text-blue-600 font-semibold ml-1">—</span>
+          </div>
+        </div>
+        <button onclick="refreshAll()" class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">Refresh</button>
+      </div>
+      <details class="bg-white border border-gray-200 rounded-xl p-4 mb-6">
+        <summary class="cursor-pointer select-none text-sm font-semibold text-gray-900">Quick integration (browser SDK)</summary>
+        <div class="mt-4 space-y-4">
+          <div>
+            <div class="text-xs font-semibold text-gray-600 uppercase tracking-wide mb-2">Embed SDK</div>
+            <div class="relative">
+              <pre class="p-3 bg-gray-50 rounded text-xs overflow-x-auto"><code id="snippet-embed">&lt;script src="<%= baseUrl %>/api/error-tracking/browser-sdk"&gt;&lt;/script&gt;</code></pre>
+              <button type="button" class="absolute top-2 right-2 text-xs px-2 py-1 bg-white border border-gray-200 rounded hover:border-blue-500" onclick="copySnippet('snippet-embed')">Copy</button>
+            </div>
+          </div>
+          <div>
+            <div class="text-xs font-semibold text-gray-600 uppercase tracking-wide mb-2">Identify user (JWT header)</div>
+            <div class="relative">
+              <pre class="p-3 bg-gray-50 rounded text-xs overflow-x-auto"><code id="snippet-jwt">saasbackend.errorTracking.config({
+  headers: { authorization: "Bearer XXX" }
+})</code></pre>
+              <button type="button" class="absolute top-2 right-2 text-xs px-2 py-1 bg-white border border-gray-200 rounded hover:border-blue-500" onclick="copySnippet('snippet-jwt')">Copy</button>
+            </div>
+          </div>
+          <div>
+            <div class="text-xs font-semibold text-gray-600 uppercase tracking-wide mb-2">Future npm package (bundlers)</div>
+            <div class="relative">
+              <pre class="p-3 bg-gray-50 rounded text-xs overflow-x-auto"><code id="snippet-npm">import { createErrorTrackingClient } from '@saasbackend/sdk/error-tracking/browser';
+const client = createErrorTrackingClient({
+  endpoint: '/api/log/error',
+  headers: { authorization: `Bearer ${token}` },
+});
+client.init();</code></pre>
+              <button type="button" class="absolute top-2 right-2 text-xs px-2 py-1 bg-white border border-gray-200 rounded hover:border-blue-500" onclick="copySnippet('snippet-npm')">Copy</button>
+            </div>
+          </div>
+        </div>
+      </details>
+      <div class="bg-white border border-gray-200 rounded-xl p-4 mb-6">
+        <div class="grid grid-cols-1 md:grid-cols-5 gap-3">
+          <select id="filter-source" class="border rounded px-3 py-2 text-sm">
+            <option value="">All Sources</option>
+            <option value="frontend">Frontend</option>
+            <option value="backend">Backend</option>
+          </select>
+          <select id="filter-severity" class="border rounded px-3 py-2 text-sm">
+            <option value="">All Severities</option>
+            <option value="fatal">Fatal</option>
+            <option value="error">Error</option>
+            <option value="warn">Warning</option>
+            <option value="info">Info</option>
+          </select>
+          <select id="filter-status" class="border rounded px-3 py-2 text-sm">
+            <option value="">All Status</option>
+            <option value="open">Open</option>
+            <option value="ignored">Ignored</option>
+            <option value="resolved">Resolved</option>
+          </select>
+          <select id="filter-since" class="border rounded px-3 py-2 text-sm">
+            <option value="">All Time</option>
+            <option value="1">Last 24 hours</option>
+            <option value="7">Last 7 days</option>
+            <option value="30">Last 30 days</option>
+          </select>
+          <input id="filter-search" type="text" placeholder="Search..." class="border rounded px-3 py-2 text-sm" />
+        </div>
+        <div class="mt-3 flex justify-end">
+          <button id="btn-filter" class="bg-gray-900 text-white px-4 py-2 rounded hover:bg-gray-800 text-sm">Filter</button>
+        </div>
+      </div>
+      <div class="bg-white border border-gray-200 rounded-xl overflow-hidden">
+        <table class="w-full">
+          <thead class="bg-gray-50">
+            <tr class="text-left text-xs uppercase tracking-wide text-gray-500">
+              <th class="px-4 py-3">Error</th>
+              <th class="px-4 py-3 w-24">Source</th>
+              <th class="px-4 py-3 w-24">Severity</th>
+              <th class="px-4 py-3 w-24 text-right">Count</th>
+              <th class="px-4 py-3 w-48">Last Seen</th>
+              <th class="px-4 py-3 w-24">Status</th>
+              <th class="px-4 py-3 w-24"></th>
+            </tr>
+          </thead>
+          <tbody id="errors-table" class="divide-y divide-gray-100">
+            <tr><td colspan="7" class="px-4 py-8 text-center text-gray-500">Loading...</td></tr>
+          </tbody>
+        </table>
+      </div>
+      <div class="flex items-center justify-between mt-4 text-sm text-gray-600">
+        <div id="pagination-info"></div>
+        <div class="flex gap-2">
+          <button id="btn-prev" class="px-3 py-1 bg-white border border-gray-300 rounded hover:border-blue-500 disabled:opacity-50 disabled:cursor-not-allowed">Prev</button>
+          <button id="btn-next" class="px-3 py-1 bg-white border border-gray-300 rounded hover:border-blue-500 disabled:opacity-50 disabled:cursor-not-allowed">Next</button>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div id="modal" class="fixed inset-0 bg-black/50 z-50 hidden items-center justify-center p-4">
+    <div class="bg-white rounded-xl max-w-4xl w-full max-h-[90vh] overflow-hidden flex flex-col">
+      <div class="flex items-center justify-between px-6 py-4 border-b">
+        <h2 id="modal-title" class="text-xl font-bold text-gray-900">Error Details</h2>
+        <button id="modal-close" class="text-gray-500 hover:text-gray-800">Close</button>
+      </div>
+      <div id="modal-content" class="flex-1 overflow-y-auto p-6"></div>
+    </div>
+  </div>
+  <script>
+    const API_BASE = window.location.origin + "<%= baseUrl %>" || window.location.origin;
+    let currentPage = 1;
+    const pageSize = 20;
+    let totalPages = 1;
+    async function copySnippet(id) {
+      try {
+        const el = document.getElementById(id);
+        const text = el ? (el.textContent || '') : '';
+        if (!text) return;
+        if (navigator.clipboard && navigator.clipboard.writeText) {
+          await navigator.clipboard.writeText(text);
+          return;
+        }
+        const ta = document.createElement('textarea');
+        ta.value = text;
+        ta.style.position = 'fixed';
+        ta.style.left = '-9999px';
+        document.body.appendChild(ta);
+        ta.focus();
+        ta.select();
+        document.execCommand('copy');
+        document.body.removeChild(ta);
+      } catch (e) {}
+    }
+    async function loadStats() {
+      try {
+        const res = await fetch(`${API_BASE}/api/admin/errors/stats`);
+        if (!res.ok) return;
+        const stats = await res.json();
+        document.getElementById('stat-open').textContent = stats.open ?? 0;
+        document.getElementById('stat-24h').textContent = stats.last24h ?? 0;
+      } catch (e) {}
+    }
+    async function loadErrors() {
+      const source = document.getElementById('filter-source').value;
+      const severity = document.getElementById('filter-severity').value;
+      const status = document.getElementById('filter-status').value;
+      const sinceDays = document.getElementById('filter-since').value;
+      const q = document.getElementById('filter-search').value;
+      const params = new URLSearchParams();
+      if (source) params.set('source', source);
+      if (severity) params.set('severity', severity);
+      if (status) params.set('status', status);
+      if (q) params.set('q', q);
+      if (sinceDays) {
+        const since = new Date(Date.now() - parseInt(sinceDays) * 24 * 60 * 60 * 1000).toISOString();
+        params.set('since', since);
+      }
+      params.set('page', currentPage);
+      params.set('pageSize', pageSize);
+      try {
+        const res = await fetch(`${API_BASE}/api/admin/errors?` + params.toString());
+        if (!res.ok) throw new Error('Failed to load errors');
+        const data = await res.json();
+        totalPages = data.totalPages || 1;
+        renderErrors(data.errors || []);
+        renderPagination(data);
+      } catch (e) {
+        document.getElementById('errors-table').innerHTML = '<tr><td colspan="7" class="px-4 py-8 text-center text-red-600">Failed to load errors</td></tr>';
+      }
+    }
+    function renderErrors(errors) {
+      const tbody = document.getElementById('errors-table');
+      if (!errors.length) {
+        tbody.innerHTML = '<tr><td colspan="7" class="px-4 py-8 text-center text-gray-500">No errors found</td></tr>';
+        return;
+      }
+      tbody.innerHTML = errors.map(err => {
+        const sourceBadge = err.source === 'frontend'
+          ? '<span class="px-2 py-1 text-xs rounded bg-purple-100 text-purple-700">frontend</span>'
+          : '<span class="px-2 py-1 text-xs rounded bg-blue-100 text-blue-700">backend</span>';
+        const statusColor = err.status === 'open' ? 'text-orange-600' : (err.status === 'resolved' ? 'text-green-600' : 'text-gray-500');
+        return `
+          <tr class="hover:bg-gray-50 cursor-pointer" onclick="showDetails('${err._id}')">
+            <td class="px-4 py-3">
+              <div class="text-gray-900 font-medium">${escapeHtml(err.errorName || 'Error')}</div>
+              <div class="text-gray-500 text-sm truncate max-w-xl">${escapeHtml(err.messageTemplate || '')}</div>
+            </td>
+            <td class="px-4 py-3">${sourceBadge}</td>
+            <td class="px-4 py-3 text-sm text-gray-700">${escapeHtml(err.severity)}</td>
+            <td class="px-4 py-3 text-right font-mono text-gray-900">${(err.countTotal || 0).toLocaleString()}</td>
+            <td class="px-4 py-3 text-sm text-gray-600">${formatDate(err.lastSeenAt)}</td>
+            <td class="px-4 py-3 text-sm ${statusColor}">${escapeHtml(err.status)}</td>
+            <td class="px-4 py-3"><button onclick="event.stopPropagation(); showDetails('${err._id}')" class="text-blue-600 hover:underline text-sm">View</button></td>
+          </tr>
+        `;
+      }).join('');
+    }
+    function renderPagination(data) {
+      document.getElementById('pagination-info').textContent = `Page ${data.page} of ${data.totalPages} (${data.total} total)`;
+      document.getElementById('btn-prev').disabled = data.page <= 1;
+      document.getElementById('btn-next').disabled = data.page >= data.totalPages;
+    }
+    async function showDetails(id) {
+      try {
+        const res = await fetch(`${API_BASE}/api/admin/errors/${id}`);
+        if (!res.ok) throw new Error('Failed to load details');
+        const err = await res.json();
+        renderModal(err);
+      } catch (e) {
+        alert('Failed to load error details');
+      }
+    }
+    function renderModal(err) {
+      document.getElementById('modal-title').textContent = err.errorName || 'Error Details';
+      const samples = (err.samples || []).slice().reverse();
+      document.getElementById('modal-content').innerHTML = `
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-3 mb-6 text-sm">
+          <div><span class="text-gray-500">Source:</span> <span class="ml-2 text-gray-900">${escapeHtml(err.source)}</span></div>
+          <div><span class="text-gray-500">Severity:</span> <span class="ml-2 text-gray-900">${escapeHtml(err.severity)}</span></div>
+          <div><span class="text-gray-500">Status:</span> <span class="ml-2 text-gray-900">${escapeHtml(err.status)}</span></div>
+          <div><span class="text-gray-500">Total Count:</span> <span class="ml-2 text-gray-900">${(err.countTotal || 0).toLocaleString()}</span></div>
+          <div><span class="text-gray-500">First Seen:</span> <span class="ml-2 text-gray-900">${formatDate(err.firstSeenAt)}</span></div>
+          <div><span class="text-gray-500">Last Seen:</span> <span class="ml-2 text-gray-900">${formatDate(err.lastSeenAt)}</span></div>
+        </div>
+        <div class="mb-4">
+          <div class="text-gray-500 text-sm">Message Template</div>
+          <div class="mt-1 p-3 bg-gray-50 rounded font-mono text-xs overflow-x-auto">${escapeHtml(err.messageTemplate || '')}</div>
+        </div>
+        <div class="mb-6 flex gap-2">
+          <button onclick="updateStatus('${err._id}', 'open')" class="px-3 py-1 text-sm rounded ${err.status === 'open' ? 'bg-orange-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'}">Open</button>
+          <button onclick="updateStatus('${err._id}', 'ignored')" class="px-3 py-1 text-sm rounded ${err.status === 'ignored' ? 'bg-gray-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'}">Ignored</button>
+          <button onclick="updateStatus('${err._id}', 'resolved')" class="px-3 py-1 text-sm rounded ${err.status === 'resolved' ? 'bg-green-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'}">Resolved</button>
+        </div>
+        <h3 class="text-lg font-bold text-gray-900 mb-3">Recent Samples (${samples.length})</h3>
+        <div class="space-y-4">
+          ${samples.map(s => `
+            <div class="border border-gray-200 rounded-lg p-4">
+              <div class="flex justify-between items-start mb-2">
+                <span class="text-xs text-gray-500">${formatDate(s.at)}</span>
+                <span class="text-xs text-gray-500">${escapeHtml(s.actor?.ip || 'Unknown IP')}</span>
+              </div>
+              <div class="text-sm text-gray-900 mb-2">${escapeHtml(s.message || '')}</div>
+              ${s.stack ? `<details class="text-xs"><summary class="text-blue-600 cursor-pointer">Stack trace</summary><pre class="mt-2 p-2 bg-gray-50 rounded overflow-x-auto text-gray-700">${escapeHtml(s.stack)}</pre></details>` : ''}
+              ${s.request?.path ? `<div class="text-xs text-gray-500 mt-2">${escapeHtml(s.request.method || 'GET')} ${escapeHtml(s.request.path)} ${s.request.statusCode ? '→ ' + s.request.statusCode : ''}</div>` : ''}
+            </div>
+          `).join('')}
+        </div>
+      `;
+      document.getElementById('modal').classList.remove('hidden');
+      document.getElementById('modal').classList.add('flex');
+    }
+    async function updateStatus(id, status) {
+      try {
+        const res = await fetch(`${API_BASE}/api/admin/errors/${id}/status`, {
+          method: 'PUT',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ status }),
+        });
+        if (!res.ok) return;
+        const err = await res.json();
+        renderModal(err);
+        await loadErrors();
+        await loadStats();
+      } catch (e) {
+        alert('Failed to update status');
+      }
+    }
+    function closeModal() {
+      document.getElementById('modal').classList.add('hidden');
+      document.getElementById('modal').classList.remove('flex');
+    }
+    function escapeHtml(str) {
+      const div = document.createElement('div');
+      div.textContent = str || '';
+      return div.innerHTML;
+    }
+    function formatDate(dateStr) {
+      if (!dateStr) return '—';
+      const d = new Date(dateStr);
+      return d.toLocaleString();
+    }
+    function refreshAll() {
+      loadStats();
+      loadErrors();
+    }
+    document.getElementById('btn-filter').addEventListener('click', () => { currentPage = 1; loadErrors(); });
+    document.getElementById('filter-search').addEventListener('keypress', (e) => { if (e.key === 'Enter') { currentPage = 1; loadErrors(); } });
+    document.getElementById('btn-prev').addEventListener('click', () => { if (currentPage > 1) { currentPage--; loadErrors(); } });
+    document.getElementById('btn-next').addEventListener('click', () => { if (currentPage < totalPages) { currentPage++; loadErrors(); } });
+    document.getElementById('modal-close').addEventListener('click', closeModal);
+    document.getElementById('modal').addEventListener('click', (e) => { if (e.target.id === 'modal') closeModal(); });
+    refreshAll();
+  </script>
+<script>
+  window.addEventListener("keydown", (e) => {
+    if ((e.ctrlKey || e.metaKey) && e.key === "k") {
+      e.preventDefault();
+      window.parent.postMessage({ type: "keydown", ctrlK: true }, "*");
+    }
+  });
+</script>
+</body>
+</html>