total-recall-brain 3.28.2 → 3.30.0

package/extension/icons/mark.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 400" fill="none">
+  <!-- Transparent vault arch mark — dark UI friendly -->
+  <path d="M 120 300 L 120 180 A 80 80 0 0 1 280 180 L 280 300 Z" fill="#93c5fd"/>
+  <path d="M 280 300 L 280 180 A 80 80 0 0 0 200 100 L 350 250 L 350 300 Z" fill="#1e40af" opacity="0.55"/>
+  <path d="M 150 300 L 150 180 A 50 50 0 0 1 250 180 L 250 300 Z" fill="#0b1220"/>
+</svg>

package/extension/lib/brain-client.js

@@ -1,99 +1,186 @@
-// Brain API Client for Total Recall Chrome Extension
-// Shared by background.js, popup, sidepanel, and options page.
-// Exposed as `self.BrainClient` namespace (no ES-module bundler required).
+// Total Recall — Brain API client
+// Shared by the service worker, side panel and options page (classic scripts,
+// no bundler), exposed as `self.BrainClient`.
+//
+// Every request carries `x-total-recall-brain` so search, capture, listing and
+// chat all act on the brain the user selected, not silently on the global one.
 
 (function () {
+  'use strict';
+
   const DEFAULT_BRAIN_URL = 'http://127.0.0.1:3000';
+  const DEFAULT_TIMEOUT_MS = 20000;
+  const CHAT_TIMEOUT_MS = 300000; // agent-routed answers with tool use can take minutes
+
+  class BrainError extends Error {
+    /** @param {'offline'|'unauthorized'|'forbidden'|'http'|'timeout'|'unconfigured'} code */
+    constructor(code, message, status) {
+      super(message);
+      this.name = 'BrainError';
+      this.code = code;
+      this.status = status || 0;
+    }
+  }
+
+  function normalizeUrl(raw) {
+    const url = String(raw || '').trim().replace(/\/+$/, '');
+    return url || DEFAULT_BRAIN_URL;
+  }
 
   async function getConfig() {
-    const [localConfig, syncConfig] = await Promise.all([
+    const [local, sync] = await Promise.all([
       chrome.storage.local.get(['brainUrl', 'pat']),
-      chrome.storage.sync.get(['brainUrl', 'pat'])
+      chrome.storage.sync.get(['brainUrl', 'pat', 'activeBrainId']),
     ]);
-    const pre = self.PreConfigured || {};
-    const config = {
-      brainUrl: localConfig.brainUrl || syncConfig.brainUrl,
-      pat: localConfig.pat || syncConfig.pat
-    };
 
-    if (syncConfig.pat && !localConfig.pat) {
-      await chrome.storage.local.set({ pat: syncConfig.pat });
-      await chrome.storage.sync.remove('pat');
+    // PATs belong in extension-local storage only; migrate any legacy synced copy.
+    if (sync.pat && !local.pat) {
+      await chrome.storage.local.set({ pat: sync.pat });
+      local.pat = sync.pat;
     }
+    if (sync.pat) await chrome.storage.sync.remove('pat');
 
     return {
-      brainUrl: config.brainUrl || pre.brainUrl || DEFAULT_BRAIN_URL,
-      pat: config.pat || pre.pat || ''
+      brainUrl: normalizeUrl(local.brainUrl || sync.brainUrl),
+      pat: local.pat || '',
+      activeBrainId: sync.activeBrainId || 'global',
     };
   }
 
-  async function brainFetch(path, options = {}) {
-    const { brainUrl, pat } = await getConfig();
-    const url = `${brainUrl}${path}`;
-    const headers = { 'Content-Type': 'application/json', ...options.headers };
-    if (pat) headers['Authorization'] = `Bearer ${pat}`;
-
-    const res = await fetch(url, { ...options, headers });
-    if (res.status === 401) {
+  function setAuthBadge(broken) {
+    if (!chrome.action) return;
+    if (broken) {
+      chrome.action.setBadgeBackgroundColor({ color: '#f87171' });
       chrome.action.setBadgeText({ text: '!' });
-      chrome.action.setBadgeBackgroundColor({ color: '#ef4444' });
-      throw new Error('Authentication failed — check your PAT token');
+      chrome.action.setTitle({ title: 'Total Recall: sign-in needed. Check your access token in Settings.' });
+    } else {
+      chrome.action.getBadgeText({}).then((text) => {
+        if (text === '!') chrome.action.setBadgeText({ text: '' });
+      }).catch(() => {});
+      chrome.action.setTitle({ title: 'Open Total Recall' });
     }
-    if (!res.ok) throw new Error(`Brain API error: ${res.status}`);
-    return res.json();
   }
 
-  async function share(data) {
-    return brainFetch('/api/share', { method: 'POST', body: JSON.stringify(data) });
-  }
+  /**
+   * @param {string} path
+   * @param {{method?: string, body?: any, timeoutMs?: number, brainScoped?: boolean, config?: object}} [opts]
+   */
+  async function request(path, opts = {}) {
+    const config = opts.config || await getConfig();
+    const headers = { Accept: 'application/json' };
+    if (opts.body !== undefined) headers['Content-Type'] = 'application/json';
+    if (config.pat) headers.Authorization = `Bearer ${config.pat}`;
+    if (opts.brainScoped !== false && config.activeBrainId && config.activeBrainId !== 'global') {
+      headers['x-total-recall-brain'] = config.activeBrainId;
+    }
 
-  async function search(query, topK = 3) {
-    return brainFetch('/api/memory/search/semantic', {
-      method: 'POST',
-      body: JSON.stringify({ query, top_k: topK })
-    });
-  }
+    const controller = new AbortController();
+    const timer = setTimeout(() => controller.abort(), opts.timeoutMs || DEFAULT_TIMEOUT_MS);
+    let res;
+    try {
+      res = await fetch(`${config.brainUrl}${path}`, {
+        method: opts.method || (opts.body !== undefined ? 'POST' : 'GET'),
+        headers,
+        body: opts.body !== undefined ? JSON.stringify(opts.body) : undefined,
+        signal: controller.signal,
+      });
+    } catch (err) {
+      if (err && err.name === 'AbortError') throw new BrainError('timeout', 'The brain took too long to answer.');
+      throw new BrainError('offline', `Can't reach the brain at ${config.brainUrl}.`);
+    } finally {
+      clearTimeout(timer);
+    }
 
-  async function healthCheck() {
-    return brainFetch('/health');
-  }
+    if (res.status === 401) {
+      setAuthBadge(true);
+      throw new BrainError(config.pat ? 'unauthorized' : 'unconfigured',
+        config.pat ? 'The brain rejected your access token.' : 'Add an access token in Settings to connect.', 401);
+    }
+    if (res.status === 403) {
+      throw new BrainError('forbidden', 'Your access token lacks the scope for this action.', 403);
+    }
 
-  async function chat(messages, options = {}) {
-    const { brainUrl, pat } = await getConfig();
-    const url = `${brainUrl}/v1/chat/completions`;
-    const headers = { 'Content-Type': 'application/json' };
-    if (pat) headers['Authorization'] = `Bearer ${pat}`;
-    if (options.sessionId) headers['x-session-id'] = options.sessionId;
-
-    const res = await fetch(url, {
-      method: 'POST',
-      headers,
-      body: JSON.stringify({
-        messages,
-        model: options.model || 'gemini',
-        brainId: options.brainId || 'global',
-        groundingNodes: options.groundingNodes || []
-      })
-    });
-    if (res.status === 401) throw new Error('Authentication failed — check your PAT token');
-    if (!res.ok) throw new Error(`Brain API error: ${res.status}`);
-    return res.json();
+    let data = null;
+    const text = await res.text();
+    if (text) {
+      try { data = JSON.parse(text); } catch { data = { raw: text }; }
+    }
+    if (!res.ok) {
+      const detail = (data && (data.error || data.message)) || `HTTP ${res.status}`;
+      throw new BrainError('http', detail, res.status);
+    }
+    setAuthBadge(false);
+    return data;
   }
 
-  // Self-heal stale storage: if preconfigured values exist, write them to extension-local storage.
-  try {
-    if (typeof chrome !== 'undefined' && chrome.storage && chrome.storage.local) {
-      chrome.storage.local.get(['brainUrl', 'pat']).then((config) => {
-        const pre = self.PreConfigured || {};
-        if (pre.pat && (!config.pat || config.pat !== pre.pat)) {
-          chrome.storage.local.set({ brainUrl: pre.brainUrl, pat: pre.pat });
-        }
+  // ---- Endpoints ----------------------------------------------------------
+
+  const api = {
+    health: (config) => request('/health', { config, brainScoped: false }),
+    extensionStatus: () => request('/api/extension/status', { brainScoped: false }),
+    listBrains: () => request('/api/brains', { brainScoped: false }),
+
+    async search(query, { topK = 8, includeSessions = false } = {}) {
+      try {
+        const data = await request('/api/memory/search/semantic', {
+          body: { query, top_k: topK, include_sessions: includeSessions },
+        });
+        return (data && data.results) || [];
+      } catch (err) {
+        // 503 = embeddings index not built yet: an empty result, not a failure.
+        if (err.code === 'http' && err.status === 503) return [];
+        throw err;
+      }
+    },
+
+    async listRecent(limit = 8) {
+      const data = await request(`/api/memory?sort=recent&limit=${limit}`);
+      const nodes = (data && data.nodes) || [];
+      // Older brains ignore sort=recent; order client-side as a fallback.
+      return nodes.slice().sort((a, b) => (Date.parse(b.created) || 0) - (Date.parse(a.created) || 0));
+    },
+
+    async findByUrl(url) {
+      const data = await request(`/api/memory?q=${encodeURIComponent(url)}&limit=5`);
+      return (data && data.nodes) || [];
+    },
+
+    share: (payload) => request('/api/share', { body: payload }),
+
+    chat(messages, { groundingNodes } = {}) {
+      // No `model` field: the brain routes with the user's runtime config. Naming a
+      // model here would override that routing for every extension request.
+      return request('/v1/chat/completions', {
+        body: { messages, groundingNodes: groundingNodes || [] },
+        timeoutMs: CHAT_TIMEOUT_MS,
+      }).then((data) => {
+        const choice = data && data.choices && data.choices[0];
+        return {
+          content: (choice && choice.message && choice.message.content) || '',
+          model: data && data.model,
+        };
       });
-    }
-  } catch (e) {
-    // Ignore in contexts where storage sync isn't available
-  }
+    },
+
+    async listResearch() {
+      // The server lists pending before in_progress; fetch enough to include every
+      // running item even behind a long queue.
+      const data = await request('/api/research?limit=500', { brainScoped: false });
+      return {
+        items: (data && (data.items || data.projects)) || [],
+        counts: (data && data.counts) || {},
+      };
+    },
+    queueResearch: (topic, notes) => request('/api/research', { body: { topic, notes: notes || '', via: 'extension' }, brainScoped: false }),
+    cancelResearch: (id) => request(`/api/research/${encodeURIComponent(id)}`, { method: 'DELETE', brainScoped: false }),
+
+    compile: () => request('/api/vault/compile', { method: 'POST', body: {}, timeoutMs: 120000 }),
+
+    async dashboardUrl(path = '/') {
+      const { brainUrl } = await getConfig();
+      return `${brainUrl}${path}`;
+    },
+  };
 
-  // Expose as a global namespace for non-module contexts (service worker, popup, etc.)
-  self.BrainClient = { getConfig, brainFetch, share, search, healthCheck, chat };
+  self.BrainClient = { DEFAULT_BRAIN_URL, BrainError, getConfig, normalizeUrl, request, ...api };
 })();

package/extension/lib/tokens.css

@@ -0,0 +1,187 @@
+/* Total Recall — extension design tokens.
+ * Mirrors the dashboard design system (frontend/src/index.css :root) so the
+ * extension reads as the same product. Change them together. */
+
+:root {
+  color-scheme: dark;
+
+  --bg-primary: #070b14;
+  --bg-secondary: #0c1220;
+  --bg-tertiary: #121a2b;
+  --bg-elevated: #172033;
+  --bg-hover: #1c2740;
+  --bg-active: #243352;
+
+  --accent: #3b82f6;
+  --accent-deep: #1e3a8a;
+  --accent-glow: rgba(59, 130, 246, 0.28);
+  --accent-hover: #60a5fa;
+  --accent-muted: rgba(59, 130, 246, 0.14);
+  --accent-soft: rgba(147, 197, 253, 0.12);
+
+  --success: #34d399;
+  --success-muted: rgba(52, 211, 153, 0.12);
+  --warning: #fbbf24;
+  --warning-muted: rgba(251, 191, 36, 0.12);
+  --error: #f87171;
+  --error-muted: rgba(248, 113, 113, 0.12);
+
+  --text-primary: #f1f5f9;
+  --text-secondary: #94a3b8;
+  --text-tertiary: #64748b;
+  --text-inverse: #070b14;
+
+  --border: rgba(148, 163, 184, 0.1);
+  --border-hover: rgba(148, 163, 184, 0.22);
+  --border-accent: rgba(59, 130, 246, 0.35);
+
+  --glass: rgba(12, 18, 32, 0.72);
+  --glass-border: rgba(148, 163, 184, 0.12);
+  --mesh-1: rgba(30, 58, 138, 0.35);
+  --mesh-2: rgba(59, 130, 246, 0.12);
+
+  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  --font-mono: 'JetBrains Mono', 'SF Mono', ui-monospace, Menlo, monospace;
+
+  --radius-sm: 8px;
+  --radius-md: 12px;
+  --radius-lg: 18px;
+
+  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
+  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.35);
+  --shadow-lg: 0 24px 64px rgba(0, 0, 0, 0.45);
+  --shadow-glow: 0 0 40px rgba(59, 130, 246, 0.18);
+
+  --transition-fast: 140ms cubic-bezier(0.23, 1, 0.32, 1);
+  --transition-normal: 220ms cubic-bezier(0.23, 1, 0.32, 1);
+}
+
+*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+
+html, body {
+  background: var(--bg-primary);
+  color: var(--text-primary);
+  font-family: var(--font-sans);
+  font-size: 13px;
+  line-height: 1.5;
+  -webkit-font-smoothing: antialiased;
+  text-rendering: optimizeLegibility;
+}
+
+body {
+  background:
+    radial-gradient(520px 280px at 0% -8%, var(--mesh-1), transparent 60%),
+    radial-gradient(420px 260px at 110% 0%, var(--mesh-2), transparent 55%),
+    var(--bg-primary);
+  background-attachment: fixed;
+}
+
+a { color: var(--accent-hover); text-decoration: none; }
+a:hover { color: var(--text-primary); }
+
+button, input, textarea, select { font: inherit; color: inherit; }
+button { cursor: pointer; background: none; border: 0; }
+button:disabled { cursor: default; }
+
+:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
+
+::selection { background: var(--accent-muted); color: var(--text-primary); }
+
+::-webkit-scrollbar { width: 6px; height: 6px; }
+::-webkit-scrollbar-track { background: transparent; }
+::-webkit-scrollbar-thumb { background: var(--bg-hover); border-radius: 3px; }
+::-webkit-scrollbar-thumb:hover { background: var(--text-tertiary); }
+
+.icon { width: 16px; height: 16px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
+.icon.sm { width: 14px; height: 14px; }
+.icon.lg { width: 20px; height: 20px; }
+
+/* Buttons */
+.btn {
+  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
+  height: 32px; padding: 0 12px; border-radius: var(--radius-sm);
+  font-size: 12.5px; font-weight: 600; letter-spacing: -0.005em; white-space: nowrap;
+  background: var(--bg-elevated); color: var(--text-primary); border: 1px solid var(--border);
+  transition: background var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);
+}
+.btn:hover:not(:disabled) { background: var(--bg-hover); border-color: var(--border-hover); }
+.btn:active:not(:disabled) { transform: translateY(1px); }
+.btn:disabled { opacity: 0.5; }
+.btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 6px 18px -8px var(--accent-glow); }
+.btn.primary:hover:not(:disabled) { background: var(--accent-hover); border-color: var(--accent-hover); }
+.btn.ghost { background: transparent; border-color: transparent; color: var(--text-secondary); }
+.btn.ghost:hover:not(:disabled) { background: var(--bg-hover); color: var(--text-primary); }
+.btn.danger { color: var(--error); }
+.btn.danger:hover:not(:disabled) { background: var(--error-muted); border-color: rgba(248, 113, 113, 0.3); }
+.btn.block { width: 100%; }
+.btn.is-busy { position: relative; color: transparent !important; pointer-events: none; }
+.btn.is-busy::after {
+  content: ''; position: absolute; width: 14px; height: 14px; border-radius: 50%;
+  border: 2px solid rgba(255, 255, 255, 0.35); border-top-color: #fff; animation: spin 0.7s linear infinite;
+}
+.btn:not(.primary).is-busy::after { border-color: var(--border-hover); border-top-color: var(--text-primary); }
+
+.icon-btn {
+  display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: var(--radius-sm);
+  color: var(--text-secondary); transition: background var(--transition-fast), color var(--transition-fast);
+}
+.icon-btn:hover:not(:disabled) { background: var(--bg-hover); color: var(--text-primary); }
+
+/* Fields */
+.input, .textarea, .select {
+  width: 100%; background: var(--bg-secondary); color: var(--text-primary);
+  border: 1px solid var(--border); border-radius: var(--radius-sm);
+  padding: 8px 10px; font-size: 13px; outline: none;
+  transition: border-color var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);
+}
+.input::placeholder, .textarea::placeholder { color: var(--text-tertiary); }
+.input:hover, .textarea:hover, .select:hover { border-color: var(--border-hover); }
+.input:focus, .textarea:focus, .select:focus { border-color: var(--border-accent); box-shadow: 0 0 0 3px var(--accent-muted); background: var(--bg-tertiary); }
+.textarea { resize: none; line-height: 1.5; }
+.select { appearance: none; padding-right: 30px; cursor: pointer;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
+  background-repeat: no-repeat; background-position: right 10px center; background-size: 14px; }
+
+/* Switch */
+.switch { position: relative; display: inline-block; width: 34px; height: 20px; flex: none; }
+.switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; z-index: 1; }
+.switch .track { position: absolute; inset: 0; border-radius: 999px; background: var(--bg-active); border: 1px solid var(--border-hover); transition: background var(--transition-fast), border-color var(--transition-fast); }
+.switch .track::after { content: ''; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: var(--text-secondary); transition: transform var(--transition-normal), background var(--transition-fast); }
+.switch input:checked + .track { background: var(--accent); border-color: var(--accent); }
+.switch input:checked + .track::after { transform: translateX(14px); background: #fff; }
+.switch input:focus-visible + .track { outline: 2px solid var(--accent); outline-offset: 2px; }
+.switch input:disabled + .track { opacity: 0.45; }
+
+/* Chips / badges */
+.chip {
+  display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 8px; border-radius: 999px;
+  font-size: 11px; font-weight: 600; letter-spacing: 0.01em;
+  background: var(--bg-elevated); color: var(--text-secondary); border: 1px solid var(--border);
+}
+.chip.accent { background: var(--accent-muted); color: var(--accent-hover); border-color: var(--border-accent); }
+.chip.success { background: var(--success-muted); color: var(--success); border-color: rgba(52, 211, 153, 0.25); }
+.chip.warning { background: var(--warning-muted); color: var(--warning); border-color: rgba(251, 191, 36, 0.25); }
+.chip.error { background: var(--error-muted); color: var(--error); border-color: rgba(248, 113, 113, 0.25); }
+
+.kbd {
+  display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 5px;
+  font-family: var(--font-mono); font-size: 10.5px; color: var(--text-tertiary);
+  background: var(--bg-tertiary); border: 1px solid var(--border); box-shadow: inset 0 -1px 0 var(--border);
+}
+
+.skeleton {
+  border-radius: var(--radius-sm);
+  background: linear-gradient(90deg, var(--bg-tertiary) 0%, var(--bg-elevated) 50%, var(--bg-tertiary) 100%);
+  background-size: 200% 100%; animation: shimmer 1.4s ease-in-out infinite;
+}
+
+.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
+
+@keyframes spin { to { transform: rotate(360deg); } }
+@keyframes shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
+@keyframes rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
+@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.45; } }
+
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
+}