saltcorn-db-code 0.1.0

package/routes/execute.js

@@ -0,0 +1,267 @@
+const db = require("@saltcorn/data/db");
+const { requireAdmin } = require("../lib/auth");
+const { escapeHtml, page } = require("../lib/html");
+const { ensurePostgres, getRoutineByOid } = require("../lib/introspection");
+const { quoteIdent } = require("../lib/sql-builders");
+const { coerceRoutineInputArgs, routineArity } = require("../lib/routine-args");
+const { detailViewHref, viewContextInput, getViewBaseUrl } = require("../lib/view-context");
+
+function csrfInput(req) {
+  return typeof req.csrfToken === "function" ? `<input type="hidden" name="_csrf" value="${escapeHtml(req.csrfToken())}">` : "";
+}
+
+function formStyles() {
+  return `<style>
+.db-code-execute .db-code-execute-icon { width: 2.25rem; height: 2.25rem; display: inline-flex; align-items: center; justify-content: center; }
+.db-code-execute .form-section-title { font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--bs-secondary-color, #6c757d); font-weight: 700; margin-bottom: .75rem; }
+.db-code-execute .sticky-help { position: sticky; top: 1rem; }
+.db-code-execute .result-table th { white-space: nowrap; }
+.db-code-execute .result-json { max-height: 30rem; overflow: auto; }
+</style>`;
+}
+
+function argInputField(arg, index, required) {
+  const label = escapeHtml(arg.name || `arg${index + 1}`);
+  const typeHint = escapeHtml(arg.type || "text");
+  const placeholder = `${label}: ${typeHint}`;
+  const reqAttr = required ? " required" : "";
+  const pgType = (arg.type || "").toLowerCase();
+  let inputType = "text";
+  let extraAttrs = "";
+  if (pgType === "integer" || pgType === "bigint" || pgType === "smallint" || pgType === "int" || pgType === "serial" || pgType === "bigserial") {
+    inputType = "number";
+    extraAttrs = ' step="1"';
+  } else if (pgType === "numeric" || pgType === "decimal" || pgType === "real" || pgType === "double precision") {
+    inputType = "number";
+  } else if (pgType === "boolean") {
+    return `<div class="col-md-6 mb-3">
+  <label class="form-label">${label} <code class="small">${typeHint}</code>${required ? ' <span class="text-danger">*</span>' : ' <span class="text-muted">(optional)</span>'}</label>
+  <select class="form-select" name="arg_${index}"${reqAttr}>
+    <option value="">-- not provided --</option>
+    <option value="true">true</option>
+    <option value="false">false</option>
+  </select>
+</div>`;
+  }
+  return `<div class="col-md-6 mb-3">
+  <label class="form-label">${label} <code class="small">${typeHint}</code>${required ? ' <span class="text-danger">*</span>' : ' <span class="text-muted">(optional)</span>'}</label>
+  <input class="form-control" type="${inputType}" name="arg_${index}" placeholder="${placeholder}"${extraAttrs}${reqAttr}>
+</div>`;
+}
+
+function identityCard(routine) {
+  return `<div class="card bg-light border-0 mb-3"><div class="card-body">
+<div class="form-section-title">Routine identity</div>
+<table class="table table-sm mb-0">
+  <tr><th>Name</th><td><code>${escapeHtml(routine.schema)}.${escapeHtml(routine.name)}</code></td></tr>
+  <tr><th>Type</th><td>${escapeHtml(routine.kind)}</td></tr>
+  <tr><th>Arguments</th><td><code>${escapeHtml(routine.identity_arguments || "none")}</code></td></tr>
+  ${routine.result_type ? `<tr><th>Returns</th><td><code>${escapeHtml(routine.result_type)}</code></td></tr>` : ""}
+  <tr><th>Language</th><td>${escapeHtml(routine.language || "")}</td></tr>
+</table>
+</div></div>`;
+}
+
+function renderResultTable(rows) {
+  if (!rows || rows.length === 0) {
+    return `<div class="text-muted text-center py-3"><i class="fas fa-check-circle text-success me-2"></i>Query returned no rows.</div>`;
+  }
+  const columns = Object.keys(rows[0]);
+  const headerCells = columns.map((col) => `<th>${escapeHtml(col)}</th>`).join("");
+  const bodyRows = rows.map((row) => {
+    const cells = columns.map((col) => {
+      const val = row[col];
+      if (val === null) return `<td class="text-muted fst-italic">NULL</td>`;
+      if (typeof val === "object") return `<td><code>${escapeHtml(JSON.stringify(val))}</code></td>`;
+      return `<td>${escapeHtml(String(val))}</td>`;
+    }).join("");
+    return `<tr>${cells}</tr>`;
+  }).join("");
+  return `<div class="table-responsive"><table class="table table-sm table-hover table-bordered result-table">
+<thead><tr>${headerCells}</tr></thead>
+<tbody>${bodyRows}</tbody>
+</table></div>
+<div class="small text-muted">${rows.length} row${rows.length !== 1 ? "s" : ""}</div>`;
+}
+
+function renderResultJson(data) {
+  const json = JSON.stringify(data, null, 2);
+  return `<div class="result-json"><pre class="border rounded p-3 bg-light mb-0"><code>${escapeHtml(json)}</code></pre></div>`;
+}
+
+function renderError(message) {
+  return `<div class="alert alert-danger"><i class="fas fa-exclamation-triangle me-2"></i><strong>Execution error</strong><pre class="mb-0 mt-2 small">${escapeHtml(message)}</pre></div>`;
+}
+
+function renderSuccessMeta(meta) {
+  const parts = [];
+  if (meta.kind) parts.push(`<span class="badge bg-light text-dark border">${escapeHtml(meta.kind)}</span>`);
+  if (meta.rowCount != null) parts.push(`<span class="badge bg-light text-dark border">${meta.rowCount} row${meta.rowCount !== 1 ? "s" : ""}</span>`);
+  if (meta.durationMs != null) parts.push(`<span class="badge bg-light text-dark border">${meta.durationMs} ms</span>`);
+  return parts.length ? `<div class="d-flex flex-wrap gap-1 mb-2">${parts.join("")}</div>` : "";
+}
+
+function buildForm(req, routine, error = null, resultData = null, viewBaseUrl = null) {
+  const inputArgs = coerceRoutineInputArgs(routine);
+  const { required } = routineArity(routine);
+  const icon = routine.kind === "procedure" ? "fas fa-cogs" : "fas fa-cube";
+  const isFunction = routine.kind === "function";
+  const hasArgs = inputArgs.length > 0;
+  const backHref = detailViewHref(viewBaseUrl, routine.oid);
+
+  const argFields = hasArgs
+    ? inputArgs.map((arg, i) => argInputField(arg, i, i < required)).join("\n")
+    : `<div class="text-muted"><i class="fas fa-info-circle me-1"></i>This ${routine.kind} takes no arguments.</div>`;
+
+  let resultSection = "";
+  if (error) {
+    resultSection = `<div class="form-section-title mt-4">Result</div>${renderError(error)}`;
+  } else if (resultData) {
+    const metaHtml = renderSuccessMeta(resultData.meta || {});
+    const bodyHtml = resultData.rows ? renderResultTable(resultData.rows) : renderResultJson(resultData.data);
+    resultSection = `<div class="form-section-title mt-4">Result</div>${metaHtml}${bodyHtml}`;
+  }
+
+  return `${formStyles()}<div class="db-code-execute">
+<p><a class="text-decoration-none" href="${backHref}"><i class="fas fa-arrow-left me-1"></i>Back to routine</a></p>
+${error && !resultData ? `<div class="alert alert-danger"><i class="fas fa-exclamation-triangle me-2"></i>${escapeHtml(error)}</div>` : ""}
+<div class="card mt-0 card-max-full-screen">
+  <div class="card-header d-flex justify-content-between align-items-center flex-wrap">
+    <div class="d-flex align-items-center">
+      <span class="db-code-execute-icon rounded bg-success text-white me-2"><i class="fas fa-play"></i></span>
+      <div>
+        <h5 class="mb-0">Execute ${escapeHtml(routine.kind)}: ${escapeHtml(routine.name)}</h5>
+        <div class="small text-muted">Run this ${escapeHtml(routine.kind)} with the provided arguments</div>
+      </div>
+    </div>
+    <a class="btn btn-sm btn-outline-secondary" href="${backHref}">Cancel</a>
+  </div>
+  <div class="card-body">
+    <div class="row g-4">
+      <div class="col-lg-8">
+        <form method="post" action="/db-code/routine/${routine.oid}/execute">
+          ${csrfInput(req)}
+          ${viewContextInput(viewBaseUrl)}
+          <div class="form-section-title">Arguments</div>
+          <div class="row">${argFields}</div>
+          <div class="mb-3">
+            <button class="btn btn-success" type="submit"><i class="fas fa-play me-1"></i>Execute</button>
+            <a class="btn btn-outline-secondary ms-2" href="${backHref}">Cancel</a>
+          </div>
+        </form>
+        ${resultSection}
+      </div>
+      <div class="col-lg-4"><div class="sticky-help">
+        ${identityCard(routine)}
+        <div class="card border-0 bg-light"><div class="card-body">
+          <div class="form-section-title">Notes</div>
+          <ul class="small mb-0">
+            <li>${isFunction ? "Functions are executed with <code>SELECT *</code>." : "Procedures are executed with <code>CALL</code>."}</li>
+            <li>Boolean fields use a tri-state selector (unset / true / false).</li>
+            <li>Null values are sent as SQL NULL.</li>
+            <li>Optional arguments with defaults may be left empty.</li>
+            <li>Read-only — this only calls the routine, does not modify its definition.</li>
+          </ul>
+        </div></div>
+      </div></div>
+    </div>
+  </div>
+</div>
+</div>`;
+}
+
+/**
+ * Parse form-submitted argument values into typed JS values for parameterised queries.
+ * Handles booleans, numbers, and null/empty → null.
+ */
+function parseArgValue(rawValue, pgType) {
+  const str = String(rawValue ?? "").trim();
+  if (str === "") return null;
+  const pg = (pgType || "").toLowerCase();
+  if (pg === "boolean") return str === "true";
+  if (pg === "integer" || pg === "bigint" || pg === "smallint" || pg === "int" || pg === "serial" || pg === "bigserial") {
+    const n = Number.parseInt(str, 10);
+    return Number.isNaN(n) ? str : n;
+  }
+  if (pg === "numeric" || pg === "decimal" || pg === "real" || pg === "double precision") {
+    const n = Number.parseFloat(str);
+    return Number.isNaN(n) ? str : n;
+  }
+  if (pg === "jsonb" || pg === "json") {
+    try { return JSON.parse(str); } catch { return str; }
+  }
+  return str;
+}
+
+async function executeFormRoute(req, res) {
+  if (!requireAdmin(req, res)) return;
+  try {
+    ensurePostgres();
+    const routine = await getRoutineByOid(req.params.oid);
+    if (!routine) {
+      if (typeof res.status === "function") res.status(404);
+      return page(req, res, "Routine not found", `<div class="alert alert-warning">Routine not found in the current tenant schema.</div>`);
+    }
+    if (!["function", "procedure"].includes(routine.kind)) {
+      return page(req, res, "Cannot execute", `<div class="alert alert-warning">Execution is only supported for functions and procedures. This is a ${escapeHtml(routine.kind)}.</div>`);
+    }
+    page(req, res, `Execute ${routine.kind}: ${routine.name}`, buildForm(req, routine, null, null, getViewBaseUrl(req)));
+  } catch (error) {
+    page(req, res, "Execute routine", `<div class="alert alert-danger">${escapeHtml(error.message)}</div>`);
+  }
+}
+
+async function executePostRoute(req, res) {
+  if (!requireAdmin(req, res)) return;
+  const viewBaseUrl = getViewBaseUrl(req);
+  try {
+    ensurePostgres();
+    const routine = await getRoutineByOid(req.params.oid);
+    if (!routine) {
+      if (typeof res.status === "function") res.status(404);
+      return page(req, res, "Routine not found", `<div class="alert alert-warning">Routine not found in the current tenant schema.</div>`);
+    }
+    if (!["function", "procedure"].includes(routine.kind)) {
+      return page(req, res, "Cannot execute", `<div class="alert alert-warning">Execution is only supported for functions and procedures.</div>`);
+    }
+
+    const inputArgs = coerceRoutineInputArgs(routine);
+    const { required } = routineArity(routine);
+
+    const values = [];
+    for (let i = 0; i < inputArgs.length; i++) {
+      const raw = req.body?.[`arg_${i}`];
+      if (i < required && (raw === undefined || raw === null || String(raw).trim() === "")) {
+        return page(req, res, `Execute ${routine.kind}: ${routine.name}`, buildForm(req, routine, `Missing required argument: ${inputArgs[i].name || `#${i + 1}`}`, null, viewBaseUrl));
+      }
+      values.push(parseArgValue(raw, inputArgs[i]?.type));
+    }
+
+    const placeholders = values.map((_, i) => `$${i + 1}`).join(", ");
+    const routineRef = `${quoteIdent(routine.schema)}.${quoteIdent(routine.name)}`;
+
+    const start = Date.now();
+    let result;
+    if (routine.kind === "procedure") {
+      result = await db.query(`CALL ${routineRef}(${placeholders})`, values);
+    } else {
+      result = await db.query(`SELECT * FROM ${routineRef}(${placeholders})`, values);
+    }
+    const durationMs = Date.now() - start;
+
+    const resultData = routine.kind === "procedure"
+      ? { meta: { kind: "procedure", rowCount: result.rowCount || 0, durationMs }, data: { success: true, rowCount: result.rowCount || 0 } }
+      : { meta: { kind: "function", rowCount: result.rows?.length || 0, durationMs }, rows: result.rows || [] };
+
+    page(req, res, `Execute ${routine.kind}: ${routine.name}`, buildForm(req, routine, null, resultData, viewBaseUrl));
+  } catch (error) {
+    const routine = await getRoutineByOid(req.params.oid).catch(() => null);
+    if (routine) {
+      page(req, res, `Execute ${routine.kind}: ${routine.name}`, buildForm(req, routine, error.message, null, viewBaseUrl));
+    } else {
+      page(req, res, "Execute routine", `<div class="alert alert-danger">${escapeHtml(error.message)}</div>`);
+    }
+  }
+}
+
+module.exports = { executeFormRoute, executePostRoute, parseArgValue };

package/routes/export.js

@@ -0,0 +1,119 @@
+const { requireAdmin } = require("../lib/auth");
+const { escapeHtml, page } = require("../lib/html");
+const { ensurePostgres, listRoutines, currentTenantSchema } = require("../lib/introspection");
+const { buildExportPack } = require("../lib/export-import");
+const { listViewHref, routeHref, viewContextInput, getViewBaseUrl } = require("../lib/view-context");
+
+function csrfInput(req) {
+  return typeof req.csrfToken === "function" ? `<input type="hidden" name="_csrf" value="${escapeHtml(req.csrfToken())}">` : "";
+}
+
+function formStyles() {
+  return `<style>
+.db-code-export .db-code-export-icon { width: 2.25rem; height: 2.25rem; display: inline-flex; align-items: center; justify-content: center; }
+.db-code-export .form-section-title { font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--bs-secondary-color, #6c757d); font-weight: 700; margin-bottom: .75rem; }
+</style>`;
+}
+
+function renderExportForm(req, routines, viewBaseUrl) {
+  const backHref = listViewHref(viewBaseUrl);
+  const routineRows = routines.map((r, i) => {
+    const kindIcon = r.kind === "procedure" ? "fas fa-cogs" : "fas fa-cube";
+    const kindClass = r.kind === "procedure" ? "bg-warning text-dark" : "bg-primary";
+    return `<tr>
+  <td><input class="form-check-input" type="checkbox" name="export_${i}" value="${r.oid}" checked></td>
+  <td><span class="badge ${kindClass}"><i class="${kindIcon} me-1"></i>${escapeHtml(r.kind === "procedure" ? "Stored proc." : "Function")}</span></td>
+  <td><code>${escapeHtml(r.name)}</code></td>
+  <td><code>${escapeHtml(r.identity_arguments || "none")}</code></td>
+  <td><code>${escapeHtml(r.result_type || "—")}</code></td>
+  <td><span class="badge bg-light text-dark border">${escapeHtml(r.language)}</span></td>
+</tr>`;
+  }).join("");
+
+  return `${formStyles()}<div class="db-code-export">
+<p><a class="text-decoration-none" href="${backHref}"><i class="fas fa-arrow-left me-1"></i>Back to DB Code</a></p>
+<div class="card mt-0 card-max-full-screen">
+  <div class="card-header d-flex justify-content-between align-items-center flex-wrap">
+    <div class="d-flex align-items-center">
+      <span class="db-code-export-icon rounded bg-info text-white me-2"><i class="fas fa-download"></i></span>
+      <div><h5 class="mb-0">Export routines</h5><div class="small text-muted">Download selected routines as a JSON pack</div></div>
+    </div>
+    <a class="btn btn-sm btn-outline-secondary" href="${backHref}">Cancel</a>
+  </div>
+  <div class="card-body">
+    <form method="post" action="/db-code/export">
+      ${csrfInput(req)}
+      ${viewContextInput(viewBaseUrl)}
+      ${routines.length > 0 ? `<div class="table-responsive"><table class="table table-sm table-hover align-middle mb-0">
+<thead><tr>
+  <th><input class="form-check-input" type="checkbox" id="exportToggleAll" checked></th>
+  <th>Type</th><th>Name</th><th>Arguments</th><th>Returns</th><th>Language</th>
+</tr></thead>
+<tbody>${routineRows}</tbody>
+</table></div>
+<script>
+(function(){
+  var toggle = document.getElementById('exportToggleAll');
+  if (!toggle) return;
+  var boxes = document.querySelectorAll('input[name^="export_"]');
+  toggle.addEventListener('change', function(){ boxes.forEach(function(b){ b.checked = toggle.checked; }); });
+})();
+</script>
+<div class="d-flex gap-2 mt-3">
+  <button class="btn btn-info text-white" type="submit"><i class="fas fa-download me-1"></i>Export ${routines.length} routine${routines.length !== 1 ? "s" : ""}</button>
+  <a class="btn btn-outline-secondary" href="${backHref}">Cancel</a>
+</div>` : `<div class="text-muted text-center py-4"><i class="fas fa-info-circle me-2"></i>No routines found to export.</div>`}
+    </form>
+  </div>
+</div>
+</div>`;
+}
+
+/**
+ * GET /db-code/export — show selection form
+ */
+async function exportFormRoute(req, res) {
+  if (!requireAdmin(req, res)) return;
+  try {
+    ensurePostgres();
+    const routines = await listRoutines();
+    page(req, res, "Export routines", renderExportForm(req, routines, getViewBaseUrl(req)));
+  } catch (error) {
+    page(req, res, "Export routines", `<div class="alert alert-danger">${escapeHtml(error.message)}</div>`);
+  }
+}
+
+/**
+ * POST /db-code/export — generate and download JSON pack
+ */
+async function exportPostRoute(req, res) {
+  if (!requireAdmin(req, res)) return;
+  try {
+    ensurePostgres();
+    const allRoutines = await listRoutines();
+    const oidSet = new Set();
+    for (const [key, value] of Object.entries(req.body || {})) {
+      if (key.startsWith("export_") && value) oidSet.add(String(value));
+    }
+    if (oidSet.size === 0) {
+      return page(req, res, "Export routines", renderExportForm(req, allRoutines, getViewBaseUrl(req)));
+    }
+    const selected = allRoutines.filter((r) => oidSet.has(String(r.oid)));
+    if (selected.length === 0) {
+      return page(req, res, "Export routines", renderExportForm(req, allRoutines, getViewBaseUrl(req)));
+    }
+    const schema = currentTenantSchema();
+    const pack = buildExportPack(selected, schema);
+    const json = JSON.stringify(pack, null, 2);
+    const filename = `db-code-routines-${schema}-${new Date().toISOString().slice(0, 10)}.json`;
+
+    res.setHeader("Content-Type", "application/json");
+    res.setHeader("Content-Disposition", `attachment; filename="${filename}"`);
+    if (typeof res.send === "function") res.send(json);
+    else if (typeof res.end === "function") res.end(json);
+  } catch (error) {
+    page(req, res, "Export routines", `<div class="alert alert-danger">${escapeHtml(error.message)}</div>`);
+  }
+}
+
+module.exports = { exportFormRoute, exportPostRoute };

package/routes/import.js

@@ -0,0 +1,221 @@
+const { requireAdmin } = require("../lib/auth");
+const { escapeHtml, page } = require("../lib/html");
+const { ensurePostgres, currentTenantSchema } = require("../lib/introspection");
+const { validateImportPack, remapSchemaInDdl, renderPackPreview } = require("../lib/export-import");
+const { listViewHref, viewContextInput, getViewBaseUrl } = require("../lib/view-context");
+
+const db = require("@saltcorn/data/db");
+
+function csrfInput(req) {
+  return typeof req.csrfToken === "function" ? `<input type="hidden" name="_csrf" value="${escapeHtml(req.csrfToken())}">` : "";
+}
+
+function formStyles() {
+  return `<style>
+.db-code-import .db-code-import-icon { width: 2.25rem; height: 2.25rem; display: inline-flex; align-items: center; justify-content: center; }
+.db-code-import .form-section-title { font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--bs-secondary-color, #6c757d); font-weight: 700; margin-bottom: .75rem; }
+.db-code-import .result-ok { color: var(--bs-success, #198754); }
+.db-code-import .result-err { color: var(--bs-danger, #dc3545); }
+.db-code-import .result-skip { color: var(--bs-secondary-color, #6c757d); }
+</style>`;
+}
+
+function renderUploadForm(req, viewBaseUrl) {
+  const backHref = listViewHref(viewBaseUrl);
+  return `${formStyles()}<div class="db-code-import">
+<p><a class="text-decoration-none" href="${backHref}"><i class="fas fa-arrow-left me-1"></i>Back to DB Code</a></p>
+<div class="card mt-0 card-max-full-screen">
+  <div class="card-header d-flex justify-content-between align-items-center flex-wrap">
+    <div class="d-flex align-items-center">
+      <span class="db-code-import-icon rounded bg-success text-white me-2"><i class="fas fa-upload"></i></span>
+      <div><h5 class="mb-0">Import routines</h5><div class="small text-muted">Upload a DB Code routine pack (JSON)</div></div>
+    </div>
+    <a class="btn btn-sm btn-outline-secondary" href="${backHref}">Cancel</a>
+  </div>
+  <div class="card-body">
+    <form method="post" action="/db-code/import" enctype="multipart/form-data">
+      ${csrfInput(req)}
+      ${viewContextInput(viewBaseUrl)}
+      <div class="mb-3">
+        <label class="form-label">Pack file</label>
+        <input class="form-control" type="file" name="packfile" accept=".json" required>
+        <div class="form-text">Select a JSON file exported from DB Code.</div>
+      </div>
+      <div class="d-flex gap-2">
+        <button class="btn btn-success" type="submit"><i class="fas fa-upload me-1"></i>Upload and preview</button>
+        <a class="btn btn-outline-secondary" href="${backHref}">Cancel</a>
+      </div>
+    </form>
+  </div>
+</div>
+</div>`;
+}
+
+function renderPreviewForm(req, pack, viewBaseUrl) {
+  const backHref = listViewHref(viewBaseUrl);
+  const schema = currentTenantSchema();
+  const needsRemap = pack.source_schema && pack.source_schema !== schema;
+  const remapNotice = needsRemap
+    ? `<div class="alert alert-warning py-2"><i class="fas fa-exclamation-triangle me-1"></i>Schema remapping: the pack was exported from <code>${escapeHtml(pack.source_schema)}</code> but the current tenant schema is <code>${escapeHtml(schema)}</code>. DDL statements will be remapped automatically.</div>`
+    : "";
+
+  return `${formStyles()}<div class="db-code-import">
+<p><a class="text-decoration-none" href="${backHref}"><i class="fas fa-arrow-left me-1"></i>Back to DB Code</a></p>
+<div class="card mt-0 card-max-full-screen">
+  <div class="card-header d-flex justify-content-between align-items-center flex-wrap">
+    <div class="d-flex align-items-center">
+      <span class="db-code-import-icon rounded bg-success text-white me-2"><i class="fas fa-upload"></i></span>
+      <div><h5 class="mb-0">Import preview</h5><div class="small text-muted">${pack.routines.length} routine${pack.routines.length !== 1 ? "s" : ""} in the pack · exported ${escapeHtml(pack.exported_at || "unknown")}</div></div>
+    </div>
+    <a class="btn btn-sm btn-outline-secondary" href="/db-code/import">Cancel</a>
+  </div>
+  <div class="card-body">
+    ${remapNotice}
+    <form method="post" action="/db-code/import/execute">
+      ${csrfInput(req)}
+      ${viewContextInput(viewBaseUrl)}
+      <input type="hidden" name="pack_json" value="${escapeHtml(JSON.stringify(pack))}">
+      <div class="form-section-title">Select routines to import</div>
+      ${renderPackPreview(pack)}
+      <div class="d-flex gap-2 mt-3">
+        <button class="btn btn-success" type="submit"><i class="fas fa-play me-1"></i>Import selected routines</button>
+        <a class="btn btn-outline-secondary" href="/db-code/import">Cancel</a>
+      </div>
+    </form>
+  </div>
+</div>
+</div>`;
+}
+
+function renderResults(req, results, viewBaseUrl) {
+  const backHref = listViewHref(viewBaseUrl);
+  const okCount = results.filter((r) => r.status === "ok").length;
+  const errCount = results.filter((r) => r.status === "error").length;
+  const skipCount = results.filter((r) => r.status === "skipped").length;
+
+  const summary = [];
+  if (okCount) summary.push(`<span class="badge bg-success">${okCount} imported</span>`);
+  if (errCount) summary.push(`<span class="badge bg-danger">${errCount} failed</span>`);
+  if (skipCount) summary.push(`<span class="badge bg-secondary">${skipCount} skipped</span>`);
+
+  const rows = results.map((r) => {
+    const icon = r.status === "ok" ? "fas fa-check-circle result-ok" : r.status === "error" ? "fas fa-times-circle result-err" : "fas fa-minus-circle result-skip";
+    const kindClass = r.kind === "procedure" ? "bg-warning text-dark" : "bg-primary";
+    const detail = r.status === "error" ? `<div class="small text-danger mt-1">${escapeHtml(r.error)}</div>` : "";
+    return `<tr>
+  <td><i class="${icon}"></i></td>
+  <td><span class="badge ${kindClass}">${escapeHtml(r.kind)}</span></td>
+  <td><code>${escapeHtml(r.name)}</code></td>
+  <td>${escapeHtml(r.status)}${detail}</td>
+</tr>`;
+  }).join("");
+
+  return `${formStyles()}<div class="db-code-import">
+<p><a class="text-decoration-none" href="${backHref}"><i class="fas fa-arrow-left me-1"></i>Back to DB Code</a></p>
+<div class="card mt-0 card-max-full-screen">
+  <div class="card-header d-flex justify-content-between align-items-center flex-wrap">
+    <div class="d-flex align-items-center">
+      <span class="db-code-import-icon rounded ${errCount > 0 ? "bg-warning text-dark" : "bg-success text-white"} me-2"><i class="fas fa-clipboard-check"></i></span>
+      <div><h5 class="mb-0">Import results</h5><div class="small text-muted">${summary.join(" ")}</div></div>
+    </div>
+    <a class="btn btn-sm btn-outline-secondary" href="${backHref}">Done</a>
+  </div>
+  <div class="card-body">
+    <div class="table-responsive"><table class="table table-sm table-hover align-middle mb-0">
+<thead><tr><th></th><th>Type</th><th>Name</th><th>Status</th></tr></thead>
+<tbody>${rows}</tbody>
+</table></div>
+    <div class="d-flex gap-2 mt-3">
+      <a class="btn btn-outline-secondary" href="${backHref}"><i class="fas fa-arrow-left me-1"></i>Back to DB Code</a>
+      <a class="btn btn-outline-primary" href="/db-code/import"><i class="fas fa-upload me-1"></i>Import another pack</a>
+    </div>
+  </div>
+</div>
+</div>`;
+}
+
+/**
+ * GET /db-code/import — show upload form
+ */
+async function importFormRoute(req, res) {
+  if (!requireAdmin(req, res)) return;
+  page(req, res, "Import routines", renderUploadForm(req, getViewBaseUrl(req)));
+}
+
+/**
+ * POST /db-code/import — parse uploaded file, show preview
+ */
+async function importPostRoute(req, res) {
+  if (!requireAdmin(req, res)) return;
+  const viewBaseUrl = getViewBaseUrl(req);
+  try {
+    ensurePostgres();
+    // Get uploaded file content
+    const file = req.files?.packfile || req.file;
+    if (!file) {
+      return page(req, res, "Import routines", renderUploadForm(req, viewBaseUrl) + `<div class="alert alert-warning mt-2">No file uploaded.</div>`);
+    }
+    const rawText = file.data ? file.data.toString("utf8") : String(file.buffer || "");
+    let parsed;
+    try {
+      parsed = JSON.parse(rawText);
+    } catch (e) {
+      return page(req, res, "Import routines", renderUploadForm(req, viewBaseUrl) + `<div class="alert alert-danger mt-2">Invalid JSON file: ${escapeHtml(e.message)}</div>`);
+    }
+    const validation = validateImportPack(parsed);
+    if (!validation.valid) {
+      return page(req, res, "Import routines", renderUploadForm(req, viewBaseUrl) + `<div class="alert alert-danger mt-2">${escapeHtml(validation.error)}</div>`);
+    }
+    page(req, res, "Import preview", renderPreviewForm(req, validation.pack, viewBaseUrl));
+  } catch (error) {
+    page(req, res, "Import routines", `<div class="alert alert-danger">${escapeHtml(error.message)}</div>`);
+  }
+}
+
+/**
+ * POST /db-code/import/execute — execute selected DDLs
+ */
+async function importExecuteRoute(req, res) {
+  if (!requireAdmin(req, res)) return;
+  const viewBaseUrl = getViewBaseUrl(req);
+  try {
+    ensurePostgres();
+    const schema = currentTenantSchema();
+    let pack;
+    try {
+      pack = JSON.parse(req.body?.pack_json || "null");
+    } catch {
+      return page(req, res, "Import routines", `<div class="alert alert-danger">Corrupted pack data.</div>`);
+    }
+    const validation = validateImportPack(pack);
+    if (!validation.valid) {
+      return page(req, res, "Import routines", `<div class="alert alert-danger">${escapeHtml(validation.error)}</div>`);
+    }
+
+    const results = [];
+    for (let i = 0; i < validation.pack.routines.length; i++) {
+      const r = validation.pack.routines[i];
+      const selected = req.body?.[`import_${i}`];
+      if (!selected) {
+        results.push({ name: r.name, kind: r.kind, status: "skipped" });
+        continue;
+      }
+      try {
+        let ddl = r.ddl;
+        // Remap schema if necessary
+        if (validation.pack.source_schema && validation.pack.source_schema !== schema) {
+          ddl = remapSchemaInDdl(ddl, validation.pack.source_schema, schema);
+        }
+        await db.query(ddl);
+        results.push({ name: r.name, kind: r.kind, status: "ok" });
+      } catch (err) {
+        results.push({ name: r.name, kind: r.kind, status: "error", error: err.message });
+      }
+    }
+    page(req, res, "Import results", renderResults(req, results, viewBaseUrl));
+  } catch (error) {
+    page(req, res, "Import routines", `<div class="alert alert-danger">${escapeHtml(error.message)}</div>`);
+  }
+}
+
+module.exports = { importFormRoute, importPostRoute, importExecuteRoute };

package/routes/list.js

@@ -0,0 +1,10 @@
+const { requireAdmin } = require("../lib/auth");
+const { page } = require("../lib/html");
+const { renderRoutineList } = require("../lib/render-routines");
+
+async function listRoute(req, res) {
+  if (!requireAdmin(req, res)) return;
+  page(req, res, "DB Code", await renderRoutineList({ kind: req.query?.kind || "" }));
+}
+
+module.exports = listRoute;

package/routes/placeholder.js

@@ -0,0 +1,11 @@
+const { requireAdmin } = require("../lib/auth");
+const { escapeHtml, page } = require("../lib/html");
+
+function placeholder(title, message) {
+  return async function route(req, res) {
+    if (!requireAdmin(req, res)) return;
+    page(req, res, title, `<p><a href="/db-code">← Back to DB Code</a></p><div class="alert alert-info">${escapeHtml(message)}</div>`);
+  };
+}
+
+module.exports = placeholder;

package/routes/show.js

@@ -0,0 +1,10 @@
+const { requireAdmin } = require("../lib/auth");
+const { page } = require("../lib/html");
+const { renderRoutineDetail } = require("../lib/render-routines");
+
+async function showRoute(req, res) {
+  if (!requireAdmin(req, res)) return;
+  page(req, res, "DB Code routine", await renderRoutineDetail(req.params.oid));
+}
+
+module.exports = showRoute;