feat: add AI-powered Insights with multi-agent generation (#16)

## Summary

- **Insights feature** for AI-generated analysis of agent sessions,
supporting Claude, Codex, and Gemini as generation backends
- Full-stack: `insights` SQLite table with FTS5, Go HTTP handlers
(`GET/DELETE /api/v1/insights/{id}`, `POST /api/v1/insights/generate`
with SSE streaming), prompt builder with session context, and
multi-agent CLI dispatch
- **Date range analysis**: insights can cover a single day or a date
range (e.g., a week). DB schema uses `date_from`/`date_to` columns. The
generate endpoint validates both fields and supports `date_to >=
date_from`
- **Mode-driven UI**: type selector with three modes -- Daily Activity
(single date), Date Range Activity (from/to inputs with 7-day and 30-day
presets), and Agent Analysis (single date). Mode is derived reactively
from store state
- Svelte 5 Insights page with sidebar controls (type, date, project,
agent), concurrent generation tasks with live status spinners, date
display on in-progress tasks, and markdown content viewer with delete
support
- **Structured API errors**: `ApiError` class with `status` field for
programmatic error handling; empty response bodies fall back to `"API
<status>"` message
- **ListInsights capped at 500 rows** with `created_at DESC` index to
prevent unbounded queries
- `internal/insight` package: prompt construction from session data with
date-aware text ("Date" vs "Date Range"), streaming response parsing for
Claude/Codex/Gemini CLI output
- **Session breadcrumb bar** showing project name, agent badge
(color-coded), and session start time
- **Header navigation** with always-visible Sessions/Insights buttons
and active state highlighting
- Design polish: Inter font, refined color tokens for light/dark themes,
tighter typography and spacing

## Test plan

- [x] `go test -tags fts5 ./...` -- all Go tests pass (insights CRUD,
filters, 500-row cap, date range round-trip, prompt builder with
single/range dates, server handler validation)
- [x] `npx vitest run` -- all 360 frontend tests pass (insights store,
date sync, mode switching, generate payloads, ApiError handling with
empty-body fallback)
- [x] `npx tsc --noEmit` -- no type errors
- [x] `go vet ./...` -- clean
- [ ] Manual: generate a Daily Activity insight, verify single date in
list and content header
- [ ] Manual: switch to Date Range Activity, verify from/to inputs and
presets appear, generate and verify range displays
- [ ] Manual: verify all insights appear in the list regardless of
selected generation dates
- [ ] Manual: verify in-progress task items show the date being analyzed
- [ ] Manual: delete an insight, verify removal from list and content
area

Generated with [Claude Code](https://claude.com/claude-code)

---------

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>

Author: wesm

.roborev.toml

@@ -0,0 +1,33 @@
+[review_guidelines]
+
+threat_model = """
+agentsview is a LOCAL-ONLY developer tool. It binds to 127.0.0.1
+by default and is not designed for multi-user or public deployment.
+
+Key assumptions reviewers MUST account for:
+
+1. NO AUTHENTICATION NEEDED: All API endpoints are unauthenticated
+   by design. The server listens on localhost only. Flagging missing
+   auth on any endpoint is a false positive.
+
+2. XSS / SANITIZATION: Markdown rendering uses DOMPurify. The
+   {@html renderMarkdown(...)} pattern in Svelte is intentional and
+   safe because renderMarkdown() sanitizes via DOMPurify before
+   returning HTML. Do not flag this as XSS.
+
+3. RATE LIMITING / DoS: As a local single-user tool, rate limiting
+   and concurrency caps are unnecessary. The 10-minute timeout on
+   AI CLI generation is intentional. Do not flag missing rate limits.
+
+4. CORS: The CORS policy uses Allow-Origin: * because the embedded
+   SPA is served from the same origin. Cross-origin access from
+   other local tools is acceptable for a localhost-only service.
+
+5. INPUT VALIDATION: Request body size limits are not required for
+   a localhost-only service. Do not flag missing MaxBytesReader or
+   similar unless the endpoint is exposed to untrusted networks.
+
+Do NOT flag issues that only apply to public-facing, multi-tenant,
+or network-exposed services. Focus on bugs, logic errors, data
+corruption risks, and code quality issues.
+"""

frontend/index.html

@@ -6,7 +6,7 @@
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400..700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
     <title>AgentsView</title>
   </head>
   <body>

frontend/src/App.svelte

@@ -9,6 +9,7 @@
   import ShortcutsModal from "./lib/components/modals/ShortcutsModal.svelte";
   import PublishModal from "./lib/components/modals/PublishModal.svelte";
   import AnalyticsPage from "./lib/components/analytics/AnalyticsPage.svelte";
+  import InsightsPage from "./lib/components/insights/InsightsPage.svelte";
   import { sessions } from "./lib/stores/sessions.svelte.js";
   import { messages } from "./lib/stores/messages.svelte.js";
   import { sync } from "./lib/stores/sync.svelte.js";
@@ -150,19 +151,55 @@
 
 <AppHeader />
 
-<ThreeColumnLayout>
-  {#snippet sidebar()}
-    <SessionList />
-  {/snippet}
+{#if router.route === "insights"}
+  <InsightsPage />
+{:else}
+  <ThreeColumnLayout>
+    {#snippet sidebar()}
+      <SessionList />
+    {/snippet}
 
-  {#snippet content()}
-    {#if sessions.activeSessionId}
-      <MessageList bind:this={messageListRef} />
-    {:else}
-      <AnalyticsPage />
-    {/if}
-  {/snippet}
-</ThreeColumnLayout>
+    {#snippet content()}
+      {#if sessions.activeSessionId}
+        {@const session = sessions.activeSession}
+        <div class="session-breadcrumb">
+          <button
+            class="breadcrumb-link"
+            onclick={() => sessions.deselectSession()}
+          >Sessions</button>
+          <span class="breadcrumb-sep">/</span>
+          <span class="breadcrumb-current">
+            {session?.project ?? ""}
+          </span>
+          {#if session}
+            <span class="breadcrumb-meta">
+              <span
+                class="agent-badge"
+                class:agent-claude={session.agent === "claude"}
+                class:agent-codex={session.agent === "codex"}
+              >{session.agent}</span>
+              {#if session.started_at}
+                <span class="session-time">
+                  {new Date(session.started_at).toLocaleDateString(undefined, {
+                    month: "short",
+                    day: "numeric",
+                  })}
+                  {new Date(session.started_at).toLocaleTimeString(undefined, {
+                    hour: "2-digit",
+                    minute: "2-digit",
+                  })}
+                </span>
+              {/if}
+            </span>
+          {/if}
+        </div>
+        <MessageList bind:this={messageListRef} />
+      {:else}
+        <AnalyticsPage />
+      {/if}
+    {/snippet}
+  </ThreeColumnLayout>
+{/if}
 
 <StatusBar />
 
@@ -177,3 +214,80 @@
 {#if ui.activeModal === "publish"}
   <PublishModal />
 {/if}
+
+<style>
+  .session-breadcrumb {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    height: 32px;
+    padding: 0 14px;
+    border-bottom: 1px solid var(--border-muted);
+    flex-shrink: 0;
+    font-size: 11px;
+    color: var(--text-muted);
+  }
+
+  .breadcrumb-link {
+    color: var(--text-muted);
+    font-size: 11px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: color 0.12s;
+  }
+
+  .breadcrumb-link:hover {
+    color: var(--accent-blue);
+  }
+
+  .breadcrumb-sep {
+    opacity: 0.3;
+    font-size: 10px;
+  }
+
+  .breadcrumb-current {
+    color: var(--text-primary);
+    font-weight: 500;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    flex: 1;
+    min-width: 0;
+  }
+
+  .breadcrumb-meta {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    margin-left: auto;
+    flex-shrink: 0;
+  }
+
+  .agent-badge {
+    font-size: 9px;
+    font-weight: 600;
+    padding: 1px 6px;
+    border-radius: 8px;
+    text-transform: uppercase;
+    letter-spacing: 0.03em;
+    color: white;
+    flex-shrink: 0;
+    background: var(--text-muted);
+  }
+
+  .agent-claude {
+    background: var(--accent-blue);
+  }
+
+  .agent-codex {
+    background: var(--accent-green);
+  }
+
+  .session-time {
+    font-size: 10px;
+    color: var(--text-muted);
+    font-variant-numeric: tabular-nums;
+    white-space: nowrap;
+    flex-shrink: 0;
+  }
+</style>

frontend/src/app.css

@@ -9,15 +9,15 @@
 
 /* Light theme (default) — cool, high-contrast, readable */
 :root {
-  --bg-primary: #f7f7fa;
+  --bg-primary: #f5f6f8;
   --bg-surface: #ffffff;
-  --bg-surface-hover: #f0f1f5;
-  --bg-inset: #edeef3;
-  --border-default: #dfe1e8;
-  --border-muted: #e8eaf0;
-  --text-primary: #1a1d26;
-  --text-secondary: #5a6070;
-  --text-muted: #8b92a0;
+  --bg-surface-hover: #f0f1f4;
+  --bg-inset: #ecedf2;
+  --border-default: #d8dae2;
+  --border-muted: #e4e6ec;
+  --text-primary: #181b24;
+  --text-secondary: #555b6e;
+  --text-muted: #878ea0;
   --accent-blue: #2563eb;
   --accent-purple: #7c3aed;
   --accent-amber: #d97706;
@@ -29,13 +29,14 @@
   --tool-bg: #fffbf0;
   --code-bg: #1e1e2e;
   --code-text: #cdd6f4;
-  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
-  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.06);
+  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
+  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.08);
+  --shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.1);
   --radius-sm: 4px;
   --radius-md: 6px;
   --radius-lg: 8px;
-  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI",
-    "Noto Sans", Helvetica, Arial, sans-serif;
+  --font-sans: "Inter", -apple-system, BlinkMacSystemFont,
+    "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif;
   --font-mono: "JetBrains Mono", "SF Mono", "Fira Code",
     "Fira Mono", Menlo, Consolas, monospace;
   --viewport-indicator: rgba(0, 0, 0, 0.08);
@@ -45,15 +46,15 @@
 
 /* Dark theme */
 :root.dark {
-  --bg-primary: #0c0c10;
-  --bg-surface: #15151b;
-  --bg-surface-hover: #1e1e28;
-  --bg-inset: #101015;
-  --border-default: #2a2a35;
-  --border-muted: #222230;
-  --text-primary: #e2e4e9;
-  --text-secondary: #9ca3af;
-  --text-muted: #6b7280;
+  --bg-primary: #0d0d12;
+  --bg-surface: #16161e;
+  --bg-surface-hover: #1f1f2a;
+  --bg-inset: #111116;
+  --border-default: #2b2b38;
+  --border-muted: #232330;
+  --text-primary: #e4e6eb;
+  --text-secondary: #9ea5b4;
+  --text-muted: #6c7385;
   --accent-blue: #60a5fa;
   --accent-purple: #a78bfa;
   --accent-amber: #fbbf24;
@@ -65,8 +66,9 @@
   --tool-bg: #1a1508;
   --code-bg: #0d0d14;
   --code-text: #cdd6f4;
-  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
-  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.3);
+  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.25);
+  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.35);
+  --shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.4);
   --viewport-indicator: rgba(255, 255, 255, 0.08);
   --overlay-bg: rgba(0, 0, 0, 0.6);
   color-scheme: dark;
@@ -77,12 +79,14 @@ body {
   height: 100%;
   overflow: hidden;
   font-family: var(--font-sans);
-  font-size: 14px;
+  font-size: 13px;
   line-height: 1.5;
   color: var(--text-primary);
   background: var(--bg-primary);
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
+  font-feature-settings: "cv11", "ss01";
+  text-rendering: optimizeLegibility;
 }
 
 #app {