backpack-viewer 0.6.0 → 0.7.0

package/bin/serve.js

@@ -83,17 +83,24 @@ async function getCachedVersionCheck(currentVersion) {
 
 if (hasDistBuild) {
   // --- Production: static file server + API (zero native deps) ---
-  const {
-    JsonFileBackend,
-    dataDir,
-    RemoteRegistry,
-    listBackpacks,
-    getActiveBackpack,
-    setActiveBackpack,
-    registerBackpack,
-    unregisterBackpack,
-  } = await import("backpack-ontology");
+  const { JsonFileBackend, RemoteRegistry, getActiveBackpack } = await import(
+    "backpack-ontology"
+  );
   const { loadViewerConfig } = await import("../dist/config.js");
+  const { writeViewerState, readViewerState } = await import(
+    "../dist/server-viewer-state.js"
+  );
+  const {
+    loadExtensions: loadServerExtensions,
+    findExtension,
+    publicExtensionInfo,
+    proxyExtensionFetch,
+    readExtensionSettings,
+    writeExtensionSetting,
+    deleteExtensionSetting,
+    resolveExtensionFile,
+  } = await import("../dist/server-extensions.js");
+  const { handleApiRequest } = await import("../dist/server-api-routes.js");
 
   // Load our own version from package.json for the stale-version check
   const pkgJson = JSON.parse(
@@ -105,15 +112,17 @@ if (hasDistBuild) {
   // precedence for quick overrides. Default is 127.0.0.1 loopback —
   // the viewer must never bind to all interfaces by default because
   // its API exposes read/write access to the user's learning graphs.
-  const viewerConfigForServer = loadViewerConfig();
-  const configuredHost = viewerConfigForServer?.server?.host ?? "127.0.0.1";
-  const configuredPort = viewerConfigForServer?.server?.port ?? 5173;
+  const viewerConfig = loadViewerConfig();
+  const configuredHost = viewerConfig?.server?.host ?? "127.0.0.1";
+  const configuredPort = viewerConfig?.server?.port ?? 5173;
   const bindHost = process.env.BACKPACK_VIEWER_HOST ?? configuredHost;
   const port = parseInt(process.env.PORT || String(configuredPort), 10);
 
   // Storage points at the active backpack. Wrapped in a mutable
   // holder so a `/api/backpacks/switch` POST can swap it out in place
-  // without restarting the whole server.
+  // without restarting the whole server. The holder is shared with
+  // the API route handler so a swap inside one request is visible to
+  // the next request without re-plumbing.
   async function makeBackend() {
     const entry = await getActiveBackpack();
     const backend = new JsonFileBackend(undefined, {
@@ -122,10 +131,36 @@ if (hasDistBuild) {
     await backend.initialize();
     return { backend, entry };
   }
-  let { backend: storage, entry: activeEntry } = await makeBackend();
+  const initial = await makeBackend();
+  const storageHolder = { current: initial.backend, activeEntry: initial.entry };
+
   const remoteRegistry = new RemoteRegistry();
   await remoteRegistry.initialize();
-  const viewerConfig = loadViewerConfig();
+
+  // First-party extensions are bundled at dist/extensions/<name>/.
+  // External extensions come from the user's viewer config.
+  const firstPartyExtensionsDir = path.resolve(distDir, "..", "extensions");
+  const extConfig = viewerConfig.extensions ?? {};
+  const userExternalExtensions = Array.isArray(extConfig.external)
+    ? extConfig.external.filter((e) => e && typeof e.name === "string" && typeof e.path === "string")
+    : [];
+  const disabledFirstParty = new Set(
+    Array.isArray(extConfig.disabled) ? extConfig.disabled : [],
+  );
+  const loadedExtensions = loadServerExtensions(
+    firstPartyExtensionsDir,
+    userExternalExtensions,
+    disabledFirstParty,
+  );
+
+  // Context object passed to the shared API route handler.
+  const apiContext = {
+    storage: storageHolder,
+    remoteRegistry,
+    viewerConfig,
+    makeBackend,
+    versionCheck: () => getCachedVersionCheck(currentVersion),
+  };
 
   const MIME_TYPES = {
     ".html": "text/html",
@@ -139,6 +174,10 @@ if (hasDistBuild) {
 
   // Strict CSP — style-src 'self' means no inline styles allowed.
   // Keep it that way; see CLAUDE.md for the rule.
+  //
+  // connect-src stays at 'self' — extensions never talk to external
+  // origins directly. They go through the per-extension proxy below
+  // which forwards server-side using env-var-injected secrets.
   const CSP = [
     "default-src 'self'",
     "script-src 'self'",
@@ -158,143 +197,17 @@ if (hasDistBuild) {
 
     const url = req.url?.replace(/\?.*$/, "") || "/";
 
-    // --- API routes ---
-    if (url === "/api/config") {
-      res.writeHead(200, { "Content-Type": "application/json" });
-      res.end(JSON.stringify(viewerConfig));
-      return;
-    }
-
-    if (url === "/api/version-check" && req.method === "GET") {
-      try {
-        const result = await getCachedVersionCheck(currentVersion);
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(result));
-      } catch {
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(
-          JSON.stringify({ current: currentVersion, latest: null, stale: false }),
-        );
-      }
-      return;
-    }
-
-    // --- Remote graph routes (read-only) ---
-    if (url === "/api/remotes" && req.method === "GET") {
-      try {
-        const remotes = await remoteRegistry.list();
-        const summaries = await Promise.all(
-          remotes.map(async (r) => {
-            try {
-              const data = await remoteRegistry.loadCached(r.name);
-              return {
-                name: r.name,
-                url: r.url,
-                source: r.source,
-                addedAt: r.addedAt,
-                lastFetched: r.lastFetched,
-                pinned: r.pinned,
-                sizeBytes: r.sizeBytes,
-                nodeCount: data.nodes.length,
-                edgeCount: data.edges.length,
-              };
-            } catch {
-              return {
-                name: r.name,
-                url: r.url,
-                source: r.source,
-                addedAt: r.addedAt,
-                lastFetched: r.lastFetched,
-                pinned: r.pinned,
-                sizeBytes: r.sizeBytes,
-                nodeCount: 0,
-                edgeCount: 0,
-              };
-            }
-          }),
-        );
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(summaries));
-      } catch (err) {
-        res.writeHead(500, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ error: err.message }));
-      }
-      return;
-    }
-
-    const remoteItemMatch = url.match(/^\/api\/remotes\/(.+)$/);
-    if (remoteItemMatch && req.method === "GET") {
-      const remoteName = decodeURIComponent(remoteItemMatch[1]);
-      try {
-        const data = await remoteRegistry.loadCached(remoteName);
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(data));
-      } catch (err) {
-        res.writeHead(404, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ error: err.message }));
-      }
-      return;
-    }
-
-    // --- Branch routes ---
-    const branchSwitchMatch = url.match(/^\/api\/graphs\/(.+)\/branches\/switch$/);
-    if (branchSwitchMatch && req.method === "POST") {
-      const graphName = decodeURIComponent(branchSwitchMatch[1]);
-      let body = "";
-      req.on("data", (chunk) => { body += chunk.toString(); });
-      req.on("end", async () => {
-        try {
-          const { name: branchName } = JSON.parse(body);
-          await storage.switchBranch(graphName, branchName);
-          res.writeHead(200, { "Content-Type": "application/json" });
-          res.end(JSON.stringify({ ok: true }));
-        } catch (err) {
-          res.writeHead(400, { "Content-Type": "application/json" });
-          res.end(JSON.stringify({ error: err.message }));
-        }
-      });
-      return;
-    }
-
-    const deleteBranchMatch = url.match(/^\/api\/graphs\/(.+)\/branches\/(.+)$/);
-    if (deleteBranchMatch && req.method === "DELETE") {
-      const graphName = decodeURIComponent(deleteBranchMatch[1]);
-      const branchName = decodeURIComponent(deleteBranchMatch[2]);
-      try {
-        await storage.deleteBranch(graphName, branchName);
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ ok: true }));
-      } catch (err) {
-        res.writeHead(400, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ error: err.message }));
-      }
-      return;
-    }
-
-    const branchMatch = url.match(/^\/api\/graphs\/(.+)\/branches$/);
-    if (branchMatch && req.method === "GET") {
-      const graphName = decodeURIComponent(branchMatch[1]);
-      try {
-        const branches = await storage.listBranches(graphName);
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(branches));
-      } catch (err) {
-        res.writeHead(500, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ error: err.message }));
-      }
-      return;
-    }
-
-    if (branchMatch && req.method === "POST") {
-      const graphName = decodeURIComponent(branchMatch[1]);
+    // --- Viewer state bridge ---
+    // Logic lives in src/server-viewer-state.ts so dev (Vite plugin)
+    // and prod share it. Only the HTTP wiring is here.
+    if (url === "/api/viewer-state" && req.method === "PUT") {
       let body = "";
       req.on("data", (chunk) => { body += chunk.toString(); });
       req.on("end", async () => {
         try {
-          const { name: branchName, from } = JSON.parse(body);
-          await storage.createBranch(graphName, branchName, from);
+          await writeViewerState(body);
           res.writeHead(200, { "Content-Type": "application/json" });
-          res.end(JSON.stringify({ ok: true }));
+          res.end('{"ok":true}');
         } catch (err) {
           res.writeHead(400, { "Content-Type": "application/json" });
           res.end(JSON.stringify({ error: err.message }));
@@ -303,171 +216,103 @@ if (hasDistBuild) {
       return;
     }
 
-    // --- Snapshot routes ---
-    const snapshotMatch = url.match(/^\/api\/graphs\/(.+)\/snapshots$/);
-    if (snapshotMatch && req.method === "GET") {
-      const graphName = decodeURIComponent(snapshotMatch[1]);
+    if (url === "/api/viewer-state" && req.method === "GET") {
       try {
-        const snapshots = await storage.listSnapshots(graphName);
+        const data = await readViewerState();
         res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(snapshots));
-      } catch (err) {
-        res.writeHead(500, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ error: err.message }));
+        res.end(data);
+      } catch {
+        res.writeHead(404, { "Content-Type": "application/json" });
+        res.end('{"error":"no viewer state"}');
       }
       return;
     }
 
-    if (snapshotMatch && req.method === "POST") {
-      const graphName = decodeURIComponent(snapshotMatch[1]);
-      let body = "";
-      req.on("data", (chunk) => { body += chunk.toString(); });
-      req.on("end", async () => {
-        try {
-          const { label } = JSON.parse(body);
-          await storage.createSnapshot(graphName, label);
-          res.writeHead(200, { "Content-Type": "application/json" });
-          res.end(JSON.stringify({ ok: true }));
-        } catch (err) {
-          res.writeHead(400, { "Content-Type": "application/json" });
-          res.end(JSON.stringify({ error: err.message }));
-        }
-      });
-      return;
-    }
-
-    // --- Rollback route ---
-    const rollbackMatch = url.match(/^\/api\/graphs\/(.+)\/rollback$/);
-    if (rollbackMatch && req.method === "POST") {
-      const graphName = decodeURIComponent(rollbackMatch[1]);
-      let body = "";
-      req.on("data", (chunk) => { body += chunk.toString(); });
-      req.on("end", async () => {
-        try {
-          const { version } = JSON.parse(body);
-          await storage.rollback(graphName, version);
-          res.writeHead(200, { "Content-Type": "application/json" });
-          res.end(JSON.stringify({ ok: true }));
-        } catch (err) {
-          res.writeHead(400, { "Content-Type": "application/json" });
-          res.end(JSON.stringify({ error: err.message }));
-        }
-      });
-      return;
-    }
+    // --- Extension system ---
+    // Generic per-extension endpoints. Logic lives in
+    // src/server-extensions.ts so dev and prod share it.
 
-    // --- Diff route ---
-    const diffMatch = url.match(/^\/api\/graphs\/(.+)\/diff\/(\d+)$/);
-    if (diffMatch && req.method === "GET") {
-      const graphName = decodeURIComponent(diffMatch[1]);
-      const version = parseInt(diffMatch[2], 10);
-      try {
-        const current = await storage.loadOntology(graphName);
-        const snapshot = await storage.loadSnapshot(graphName, version);
-        const currentNodeIds = new Set(current.nodes.map(n => n.id));
-        const snapshotNodeIds = new Set(snapshot.nodes.map(n => n.id));
-        const currentEdgeIds = new Set(current.edges.map(e => e.id));
-        const snapshotEdgeIds = new Set(snapshot.edges.map(e => e.id));
-        const diff = {
-          nodesAdded: current.nodes.filter(n => !snapshotNodeIds.has(n.id)).length,
-          nodesRemoved: snapshot.nodes.filter(n => !currentNodeIds.has(n.id)).length,
-          edgesAdded: current.edges.filter(e => !snapshotEdgeIds.has(e.id)).length,
-          edgesRemoved: snapshot.edges.filter(e => !currentEdgeIds.has(e.id)).length,
-        };
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(diff));
-      } catch (err) {
-        res.writeHead(500, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ error: err.message }));
-      }
+    if (url === "/api/extensions" && req.method === "GET") {
+      res.writeHead(200, { "Content-Type": "application/json" });
+      res.end(JSON.stringify(loadedExtensions.map(publicExtensionInfo)));
       return;
     }
 
-    // --- Snippet routes ---
-    const snippetItemMatch = url.match(/^\/api\/graphs\/(.+)\/snippets\/(.+)$/);
-    if (snippetItemMatch && req.method === "GET") {
-      const graphName = decodeURIComponent(snippetItemMatch[1]);
-      const snippetId = decodeURIComponent(snippetItemMatch[2]);
-      try {
-        const snippet = await storage.loadSnippet(graphName, snippetId);
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(snippet));
-      } catch {
+    const extFileMatch = url.match(/^\/extensions\/([^/]+)\/(.+)$/);
+    if (extFileMatch && req.method === "GET") {
+      const extName = decodeURIComponent(extFileMatch[1]);
+      const subPath = decodeURIComponent(extFileMatch[2]);
+      const filePath = resolveExtensionFile(loadedExtensions, extName, subPath);
+      if (!filePath) {
         res.writeHead(404, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ error: "Snippet not found" }));
-      }
-      return;
-    }
-
-    if (snippetItemMatch && req.method === "DELETE") {
-      const graphName = decodeURIComponent(snippetItemMatch[1]);
-      const snippetId = decodeURIComponent(snippetItemMatch[2]);
-      try {
-        await storage.deleteSnippet(graphName, snippetId);
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ ok: true }));
-      } catch (err) {
-        res.writeHead(400, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ error: err.message }));
+        res.end('{"error":"extension file not found"}');
+        return;
       }
