@199-bio/engram 0.7.2 → 0.7.4

package/dist/consolidation/consolidator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"consolidator.d.ts","sourceRoot":"","sources":["../../src/consolidation/consolidator.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAGH,OAAO,EAAE,cAAc,EAAU,MAAM,EAAW,MAAM,wBAAwB,CAAC;AACjF,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AA0FtD,UAAU,kBAAkB;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2BAA2B,CAAC,EAAE,MAAM,CAAC;CACtC;AAED,qBAAa,YAAY;IACvB,OAAO,CAAC,MAAM,CAA0B;IACxC,OAAO,CAAC,EAAE,CAAiB;IAC3B,OAAO,CAAC,KAAK,CAA+B;IAC5C,OAAO,CAAC,MAAM,CAA6B;gBAGzC,EAAE,EAAE,cAAc,EAClB,KAAK,CAAC,EAAE,cAAc,EACtB,MAAM,CAAC,EAAE,YAAY;IAYvB,YAAY,IAAI,OAAO;IAIvB;;;OAGG;IACG,WAAW,CAAC,OAAO,GAAE,kBAAuB,GAAG,OAAO,CAAC;QAC3D,cAAc,EAAE,MAAM,CAAC;QACvB,mBAAmB,EAAE,MAAM,CAAC;QAC5B,iBAAiB,EAAE,MAAM,CAAC;KAC3B,CAAC;IAwEF;;OAEG;YACW,gBAAgB;IAoE9B;;OAEG;IACG,iBAAiB,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC;IAuHjE;;OAEG;IACH,SAAS,IAAI;QACX,UAAU,EAAE,OAAO,CAAC;QACpB,sBAAsB,EAAE,MAAM,CAAC;QAC/B,sBAAsB,EAAE,MAAM,CAAC;QAC/B,YAAY,EAAE,MAAM,CAAC;QACrB,wBAAwB,EAAE,MAAM,CAAC;KAClC;IAeD;;;OAGG;IACG,mBAAmB,CAAC,OAAO,GAAE;QACjC,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,SAAS,CAAC,EAAE,MAAM,CAAC;KACf,GAAG,OAAO,CAAC;QACf,iBAAiB,EAAE,MAAM,CAAC;QAC1B,eAAe,EAAE,MAAM,CAAC;QACxB,eAAe,EAAE,MAAM,CAAC;KACzB,CAAC;IAwFF;;OAEG;YACW,2BAA2B;IAqDzC;;;OAGG;IACG,aAAa,IAAI,OAAO,CAAC;QAC7B,iBAAiB,EAAE,MAAM,CAAC;QAC1B,eAAe,EAAE,MAAM,CAAC;QACxB,cAAc,EAAE,MAAM,CAAC;QACvB,mBAAmB,EAAE,MAAM,CAAC;KAC7B,CAAC;CAkBH"}
+{"version":3,"file":"consolidator.d.ts","sourceRoot":"","sources":["../../src/consolidation/consolidator.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAGH,OAAO,EAAE,cAAc,EAAU,MAAM,EAAW,MAAM,wBAAwB,CAAC;AAEjF,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AA0FtD,UAAU,kBAAkB;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2BAA2B,CAAC,EAAE,MAAM,CAAC;CACtC;AAED,qBAAa,YAAY;IACvB,OAAO,CAAC,MAAM,CAA0B;IACxC,OAAO,CAAC,EAAE,CAAiB;IAC3B,OAAO,CAAC,KAAK,CAA+B;IAC5C,OAAO,CAAC,MAAM,CAA6B;gBAGzC,EAAE,EAAE,cAAc,EAClB,KAAK,CAAC,EAAE,cAAc,EACtB,MAAM,CAAC,EAAE,YAAY;IAYvB,YAAY,IAAI,OAAO;IAIvB;;;OAGG;IACG,WAAW,CAAC,OAAO,GAAE,kBAAuB,GAAG,OAAO,CAAC;QAC3D,cAAc,EAAE,MAAM,CAAC;QACvB,mBAAmB,EAAE,MAAM,CAAC;QAC5B,iBAAiB,EAAE,MAAM,CAAC;KAC3B,CAAC;IAwEF;;OAEG;YACW,gBAAgB;IAoE9B;;OAEG;IACG,iBAAiB,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC;IAuHjE;;OAEG;IACH,SAAS,IAAI;QACX,UAAU,EAAE,OAAO,CAAC;QACpB,sBAAsB,EAAE,MAAM,CAAC;QAC/B,sBAAsB,EAAE,MAAM,CAAC;QAC/B,YAAY,EAAE,MAAM,CAAC;QACrB,wBAAwB,EAAE,MAAM,CAAC;KAClC;IAeD;;;OAGG;IACG,mBAAmB,CAAC,OAAO,GAAE;QACjC,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,SAAS,CAAC,EAAE,MAAM,CAAC;KACf,GAAG,OAAO,CAAC;QACf,iBAAiB,EAAE,MAAM,CAAC;QAC1B,eAAe,EAAE,MAAM,CAAC;QACxB,eAAe,EAAE,MAAM,CAAC;KACzB,CAAC;IAwFF;;OAEG;YACW,2BAA2B;IAqDzC;;;OAGG;IACG,aAAa,IAAI,OAAO,CAAC;QAC7B,iBAAiB,EAAE,MAAM,CAAC;QAC1B,eAAe,EAAE,MAAM,CAAC;QACxB,cAAc,EAAE,MAAM,CAAC;QACvB,mBAAmB,EAAE,MAAM,CAAC;KAC7B,CAAC;CAkBH"}

package/dist/settings.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"settings.d.ts","sourceRoot":"","sources":["../src/settings.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAMH,MAAM,WAAW,cAAc;IAC7B,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAE5B;AAMD;;GAEG;AACH,wBAAgB,YAAY,IAAI,cAAc,CAU7C;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,QAAQ,EAAE,cAAc,GAAG,IAAI,CAW3D;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,IAAI,MAAM,GAAG,SAAS,CAGvD;AAED;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAIvD;AAED;;GAEG;AACH,wBAAgB,kBAAkB,IAAI,OAAO,CAE5C"}

package/dist/web/chat-handler.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chat-handler.d.ts","sourceRoot":"","sources":["../../src/web/chat-handler.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,EAAE,cAAc,EAAkB,MAAM,wBAAwB,CAAC;AACxE,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAmQtD,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,GAAG,YAAY,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,CAAC;IAC5D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,qBAAa,WAAW;IACtB,OAAO,CAAC,MAAM,CAA0B;IACxC,OAAO,CAAC,EAAE,CAAiB;IAC3B,OAAO,CAAC,KAAK,CAAiB;IAC9B,OAAO,CAAC,MAAM,CAAe;IAC7B,OAAO,CAAC,mBAAmB,CAAgC;IAC3D,OAAO,CAAC,YAAY,CAAkB;IACtC,OAAO,CAAC,YAAY,CAAoG;gBAE5G,OAAO,EAAE;QACnB,EAAE,EAAE,cAAc,CAAC;QACnB,KAAK,EAAE,cAAc,CAAC;QACtB,MAAM,EAAE,YAAY,CAAC;KACtB;IAWD,YAAY,IAAI,OAAO;IAIvB,MAAM,IAAI,OAAO;IAIjB,cAAc,IAAI,MAAM;IAIxB,YAAY,IAAI,IAAI;YAKN,YAAY;IAgBpB,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;IAgBzC,UAAU,CAAC,WAAW,EAAE,MAAM,GAAG,cAAc,CAAC,WAAW,CAAC;YAsHrD,cAAc;YAgFd,WAAW;CAoQ1B"}
+{"version":3,"file":"chat-handler.d.ts","sourceRoot":"","sources":["../../src/web/chat-handler.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,EAAE,cAAc,EAAkB,MAAM,wBAAwB,CAAC;AACxE,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAoQtD,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,GAAG,YAAY,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,CAAC;IAC5D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,qBAAa,WAAW;IACtB,OAAO,CAAC,MAAM,CAA0B;IACxC,OAAO,CAAC,EAAE,CAAiB;IAC3B,OAAO,CAAC,KAAK,CAAiB;IAC9B,OAAO,CAAC,MAAM,CAAe;IAC7B,OAAO,CAAC,mBAAmB,CAAgC;IAC3D,OAAO,CAAC,YAAY,CAAkB;IACtC,OAAO,CAAC,YAAY,CAAoG;gBAE5G,OAAO,EAAE;QACnB,EAAE,EAAE,cAAc,CAAC;QACnB,KAAK,EAAE,cAAc,CAAC;QACtB,MAAM,EAAE,YAAY,CAAC;KACtB;IASD;;OAEG;IACH,aAAa,IAAI,IAAI;IASrB,YAAY,IAAI,OAAO;IAIvB,MAAM,IAAI,OAAO;IAIjB,cAAc,IAAI,MAAM;IAIxB,YAAY,IAAI,IAAI;YAKN,YAAY;IAgBpB,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;IAgBzC,UAAU,CAAC,WAAW,EAAE,MAAM,GAAG,cAAc,CAAC,WAAW,CAAC;YAsHrD,cAAc;YAgFd,WAAW;CAoQ1B"}

package/dist/web/server.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../src/web/server.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAOH,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAwBtD;;;GAGG;AACH,wBAAgB,mBAAmB,IAAI,MAAM,GAAG,IAAI,CAmBnD;AAED,UAAU,gBAAgB;IACxB,EAAE,EAAE,cAAc,CAAC;IACnB,KAAK,EAAE,cAAc,CAAC;IACtB,MAAM,EAAE,YAAY,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,qBAAa,eAAe;IAC1B,OAAO,CAAC,MAAM,CAA4B;IAC1C,OAAO,CAAC,EAAE,CAAiB;IAC3B,OAAO,CAAC,KAAK,CAAiB;IAC9B,OAAO,CAAC,MAAM,CAAe;IAC7B,OAAO,CAAC,IAAI,CAAc;IAC1B,OAAO,CAAC,YAAY,CAAe;IACnC,OAAO,CAAC,IAAI,CAAS;gBAET,OAAO,EAAE,gBAAgB;IAa/B,KAAK,IAAI,OAAO,CAAC,MAAM,CAAC;IAwD9B,OAAO,CAAC,aAAa;IAkBrB,OAAO,CAAC,cAAc;IActB,IAAI,IAAI,IAAI;YAQE,aAAa;YA+Bb,SAAS;YAoWT,WAAW;IAgCzB,OAAO,CAAC,SAAS;CAclB"}
+{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../src/web/server.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAOH,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAyBtD;;;GAGG;AACH,wBAAgB,mBAAmB,IAAI,MAAM,GAAG,IAAI,CAmBnD;AAED,UAAU,gBAAgB;IACxB,EAAE,EAAE,cAAc,CAAC;IACnB,KAAK,EAAE,cAAc,CAAC;IACtB,MAAM,EAAE,YAAY,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,qBAAa,eAAe;IAC1B,OAAO,CAAC,MAAM,CAA4B;IAC1C,OAAO,CAAC,EAAE,CAAiB;IAC3B,OAAO,CAAC,KAAK,CAAiB;IAC9B,OAAO,CAAC,MAAM,CAAe;IAC7B,OAAO,CAAC,IAAI,CAAc;IAC1B,OAAO,CAAC,YAAY,CAAe;IACnC,OAAO,CAAC,IAAI,CAAS;gBAET,OAAO,EAAE,gBAAgB;IAa/B,KAAK,IAAI,OAAO,CAAC,MAAM,CAAC;IAwD9B,OAAO,CAAC,aAAa;IAkBrB,OAAO,CAAC,cAAc;IActB,IAAI,IAAI,IAAI;YAQE,aAAa;YA+Bb,SAAS;YAiZT,WAAW;IAgCzB,OAAO,CAAC,SAAS;CAclB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@199-bio/engram",
-  "version": "0.7.2",
+  "version": "0.7.4",
   "description": "Give Claude a perfect memory. Local-first MCP server with hybrid search.",
   "type": "module",
   "main": "dist/index.js",

package/src/consolidation/consolidator.ts

@@ -13,6 +13,7 @@
 
 import Anthropic from "@anthropic-ai/sdk";
 import { EngramDatabase, Memory, Digest, Episode } from "../storage/database.js";
+import { getAnthropicApiKey } from "../settings.js";
 import { KnowledgeGraph } from "../graph/knowledge-graph.js";
 import { HybridSearch } from "../retrieval/hybrid.js";
 
@@ -124,7 +125,7 @@ export class Consolidator {
     this.graph = graph || null;
     this.search = search || null;
 
-    const apiKey = process.env.ANTHROPIC_API_KEY;
+    const apiKey = getAnthropicApiKey();
     if (apiKey) {
       this.client = new Anthropic({ apiKey });
     }

package/src/settings.ts

@@ -0,0 +1,73 @@
+/**
+ * Settings management for Engram
+ * Stores configuration in ~/.engram/settings.json
+ */
+
+import fs from "fs";
+import path from "path";
+import os from "os";
+
+export interface EngramSettings {
+  anthropic_api_key?: string;
+  // Future settings can be added here
+}
+
+const SETTINGS_DIR = process.env.ENGRAM_DB_PATH?.replace("~", os.homedir())
+  || path.join(os.homedir(), ".engram");
+const SETTINGS_FILE = path.join(SETTINGS_DIR, "settings.json");
+
+/**
+ * Load settings from file
+ */
+export function loadSettings(): EngramSettings {
+  try {
+    if (fs.existsSync(SETTINGS_FILE)) {
+      const data = fs.readFileSync(SETTINGS_FILE, "utf-8");
+      return JSON.parse(data);
+    }
+  } catch (error) {
+    console.error("[Engram] Failed to load settings:", error);
+  }
+  return {};
+}
+
+/**
+ * Save settings to file
+ */
+export function saveSettings(settings: EngramSettings): void {
+  try {
+    // Ensure directory exists
+    if (!fs.existsSync(SETTINGS_DIR)) {
+      fs.mkdirSync(SETTINGS_DIR, { recursive: true });
+    }
+    fs.writeFileSync(SETTINGS_FILE, JSON.stringify(settings, null, 2));
+  } catch (error) {
+    console.error("[Engram] Failed to save settings:", error);
+    throw error;
+  }
+}
+
+/**
+ * Get the Anthropic API key from settings or environment
+ * Priority: settings file > environment variable
+ */
+export function getAnthropicApiKey(): string | undefined {
+  const settings = loadSettings();
+  return settings.anthropic_api_key || process.env.ANTHROPIC_API_KEY;
+}
+
+/**
+ * Set the Anthropic API key in settings
+ */
+export function setAnthropicApiKey(apiKey: string): void {
+  const settings = loadSettings();
+  settings.anthropic_api_key = apiKey;
+  saveSettings(settings);
+}
+
+/**
+ * Check if API key is configured (either in settings or env)
+ */
+export function hasAnthropicApiKey(): boolean {
+  return !!getAnthropicApiKey();
+}

package/src/web/chat-handler.ts

@@ -7,6 +7,7 @@ import Anthropic from "@anthropic-ai/sdk";
 import { EngramDatabase, Entity, Memory } from "../storage/database.js";
 import { KnowledgeGraph } from "../graph/knowledge-graph.js";
 import { HybridSearch } from "../retrieval/hybrid.js";
+import { getAnthropicApiKey } from "../settings.js";
 
 // Tool definitions for Claude
 const TOOLS: Anthropic.Tool[] = [
@@ -290,9 +291,19 @@ export class ChatHandler {
     this.graph = options.graph;
     this.search = options.search;
 
-    const apiKey = process.env.ANTHROPIC_API_KEY;
+    // Initialize client from settings or env var
+    this.refreshClient();
+  }
+
+  /**
+   * Refresh the Anthropic client (call after settings change)
+   */
+  refreshClient(): void {
+    const apiKey = getAnthropicApiKey();
     if (apiKey) {
       this.client = new Anthropic({ apiKey });
+    } else {
+      this.client = null;
     }
   }
 

package/src/web/server.ts

@@ -13,6 +13,7 @@ import { KnowledgeGraph } from "../graph/knowledge-graph.js";
 import { HybridSearch } from "../retrieval/hybrid.js";
 import { ChatHandler } from "./chat-handler.js";
 import { Consolidator } from "../consolidation/consolidator.js";
+import { loadSettings, saveSettings, hasAnthropicApiKey } from "../settings.js";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
@@ -379,13 +380,58 @@ export class EngramWebServer {
       return;
     }
 
+    // ============ Settings Endpoints ============
+
+    // GET /api/settings - get current settings (without exposing full API key)
+    if (pathname === "/api/settings" && method === "GET") {
+      const settings = loadSettings();
+      res.end(JSON.stringify({
+        has_api_key: hasAnthropicApiKey(),
+        api_key_preview: settings.anthropic_api_key
+          ? `${settings.anthropic_api_key.slice(0, 12)}...${settings.anthropic_api_key.slice(-4)}`
+          : null,
+        api_key_source: settings.anthropic_api_key
+          ? "settings"
+          : process.env.ANTHROPIC_API_KEY
+            ? "environment"
+            : null,
+      }));
+      return;
+    }
+
+    // POST /api/settings - update settings
+    if (pathname === "/api/settings" && method === "POST") {
+      const { anthropic_api_key } = body as { anthropic_api_key?: string };
+
+      if (anthropic_api_key !== undefined) {
+        const settings = loadSettings();
+        if (anthropic_api_key === "") {
+          // Clear the API key
+          delete settings.anthropic_api_key;
+        } else {
+          settings.anthropic_api_key = anthropic_api_key;
+        }
+        saveSettings(settings);
+
+        // Refresh the chat client
+        this.chat.refreshClient();
+        this.consolidator = new Consolidator(this.db); // Reinit consolidator
+      }
+
+      res.end(JSON.stringify({
+        success: true,
+        configured: this.chat.isConfigured(),
+      }));
+      return;
+    }
+
     // GET /api/chat/status - check if chat is configured
     if (pathname === "/api/chat/status" && method === "GET") {
       res.end(JSON.stringify({
         configured: this.chat.isConfigured(),
         message: this.chat.isConfigured()
           ? "Chat is ready"
-          : "Set ANTHROPIC_API_KEY environment variable to enable chat",
+          : "Configure API key in Settings",
       }));
       return;
     }

package/src/web/static/app.js

@@ -17,6 +17,7 @@ const views = {
   entities: document.getElementById('entities-view'),
   graph: document.getElementById('graph-view'),
   consolidation: document.getElementById('consolidation-view'),
+  settings: document.getElementById('settings-view'),
 };
 
 const statsEl = document.getElementById('stats');
@@ -352,6 +353,7 @@ function switchView(view) {
   if (view === 'entities') loadEntities(entityTypeFilter.value);
   if (view === 'graph') loadGraph();
   if (view === 'consolidation') loadConsolidation();
+  if (view === 'settings') loadSettings();
 }
 
 // ============ Consolidation ============
@@ -881,6 +883,104 @@ async function checkApiStatus() {
   }
 }
 
+// ============ Settings ============
+
+const apiStatusBadge = document.getElementById('api-status-badge');
+const apiKeyInput = document.getElementById('api-key-input');
+const toggleKeyVisibility = document.getElementById('toggle-key-visibility');
+const saveApiKeyBtn = document.getElementById('save-api-key');
+const clearApiKeyBtn = document.getElementById('clear-api-key');
+
+async function loadSettings() {
+  try {
+    const settings = await api('/api/settings');
+    updateSettingsUI(settings);
+  } catch (e) {
+    console.error('Failed to load settings', e);
+  }
+}
+
+function updateSettingsUI(settings) {
+  if (settings.has_api_key) {
+    apiStatusBadge.textContent = `Configured (${settings.api_key_source})`;
+    apiStatusBadge.className = 'status-badge configured';
+    apiKeyInput.placeholder = settings.api_key_preview || 'sk-ant-api03-...';
+    apiKeyInput.value = '';
+  } else {
+    apiStatusBadge.textContent = 'Not configured';
+    apiStatusBadge.className = 'status-badge not-configured';
+    apiKeyInput.placeholder = 'sk-ant-api03-...';
+  }
+}
+
+if (toggleKeyVisibility) {
+  toggleKeyVisibility.addEventListener('click', () => {
+    const type = apiKeyInput.type === 'password' ? 'text' : 'password';
+    apiKeyInput.type = type;
+    toggleKeyVisibility.textContent = type === 'password' ? '👁' : '🙈';
+  });
+}
+
+if (saveApiKeyBtn) {
+  saveApiKeyBtn.addEventListener('click', async () => {
+    const apiKey = apiKeyInput.value.trim();
+    if (!apiKey) {
+      alert('Please enter an API key');
+      return;
+    }
+
+    if (!apiKey.startsWith('sk-ant-')) {
+      alert('Invalid API key format. Should start with sk-ant-');
+      return;
+    }
+
+    try {
+      saveApiKeyBtn.disabled = true;
+      saveApiKeyBtn.textContent = 'Saving...';
+
+      const result = await api('/api/settings', {
+        method: 'POST',
+        body: { anthropic_api_key: apiKey },
+      });
+
+      if (result.success) {
+        apiKeyInput.value = '';
+        await loadSettings();
+        await checkApiStatus();
+        alert('API key saved successfully!');
+      } else {
+        alert('Failed to save API key');
+      }
+    } catch (e) {
+      console.error('Failed to save API key', e);
+      alert('Error saving API key');
+    } finally {
+      saveApiKeyBtn.disabled = false;
+      saveApiKeyBtn.textContent = 'Save API Key';
+    }
+  });
+}
+
+if (clearApiKeyBtn) {
+  clearApiKeyBtn.addEventListener('click', async () => {
+    if (!confirm('Are you sure you want to clear the API key?')) return;
+
+    try {
+      clearApiKeyBtn.disabled = true;
+      await api('/api/settings', {
+        method: 'POST',
+        body: { anthropic_api_key: '' },
+      });
+      await loadSettings();
+      await checkApiStatus();
+    } catch (e) {
+      console.error('Failed to clear API key', e);
+    } finally {
+      clearApiKeyBtn.disabled = false;
+    }
+  });
+}
+
 // Initialize
 checkApiStatus();
 loadStats();

package/src/web/static/index.html

@@ -14,6 +14,7 @@
       <button class="nav-btn" data-view="entities">Entities</button>
       <button class="nav-btn" data-view="graph">Graph</button>
       <button class="nav-btn" data-view="consolidation">Consolidation</button>
+      <button class="nav-btn" data-view="settings">Settings</button>
     </nav>
     <div class="stats" id="stats"></div>
     <div class="api-status" id="api-status" title="Anthropic API Status">
@@ -59,6 +60,40 @@
       <div id="graph-container"></div>
     </section>
 
+    <!-- Settings View -->
+    <section id="settings-view" class="view">
+      <div class="settings-container">
+        <h2>Settings</h2>
+
+        <div class="settings-section">
+          <h3>API Configuration</h3>
+          <p class="section-desc">Configure your Anthropic API key to enable Chat and Consolidation features.</p>
+
+          <div class="settings-row" id="api-key-status">
+            <label>Status:</label>
+            <span class="status-badge" id="api-status-badge">Checking...</span>
+          </div>
+
+          <div class="settings-row">
+            <label for="api-key-input">API Key:</label>
+            <div class="input-group">
+              <input type="password" id="api-key-input" placeholder="sk-ant-api03-..." autocomplete="off">
+              <button type="button" id="toggle-key-visibility" title="Show/hide">👁</button>
+            </div>
+          </div>
+
+          <div class="settings-row">
+            <button id="save-api-key" class="primary-btn">Save API Key</button>
+            <button id="clear-api-key" class="danger-btn">Clear</button>
+          </div>
+
+          <p class="help-text">
+            Get your API key from <a href="https://console.anthropic.com/settings/keys" target="_blank">console.anthropic.com</a>
+          </p>
+        </div>
+      </div>
+    </section>
+
     <!-- Consolidation View -->
     <section id="consolidation-view" class="view">
       <div class="consolidation-header">

package/src/web/static/style.css

@@ -11,11 +11,18 @@
   --text-secondary: #5c5c5c;
   --text-muted: #8c8c8c;
   --border: #d4d0c8;
+  --border-hover: #b8b4ac;
   --accent: #d97706;
   --accent-hover: #b45309;
+  --accent-subtle: rgba(217, 119, 6, 0.1);
   --success: #059669;
+  --success-subtle: rgba(5, 150, 105, 0.1);
   --danger: #dc2626;
+  --danger-subtle: rgba(220, 38, 38, 0.1);
   --shadow: rgba(0, 0, 0, 0.06);
+  --shadow-lg: rgba(0, 0, 0, 0.1);
+  --radius: 3px;
+  --transition: 0.15s ease;
 }
 
 * {
@@ -54,30 +61,34 @@ h2 {
 header {
   display: flex;
   align-items: center;
-  gap: 2rem;
-  padding: 1.5rem 2rem;
+  gap: 1.5rem;
+  padding: 1rem 1.5rem;
   background: var(--bg-secondary);
   border-bottom: 1px solid var(--border);
 }
 
 header h1 {
   color: var(--text-primary);
+  font-size: 1.25rem;
+  font-weight: 600;
+  letter-spacing: -0.01em;
 }
 
 nav {
   display: flex;
-  gap: 0.5rem;
+  gap: 0.25rem;
 }
 
 .nav-btn {
   font-family: inherit;
-  font-size: 0.875rem;
-  padding: 0.5rem 1rem;
+  font-size: 0.8125rem;
+  padding: 0.5rem 0.875rem;
   background: transparent;
   border: 1px solid transparent;
+  border-radius: var(--radius);
   color: var(--text-secondary);
   cursor: pointer;
-  transition: all 0.15s ease;
+  transition: all var(--transition);
 }
 
 .nav-btn:hover {
@@ -87,8 +98,9 @@ nav {
 
 .nav-btn.active {
   color: var(--text-primary);
-  border-color: var(--border);
   background: var(--bg-primary);
+  border-color: var(--border);
+  box-shadow: 0 1px 2px var(--shadow);
 }
 
 .stats {
@@ -102,12 +114,14 @@ nav {
 .api-status {
   display: flex;
   align-items: center;
-  gap: 0.375rem;
+  gap: 0.5rem;
   font-size: 0.75rem;
   color: var(--text-muted);
-  padding: 0.25rem 0.625rem;
+  padding: 0.375rem 0.75rem;
   background: var(--bg-tertiary);
-  border-radius: 2px;
+  border-radius: var(--radius);
+  border: 1px solid transparent;
+  transition: all var(--transition);
 }
 
 .api-dot {
@@ -115,16 +129,36 @@ nav {
   height: 8px;
   border-radius: 50%;
   background: var(--text-muted);
-  transition: background 0.2s ease;
+  transition: all var(--transition);
+  flex-shrink: 0;
+}
+
+.api-status.connected {
+  background: var(--success-subtle);
+  border-color: var(--success);
 }
 
 .api-status.connected .api-dot {
   background: var(--success);
-  box-shadow: 0 0 4px var(--success);
+  box-shadow: 0 0 6px var(--success);
+}
+
+.api-status.connected .api-label {
+  color: var(--success);
+}
+
+.api-status.disconnected {
+  background: var(--danger-subtle);
+  border-color: var(--danger);
 }
 
 .api-status.disconnected .api-dot {
   background: var(--danger);
+  box-shadow: 0 0 6px var(--danger);
+}
+
+.api-status.disconnected .api-label {
+  color: var(--danger);
 }
 
 .api-status.checking .api-dot {
@@ -155,23 +189,26 @@ main {
 /* Search bar */
 .search-bar {
   display: flex;
-  gap: 0.75rem;
+  gap: 0.5rem;
   margin-bottom: 1.5rem;
 }
 
 .search-bar input {
   flex: 1;
   font-family: inherit;
-  font-size: 1rem;
-  padding: 0.75rem 1rem;
+  font-size: 0.9375rem;
+  padding: 0.625rem 1rem;
   border: 1px solid var(--border);
+  border-radius: var(--radius);
   background: var(--bg-secondary);
   color: var(--text-primary);
+  transition: all var(--transition);
 }
 
 .search-bar input:focus {
   outline: none;
   border-color: var(--accent);
+  box-shadow: 0 0 0 2px var(--accent-subtle);
 }
 
 .search-bar input::placeholder {
@@ -181,22 +218,33 @@ main {
 /* Buttons */
 button {
   font-family: inherit;
-  font-size: 0.875rem;
-  padding: 0.625rem 1.25rem;
+  font-size: 0.8125rem;
+  font-weight: 500;
+  padding: 0.5rem 1rem;
   background: var(--text-primary);
   color: var(--bg-primary);
-  border: none;
+  border: 1px solid transparent;
+  border-radius: var(--radius);
   cursor: pointer;
-  transition: background 0.15s ease;
+  transition: all var(--transition);
 }
 
 button:hover {
   background: var(--text-secondary);
+  transform: translateY(-1px);
+  box-shadow: 0 2px 4px var(--shadow);
+}
+
+button:active {
+  transform: translateY(0);
+  box-shadow: none;
 }
 
 button:disabled {
   opacity: 0.5;
   cursor: not-allowed;
+  transform: none;
+  box-shadow: none;
 }
 
 .toolbar {
@@ -237,18 +285,20 @@ button:disabled {
 .list {
   display: flex;
   flex-direction: column;
-  gap: 1rem;
+  gap: 0.75rem;
 }
 
 .list-item {
   background: var(--bg-secondary);
   border: 1px solid var(--border);
-  padding: 1.25rem 1.5rem;
-  transition: border-color 0.15s ease;
+  border-radius: var(--radius);
+  padding: 1rem 1.25rem;
+  transition: all var(--transition);
 }
 
 .list-item:hover {
-  border-color: var(--text-muted);
+  border-color: var(--border-hover);
+  box-shadow: 0 2px 8px var(--shadow);
 }
 
 .memory-item .content {
@@ -488,10 +538,12 @@ button:disabled {
 
 /* Chat toggle button */
 .chat-toggle {
-  margin-left: 1rem;
+  margin-left: auto;
   background: var(--accent);
-  font-size: 0.8125rem;
+  font-size: 0.75rem;
+  font-weight: 600;
   padding: 0.5rem 1rem;
+  letter-spacing: 0.02em;
 }
 
 .chat-toggle:hover {
@@ -502,21 +554,27 @@ button:disabled {
   background: var(--text-primary);
 }
 
+.chat-toggle.disabled {
+  background: var(--text-muted);
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+
 /* Chat panel */
 .chat-panel {
   position: fixed;
   top: 0;
   right: 0;
-  width: 400px;
+  width: 380px;
   height: 100vh;
   background: var(--bg-primary);
   border-left: 1px solid var(--border);
   display: flex;
   flex-direction: column;
-  box-shadow: -4px 0 20px var(--shadow);
+  box-shadow: -8px 0 32px var(--shadow-lg);
   z-index: 100;
   transform: translateX(0);
-  transition: transform 0.2s ease;
+  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
 }
 
 .chat-panel.hidden {
@@ -529,37 +587,50 @@ button:disabled {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 1rem 1.25rem;
+  padding: 0.875rem 1rem;
   background: var(--bg-secondary);
   border-bottom: 1px solid var(--border);
 }
 
 .chat-header h3 {
-  font-size: 1rem;
-  font-weight: 500;
+  font-size: 0.9375rem;
+  font-weight: 600;
+  letter-spacing: -0.01em;
 }
 
 .chat-actions {
   display: flex;
-  gap: 0.5rem;
+  align-items: center;
+  gap: 0.375rem;
 }
 
 .chat-actions button {
-  font-size: 0.75rem;
+  font-size: 0.6875rem;
+  font-weight: 500;
   padding: 0.375rem 0.625rem;
   background: var(--bg-tertiary);
   color: var(--text-secondary);
+  border-radius: var(--radius);
 }
 
 .chat-actions button:hover {
   background: var(--border);
   color: var(--text-primary);
+  transform: none;
+  box-shadow: none;
 }
 
 #chat-close {
-  font-size: 1.25rem;
+  font-size: 1.125rem;
   padding: 0.25rem 0.5rem;
   line-height: 1;
+  background: transparent;
+  color: var(--text-muted);
+}
+
+#chat-close:hover {
+  background: var(--danger-subtle);
+  color: var(--danger);
 }
 
 .chat-messages {
@@ -568,21 +639,22 @@ button:disabled {
   padding: 1rem;
   display: flex;
   flex-direction: column;
-  gap: 1rem;
+  gap: 0.75rem;
 }
 
 .chat-message {
-  padding: 0.875rem 1rem;
-  font-size: 0.9375rem;
+  padding: 0.75rem 1rem;
+  font-size: 0.875rem;
   line-height: 1.6;
-  max-width: 90%;
+  max-width: 88%;
+  border-radius: var(--radius);
 }
 
 .chat-message.user {
   background: var(--accent);
   color: white;
   align-self: flex-end;
-  border-radius: 2px;
+  box-shadow: 0 2px 4px rgba(217, 119, 6, 0.2);
 }
 
 .chat-message.assistant {
@@ -685,7 +757,7 @@ button:disabled {
 .chat-input-form {
   display: flex;
   gap: 0.5rem;
-  padding: 1rem;
+  padding: 0.875rem 1rem;
   background: var(--bg-secondary);
   border-top: 1px solid var(--border);
 }
@@ -693,16 +765,19 @@ button:disabled {
 .chat-input-form input {
   flex: 1;
   font-family: inherit;
-  font-size: 0.9375rem;
-  padding: 0.625rem 0.875rem;
+  font-size: 0.875rem;
+  padding: 0.5rem 0.75rem;
   border: 1px solid var(--border);
+  border-radius: var(--radius);
   background: var(--bg-primary);
   color: var(--text-primary);
+  transition: border-color var(--transition);
 }
 
 .chat-input-form input:focus {
   outline: none;
   border-color: var(--accent);
+  box-shadow: 0 0 0 2px var(--accent-subtle);
 }
 
 .chat-input-form input:disabled {
@@ -717,6 +792,7 @@ button:disabled {
 
 .chat-input-form button {
   background: var(--accent);
+  padding: 0.5rem 0.875rem;
 }
 
 .chat-input-form button:hover {
@@ -725,11 +801,13 @@ button:disabled {
 
 .chat-input-form button:disabled {
   background: var(--text-muted);
+  transform: none;
+  box-shadow: none;
 }
 
 /* Adjust main content when chat is open */
 body.chat-open main {
-  margin-right: 400px;
+  margin-right: 380px;
 }
 
 /* Consolidation View */
@@ -978,6 +1056,128 @@ body.chat-open main {
   color: var(--text-primary);
 }
 
+/* Settings View */
+.settings-container {
+  max-width: 600px;
+}
+
+.settings-section {
+  background: var(--bg-secondary);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  padding: 1.5rem;
+  margin-bottom: 1.5rem;
+}
+
+.settings-section h3 {
+  font-size: 1rem;
+  font-weight: 600;
+  margin-bottom: 0.5rem;
+}
+
+.settings-row {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  margin: 1rem 0;
+}
+
+.settings-row label {
+  font-size: 0.875rem;
+  color: var(--text-secondary);
+  min-width: 80px;
+}
+
+.input-group {
+  display: flex;
+  flex: 1;
+  gap: 0.5rem;
+}
+
+.input-group input {
+  flex: 1;
+  font-family: "SF Mono", Monaco, monospace;
+  font-size: 0.875rem;
+  padding: 0.5rem 0.75rem;
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  background: var(--bg-primary);
+  color: var(--text-primary);
+}
+
+.input-group input:focus {
+  outline: none;
+  border-color: var(--accent);
+  box-shadow: 0 0 0 2px var(--accent-subtle);
+}
+
+.input-group button {
+  padding: 0.5rem 0.75rem;
+  background: var(--bg-tertiary);
+  color: var(--text-secondary);
+  font-size: 0.875rem;
+}
+
+.input-group button:hover {
+  background: var(--border);
+  transform: none;
+  box-shadow: none;
+}
+
+.primary-btn {
+  background: var(--accent) !important;
+  color: white !important;
+}
+
+.primary-btn:hover {
+  background: var(--accent-hover) !important;
+}
+
+.danger-btn {
+  background: var(--bg-tertiary) !important;
+  color: var(--text-secondary) !important;
+}
+
+.danger-btn:hover {
+  background: var(--danger) !important;
+  color: white !important;
+}
+
+.status-badge {
+  display: inline-block;
+  font-size: 0.75rem;
+  font-weight: 500;
+  padding: 0.25rem 0.625rem;
+  border-radius: var(--radius);
+  background: var(--bg-tertiary);
+  color: var(--text-muted);
+}
+
+.status-badge.configured {
+  background: var(--success-subtle);
+  color: var(--success);
+}
+
+.status-badge.not-configured {
+  background: var(--danger-subtle);
+  color: var(--danger);
+}
+
+.help-text {
+  font-size: 0.8125rem;
+  color: var(--text-muted);
+  margin-top: 1rem;
+}
+
+.help-text a {
+  color: var(--accent);
+  text-decoration: none;
+}
+
+.help-text a:hover {
+  text-decoration: underline;
+}
+
 /* Responsive */
 @media (max-width: 640px) {
   header {