-      return;
-    }
-
-    const snippetMatch = url.match(/^\/api\/graphs\/(.+)\/snippets$/);
-    if (snippetMatch && req.method === "GET") {
-      const graphName = decodeURIComponent(snippetMatch[1]);
       try {
-        const snippets = await storage.listSnippets(graphName);
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(snippets));
+        const data = fs.readFileSync(filePath);
+        const ext = path.extname(filePath);
+        const mime = MIME_TYPES[ext] || "application/octet-stream";
+        res.writeHead(200, { "Content-Type": mime });
+        res.end(data);
       } catch {
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end("[]");
+        res.writeHead(404);
+        res.end("Not found");
       }
       return;
     }
 
-    if (snippetMatch && req.method === "POST") {
-      const graphName = decodeURIComponent(snippetMatch[1]);
+    const extFetchMatch = url.match(/^\/api\/extensions\/([^/]+)\/fetch$/);
+    if (extFetchMatch && req.method === "POST") {
+      const extName = decodeURIComponent(extFetchMatch[1]);
+      const ext = findExtension(loadedExtensions, extName);
+      if (!ext) {
+        res.writeHead(404, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ error: `unknown extension: ${extName}` }));
+        return;
+      }
       let body = "";
       req.on("data", (chunk) => { body += chunk.toString(); });
       req.on("end", async () => {
         try {
-          const { label, description, nodeIds, edgeIds } = JSON.parse(body);
-          const id = await storage.saveSnippet(graphName, { label, description, nodeIds, edgeIds: edgeIds ?? [] });
-          res.writeHead(200, { "Content-Type": "application/json" });
-          res.end(JSON.stringify({ ok: true, id }));
+          const result = await proxyExtensionFetch(ext, body);
+          if (result.errorJson || !result.upstreamBody) {
+            res.writeHead(result.status, { "Content-Type": "application/json" });
+            res.end(result.errorJson ?? JSON.stringify({ error: "proxy failed" }));
+            return;
+          }
+          const upstreamCT =
+            result.upstreamHeaders?.get("content-type") ?? "application/octet-stream";
+          res.writeHead(result.status, {
+            "Content-Type": upstreamCT,
+            "Cache-Control": "no-cache",
+            Connection: "keep-alive",
+          });
+          const reader = result.upstreamBody.getReader();
+          while (true) {
+            const { done, value } = await reader.read();
+            if (done) break;
+            res.write(value);
+          }
+          res.end();
         } catch (err) {
-          res.writeHead(400, { "Content-Type": "application/json" });
-          res.end(JSON.stringify({ error: err.message }));
+          if (!res.headersSent) {
+            res.writeHead(500, { "Content-Type": "application/json" });
+            res.end(JSON.stringify({ error: err.message }));
+          } else {
+            res.end();
+          }
         }
       });
       return;
     }
 
-    // --- Backpacks (meta: list, active, switch) ---
-    if (url === "/api/backpacks" && req.method === "GET") {
-      try {
-        const list = await listBackpacks();
-        const active = await getActiveBackpack();
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(
-          JSON.stringify(
-            list.map((b) => ({ ...b, active: b.name === active.name })),
-          ),
-        );
-      } catch (err) {
-        res.writeHead(500, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ error: err.message }));
-      }
-      return;
-    }
-
-    if (url === "/api/backpacks/active" && req.method === "GET") {
+    const extSettingsAllMatch = url.match(/^\/api\/extensions\/([^/]+)\/settings$/);
+    if (extSettingsAllMatch && req.method === "GET") {
+      const extName = decodeURIComponent(extSettingsAllMatch[1]);
       try {
-        const active = await getActiveBackpack();
+        const all = await readExtensionSettings(extName);
         res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(active));
+        res.end(JSON.stringify(all));
       } catch (err) {
         res.writeHead(500, { "Content-Type": "application/json" });
         res.end(JSON.stringify({ error: err.message }));
@@ -475,41 +320,34 @@ if (hasDistBuild) {
       return;
     }
 
-    if (url === "/api/backpacks/switch" && req.method === "POST") {
-      let body = "";
-      req.on("data", (chunk) => { body += chunk.toString(); });
-      req.on("end", async () => {
+    const extSettingsKeyMatch = url.match(/^\/api\/extensions\/([^/]+)\/settings\/([^/]+)$/);
+    if (extSettingsKeyMatch && (req.method === "PUT" || req.method === "DELETE")) {
+      const extName = decodeURIComponent(extSettingsKeyMatch[1]);
+      const key = decodeURIComponent(extSettingsKeyMatch[2]);
+      if (req.method === "DELETE") {
         try {
-          const { name } = JSON.parse(body);
-          await setActiveBackpack(name);
-          const swapped = await makeBackend();
-          storage = swapped.backend;
-          activeEntry = swapped.entry;
+          await deleteExtensionSetting(extName, key);
           res.writeHead(200, { "Content-Type": "application/json" });
-          res.end(JSON.stringify({ ok: true, active: activeEntry }));
+          res.end('{"ok":true}');
         } catch (err) {
-          res.writeHead(400, { "Content-Type": "application/json" });
+          res.writeHead(500, { "Content-Type": "application/json" });
           res.end(JSON.stringify({ error: err.message }));
         }
-      });
-      return;
-    }
-
-    if (url === "/api/backpacks" && req.method === "POST") {
+        return;
+      }
       let body = "";
       req.on("data", (chunk) => { body += chunk.toString(); });
       req.on("end", async () => {
         try {
-          const { name, path: p, activate } = JSON.parse(body);
-          const entry = await registerBackpack(name, p);
-          if (activate) {
-            await setActiveBackpack(name);
-            const swapped = await makeBackend();
-            storage = swapped.backend;
-            activeEntry = swapped.entry;
+          const parsed = JSON.parse(body);
+          if (!("value" in parsed)) {
+            res.writeHead(400, { "Content-Type": "application/json" });
+            res.end('{"error":"body must include {value}"}');
+            return;
           }
+          await writeExtensionSetting(extName, key, parsed.value);
           res.writeHead(200, { "Content-Type": "application/json" });
-          res.end(JSON.stringify({ ok: true, entry }));
+          res.end('{"ok":true}');
         } catch (err) {
           res.writeHead(400, { "Content-Type": "application/json" });
           res.end(JSON.stringify({ error: err.message }));
@@ -518,93 +356,11 @@ if (hasDistBuild) {
       return;
     }
 
-    const backpackDeleteMatch = url.match(/^\/api\/backpacks\/(.+)$/);
-    if (backpackDeleteMatch && req.method === "DELETE") {
-      const name = decodeURIComponent(backpackDeleteMatch[1]);
-      try {
-        await unregisterBackpack(name);
-        // If we just removed the active one, the registry switched us;
-        // rebuild the backend to match.
-        if (activeEntry && activeEntry.name === name) {
-          const swapped = await makeBackend();
-          storage = swapped.backend;
-          activeEntry = swapped.entry;
-        }
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ ok: true }));
-      } catch (err) {
-        res.writeHead(400, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ error: err.message }));
-      }
-      return;
-    }
-
-    // --- Lock heartbeat ---
-    if (url === "/api/locks" && req.method === "GET") {
-      // Batch endpoint: returns { graphName: lockInfo|null } for all graphs.
-      // One request instead of N on every sidebar refresh.
-      try {
-        const summaries = await storage.listOntologies();
-        const result = {};
-        if (typeof storage.readLock === "function") {
-          await Promise.all(
-            summaries.map(async (s) => {
-              try {
-                result[s.name] = await storage.readLock(s.name);
-              } catch {
-                result[s.name] = null;
-              }
-            }),
-          );
-        }
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(result));
-      } catch {
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end("{}");
-      }
-      return;
-    }
-
-    const lockMatch = url.match(/^\/api\/graphs\/(.+)\/lock$/);
-    if (lockMatch && req.method === "GET") {
-      const graphName = decodeURIComponent(lockMatch[1]);
-      try {
-        const lock =
-          typeof storage.readLock === "function"
-            ? await storage.readLock(graphName)
-            : null;
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(lock));
-      } catch {
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end("null");
-      }
-      return;
-    }
-
-    if (url === "/api/ontologies") {
-      try {
-        const summaries = await storage.listOntologies();
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(summaries));
-      } catch {
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end("[]");
-      }
-      return;
-    }
-
-    if (url.startsWith("/api/ontologies/")) {
-      const name = decodeURIComponent(url.replace("/api/ontologies/", ""));
-      try {
-        const data = await storage.loadOntology(name);
-        res.writeHead(200, { "Content-Type": "application/json" });
-        res.end(JSON.stringify(data));
-      } catch {
-        res.writeHead(404, { "Content-Type": "application/json" });
-        res.end(JSON.stringify({ error: "Ontology not found" }));
-      }
+    // --- Shared API routes ---
+    // All the other API endpoints (config, version-check, ontologies,
+    // backpacks, branches, snapshots, snippets, locks, remotes, etc.)
+    // live in src/server-api-routes.ts so dev and prod share them.
+    if (await handleApiRequest(req, res, apiContext)) {
       return;
     }
 
@@ -638,6 +394,13 @@ if (hasDistBuild) {
   server.listen(port, bindHost, () => {
     const displayHost = bindHost === "0.0.0.0" || bindHost === "::" ? "localhost" : bindHost;
     console.log(`  Backpack Viewer v${currentVersion} running at http://${displayHost}:${port}/`);
+    if (loadedExtensions.length > 0) {
+      console.log(
+        `  ${loadedExtensions.length} extension(s) loaded: ${loadedExtensions.map((e) => e.manifest.name).join(", ")}`,
+      );
+    } else {
+      console.log("  No extensions loaded");
+    }
     const isLoopback =
       bindHost === "127.0.0.1" ||
       bindHost === "localhost" ||
@@ -654,7 +417,7 @@ if (hasDistBuild) {
     fetchLatestVersion("backpack-viewer").then((latest) => {
       if (latest && latest !== currentVersion) {
         console.warn("");
-        console.warn(`  ⚠ Backpack Viewer ${currentVersion} is out of date — latest is ${latest}`);
+        console.warn(`  Backpack Viewer ${currentVersion} is out of date — latest is ${latest}`);
         console.warn(`  To update:`);
         console.warn(`    npm cache clean --force`);
         console.warn(`    npx backpack-viewer@latest`);
@@ -669,7 +432,7 @@ if (hasDistBuild) {
   const server = await createServer({
     root,
     configFile: path.resolve(root, "vite.config.ts"),
-    server: { port, open: true },
+    server: { port: parseInt(process.env.PORT || "5173", 10), open: true },
   });
 
   await server.listen();