iris-chatbot 4.0.0 → 5.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iris-chatbot",
-  "version": "4.0.0",
+  "version": "5.0.0",
   "private": false,
   "description": "One-command installer for the Iris project template.",
   "bin": {

package/template/docs/plan-projects-sidebar-ui.md

@@ -0,0 +1,11 @@
+# Projects plan – Sidebar UI addendum
+
+When implementing the Sidebar for Projects, apply these UI details:
+
+1. **Folder icon**
+   - **Remove** the folder icon from chat/thread rows (individual chats).
+   - **Add** the folder icon next to **project names** (each project in the project list, including "Inbox" if shown as a project).
+
+2. **"Your Chats" label**
+   - Use the exact label **'Your Chats'** (title case).
+   - Do **not** render it in all caps: remove the `uppercase` class from the section heading (currently in Sidebar around line 86: `text-[11px] uppercase tracking-[0.18em]` → use the same size/tracking but drop `uppercase`) so it displays as **Your Chats**, not "YOUR CHATS".

package/template/next-env.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-import "./.next/dev/types/routes.d.ts";
+import "./.next/types/routes.d.ts";
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

package/template/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "iris",
-  "version": "4.0.0",
+  "version": "5.0.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "iris",
-      "version": "4.0.0",
+      "version": "5.0.0",
       "dependencies": {
         "@anthropic-ai/sdk": "^0.72.1",
         "clsx": "^2.1.1",

package/template/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iris",
-  "version": "4.0.0",
+  "version": "5.0.0",
   "private": true,
   "description": "One-command installer for the Iris project template.",
   "engines": {

package/template/src/app/api/chat/route.ts

@@ -42,25 +42,26 @@ const LOCAL_TOOL_SYSTEM_INSTRUCTIONS = [
   "When the user asks for file, app, notes, music, web, calendar, or system actions, call tools directly.",
   "Default to execution instead of clarification. Ask at most one question only when a truly required value is missing.",
   "Calendar: You have direct access to the user's Apple Calendar via calendar_list_events and related tools. You CAN see their events—call the tools; do not say you cannot access or see their calendar. Never ask the user to paste their calendar, export it, or send a screenshot; you already have access. When they ask what's on the calendar, what's happening this/next weekend/month, or say 'check' or 'you can see', call calendar_list_events immediately with from/to for the range (e.g. next month → from: 'today', to: 'end of next month'; specific day → YYYY-MM-DD for both). Always pass calendar: 'all'. from/to support 'today', 'tomorrow', 'next week', 'end of next week', 'next month', 'end of next month'. Report the exact queried range from the tool result. For move/delete/reschedule: call calendar_list_events first to get uids. For rescheduling to a new time on the same calendar use calendar_update_event (preserves recurrence); for delete use calendar_delete_event; use calendar_move_event only when update is not sufficient (e.g. user says move and you need delete+recreate).",
+  "Files and Folders: You HAVE direct access to the user's files via file_list and file_find. Never say you cannot see, access, or list their files—call the tools. When the user asks 'what files do I have,' 'files from the last 7 days,' 'recent files,' or similar: call file_list immediately with path set to a folder (e.g. ~/Downloads, ~/Desktop, ~/Documents—or call once per root if you want all) and modifiedInLastDays: 7 (or the number of days they said). You have full file system access via file_list, file_mkdir, file_move, file_copy, file_delete_to_trash, file_batch_move, and file_find. When the user gives a folder or file name (e.g. 'us debt clock'), use file_find with searchPath '~' and the name as given. When moving MULTIPLE files, use file_batch_move with { operations: [ ... ] } or { destination, sources }. For organizing: file_find if location unknown, then file_list (use modifiedInLastDays for 'recent'), then file_mkdir/file_batch_move as needed. Never refuse file tasks or ask the user to use Finder manually—you have the tools.",
   "For iMessage/text requests, use messages_send; if contact matching is ambiguous, ask one concise clarification with candidate names.",
   "For media requests, assume Apple Music unless the user specifies otherwise.",
   "For note creation, write structured markdown with clear headings, bolded key labels, and tables when they improve clarity.",
   "If the user requests multiple actions in one prompt, execute every requested action sequentially before your final response.",
   "Do not stop after completing just one action when additional requested actions remain.",
   "For multi-step requests, prefer a single workflow tool call when available.",
-  "When tools are enabled, never claim you cannot access the user's device or calendar. You have calendar tools—use them; do not refuse or ask the user to paste/export/screenshot their calendar.",
+  "When tools are enabled, never claim you cannot access the user's device, calendar, or file system. You have the tools—use them; do not refuse or ask the user to do tasks manually that you can do with tools.",
   "After tool results arrive, provide a brief final answer and stop.",
   "Summarize tool activity in plain English and avoid raw JSON, stack traces, or script line numbers.",
   "Respect tool errors and provide clear next steps.",
 ].join(" ");
 
 const ACTION_VERB_PATTERN =
-  "create|make|write|play|set|add|remind|open|send|launch|start|pause|resume|focus";
+  "create|make|write|play|set|add|remind|open|send|launch|start|pause|resume|focus|move|copy|delete|organize|reorganize|restructure|split|separate|sort|categorize";
 const SEQUENCE_MARKER_PATTERN = "first|second|third|fourth|fifth|next|then|finally|lastly";
 const TOOL_INTENT_EXPLICIT_PATTERN =
   /\b(use|run|call)\s+(?:the\s+)?(?:local\s+)?tools?\b|\b(on my (?:mac|computer|device)|locally)\b/i;
 const TOOL_INTENT_LEADING_VERB_PATTERN =
-  /^(?:please\s+)?(?:(?:can|could|would)\s+you\s+)?(?:send|text|message|play|pause|resume|skip|next|previous|set|open|launch|focus|create|make|add|remind|search|find|list|move|copy|rename|delete|trash|append|write|read|start|stop)\b/i;
+  /^(?:please\s+)?(?:(?:can|could|would)\s+you\s+)?(?:send|text|message|play|pause|resume|skip|next|previous|set|open|launch|focus|create|make|add|remind|search|find|list|move|copy|rename|delete|trash|append|write|read|start|stop|organize|reorganize|restructure|split|separate|sort|categorize|put|place)(?:\s+|$)/i;
 const TOOL_INTENT_MESSAGING_PATTERN =
   /\b(text|message|imessage|sms|mail|email)\b[\s\S]{0,80}\b(send|text|message|email|mail)\b|\b(send|text|message|email|mail)\b[\s\S]{0,80}\b(text|message|imessage|sms|mail|email)\b/i;
 const TOOL_INTENT_NOTES_PATTERN =
@@ -70,7 +71,7 @@ const TOOL_INTENT_MUSIC_PATTERN =
 const TOOL_INTENT_SCHEDULE_PATTERN =
   /\b(calendar|event|reminder|schedule|events)\b[\s\S]{0,80}\b(create|add|list|show|set|remind|schedule|move|change|delete|reschedule|update|cancel|have|get|check)\b|\b(create|add|list|show|set|remind|schedule|move|change|delete|reschedule|update|cancel|have|get|check)\b[\s\S]{0,80}\b(calendar|event|reminder|schedule|events)\b|\b(move|reschedule|change|delete)\b[\s\S]{0,80}\b(event|meeting|appointment)\b|\b(what's happening|whats happening|what's on|whats on|next weekend|this weekend|you can see|just check)\b/i;
 const TOOL_INTENT_FILES_PATTERN =
-  /\b(file|folder|directory|path|document)\b[\s\S]{0,80}\b(list|find|search|move|copy|rename|delete|trash|create|make|mkdir|open)\b|\b(list|find|search|move|copy|rename|delete|trash|create|make|mkdir|open)\b[\s\S]{0,80}\b(file|folder|directory|path|document)\b/i;
+  /\b(file|folder|directory|path|document|subfolder|subfolders)\b[\s\S]{0,80}\b(list|find|search|move|copy|rename|delete|trash|create|make|mkdir|open|organize|reorganize|restructure|split|separate|sort|categorize|put|place|have|show|see|get)\b|\b(list|find|search|move|copy|rename|delete|trash|create|make|mkdir|open|organize|reorganize|restructure|split|separate|sort|categorize|put|place|have|show|see|get)\b[\s\S]{0,80}\b(file|folder|directory|path|document|subfolder|subfolders)\b|\b(organize|reorganize|restructure|split|separate)\b[\s\S]{0,80}\b(into|by|by type|by date|by name)\b|\b(put|move|place)\b[\s\S]{0,40}\b(into|in|inside)\b[\s\S]{0,40}\b(folder|directory)\b|\b(create|make)\b[\s\S]{0,40}\b(folders?|directories?)\b[\s\S]{0,40}\b(for|called|named)\b|\b(recent|last \d+|past \d+)\b[\s\S]{0,40}\b(files?|days?|weeks?)\b|\b(files?)\b[\s\S]{0,40}\b(from|in|within|during)\b[\s\S]{0,40}\b(last|past|recent|\d+)\b|\b(what|which|show|list|my)\b[\s\S]{0,40}\b(files?|documents?)\b/i;
 const TOOL_INTENT_APPS_PATTERN =
   /\b(app|application|window|url|website|browser|system)\b[\s\S]{0,80}\b(open|launch|focus|quit|set|mute|unmute|browse)\b|\b(open|launch|focus|quit|set|mute|unmute|browse)\b[\s\S]{0,80}\b(app|application|window|url|website|browser|system)\b/i;
 const TOOL_INTENT_NUMBERS_PATTERN =
@@ -86,8 +87,8 @@ function splitCompoundActionClauses(input: string): string[] {
   const roughParts = normalized.split(
     new RegExp(
       `\\s*(?:,|;|\\n)+\\s*(?=(?:(?:${SEQUENCE_MARKER_PATTERN})\\b|${ACTION_VERB_PATTERN}\\b))|` +
-        `\\s+(?:and then|and also|as well as|after that|plus|then|also|next|finally|lastly)\\s+|` +
-        `\\s+and\\s+(?=(?:${ACTION_VERB_PATTERN})\\b)`,
+      `\\s+(?:and then|and also|as well as|after that|plus|then|also|next|finally|lastly)\\s+|` +
+      `\\s+and\\s+(?=(?:${ACTION_VERB_PATTERN})\\b)`,
       "i",
     ),
   );
@@ -234,9 +235,9 @@ function normalizeRuntimeConnection(connection: ChatConnectionPayload): RuntimeC
       : "openai_compatible";
   const provider =
     kind === "builtin" &&
-    (connection.provider === "openai" ||
-      connection.provider === "anthropic" ||
-      connection.provider === "google")
+      (connection.provider === "openai" ||
+        connection.provider === "anthropic" ||
+        connection.provider === "google")
       ? connection.provider
       : undefined;
   const baseUrl =
@@ -264,9 +265,9 @@ function normalizeRuntimeConnection(connection: ChatConnectionPayload): RuntimeC
     apiKey,
     headers: Array.isArray(connection.headers)
       ? connection.headers.filter(
-          (header): header is { key: string; value: string } =>
-            Boolean(header) && typeof header.key === "string" && typeof header.value === "string",
-        )
+        (header): header is { key: string; value: string } =>
+          Boolean(header) && typeof header.key === "string" && typeof header.value === "string",
+      )
       : [],
     supportsTools,
   };
@@ -435,47 +436,47 @@ function sanitizeMemoryContext(
 
   const people = Array.isArray(aliases.people)
     ? aliases.people
-        .map((item) => {
-          const alias = typeof item?.alias === "string" ? item.alias.trim() : "";
-          const target = typeof item?.target === "string" ? item.target.trim() : "";
-          if (!alias || !target) {
-            return null;
-          }
-          return { alias, target };
-        })
-        .filter((item): item is { alias: string; target: string } => Boolean(item))
-        .slice(0, 16)
+      .map((item) => {
+        const alias = typeof item?.alias === "string" ? item.alias.trim() : "";
+        const target = typeof item?.target === "string" ? item.target.trim() : "";
+        if (!alias || !target) {
+          return null;
+        }
+        return { alias, target };
+      })
+      .filter((item): item is { alias: string; target: string } => Boolean(item))
+      .slice(0, 16)
     : [];
 
   const music = Array.isArray(aliases.music)
     ? aliases.music
-        .map((item) => {
-          const alias = typeof item?.alias === "string" ? item.alias.trim() : "";
-          const query = typeof item?.query === "string" ? item.query.trim() : "";
-          if (!alias || !query) {
-            return null;
-          }
-          const title =
-            typeof item?.title === "string" && item.title.trim()
-              ? item.title.trim()
-              : undefined;
-          const artist =
-            typeof item?.artist === "string" && item.artist.trim()
-              ? item.artist.trim()
-              : undefined;
-          return { alias, query, title, artist };
-        })
-        .filter(
-          (
-            item,
-          ): item is {
-            alias: string;
-            query: string;
-            title: string | undefined;
-            artist: string | undefined;
-          } => Boolean(item),
-        )
-        .slice(0, 16)
+      .map((item) => {
+        const alias = typeof item?.alias === "string" ? item.alias.trim() : "";
+        const query = typeof item?.query === "string" ? item.query.trim() : "";
+        if (!alias || !query) {
+          return null;
+        }
+        const title =
+          typeof item?.title === "string" && item.title.trim()
+            ? item.title.trim()
+            : undefined;
+        const artist =
+          typeof item?.artist === "string" && item.artist.trim()
+            ? item.artist.trim()
+            : undefined;
+        return { alias, query, title, artist };
+      })
+      .filter(
+        (
+          item,
+        ): item is {
+          alias: string;
+          query: string;
+          title: string | undefined;
+          artist: string | undefined;
+        } => Boolean(item),
+      )
+      .slice(0, 16)
     : [];
 
   return {
@@ -679,7 +680,7 @@ function humanizeToolErrorMessage(toolName: string, message: string): string {
   }
 
   if (normalized.includes("missing required")) {
-    const fieldMatch = cleaned.match(/missing required (?:string|numeric) field:\s*([a-zA-Z0-9_]+)/i);
+    const fieldMatch = cleaned.match(/missing required (?:string|numeric|array) field:\s*([a-zA-Z0-9_]+)/i);
     if (fieldMatch?.[1]) {
       return `Missing required field "${fieldMatch[1]}".`;
     }
@@ -1407,8 +1408,8 @@ async function tryDirectAutomationFastPath(params: {
       "Reminder";
     const title = sanitizeReminderTitle(
       rawTitle
-      .replace(/^(that|i have to|to|for)\s+/i, "")
-      .trim(),
+        .replace(/^(that|i have to|to|for)\s+/i, "")
+        .trim(),
     );
 
     return { title: title || "Reminder", due };
@@ -1715,18 +1716,18 @@ async function tryDirectAutomationFastPath(params: {
   const playResult =
     playOutput && typeof playOutput === "object"
       ? (playOutput as {
-          playing?: boolean;
-          matched?: boolean;
-          playlistName?: string | null;
-          title?: string | null;
-          artist?: string | null;
-          album?: string | null;
-          reason?: string | null;
-          matchedTitle?: string | null;
-          matchedArtist?: string | null;
-          catalogTitle?: string | null;
-          catalogArtist?: string | null;
-        })
+        playing?: boolean;
+        matched?: boolean;
+        playlistName?: string | null;
+        title?: string | null;
+        artist?: string | null;
+        album?: string | null;
+        reason?: string | null;
+        matchedTitle?: string | null;
+        matchedArtist?: string | null;
+        catalogTitle?: string | null;
+        catalogArtist?: string | null;
+      })
       : null;
 
   if (!playResult || playResult.playing !== true) {
@@ -1823,18 +1824,18 @@ async function tryDirectAutomationFastPath(params: {
   }
 
   params.send({
-      type: "token",
-      value:
-        hasNearbyMatch
-          ? `Started nearby match "${resolvedTitle}"${resolvedArtist ? ` by ${resolvedArtist}` : ""}. ${playResult.reason}`
-          : resolvedPlaylistName && intent.volume !== null
-            ? `**Done.** Playing playlist "${resolvedPlaylistName}" in Apple Music and set volume to ${intent.volume}%.`
-            : resolvedPlaylistName
-              ? `**Done.** Playing playlist "${resolvedPlaylistName}" in Apple Music.`
-          : intent.volume !== null
+    type: "token",
+    value:
+      hasNearbyMatch
+        ? `Started nearby match "${resolvedTitle}"${resolvedArtist ? ` by ${resolvedArtist}` : ""}. ${playResult.reason}`
+        : resolvedPlaylistName && intent.volume !== null
+          ? `**Done.** Playing playlist "${resolvedPlaylistName}" in Apple Music and set volume to ${intent.volume}%.`
+          : resolvedPlaylistName
+            ? `**Done.** Playing playlist "${resolvedPlaylistName}" in Apple Music.`
+            : intent.volume !== null
               ? `**Done.** Playing "${resolvedTitle}"${resolvedArtist ? ` by ${resolvedArtist}` : ""} in Apple Music and set volume to ${intent.volume}%.`
               : `**Done.** Playing "${resolvedTitle}"${resolvedArtist ? ` by ${resolvedArtist}` : ""} in Apple Music.`,
-    });
+  });
   return true;
 }
 
@@ -2159,12 +2160,12 @@ async function runToolOrchestrator(params: {
         const approval = createApprovalRequest();
         params.send({
           type: "approval_requested",
-            approvalId: approval.approvalId,
-            callId: call.id,
-            name: call.name,
-            args: callInput,
-            reason: summarizeApprovalReason(call.name, callInput),
-          });
+          approvalId: approval.approvalId,
+          callId: call.id,
+          name: call.name,
+          args: callInput,
+          reason: summarizeApprovalReason(call.name, callInput),
+        });
 
         emitThinkingUpdate(`Waiting for approval to run ${call.name}.`);
         const decision = await approval.promise;

package/template/src/app/globals.css

@@ -3,7 +3,7 @@
 
 :root {
   --topbar-height: 64px;
-  --bg: #171819;
+  --bg: #212121;
   --bg-alt: #1b1c1d;
   --sidebar: #181818;
   --sidebar-border: #202020;
@@ -15,6 +15,7 @@
   --text-muted: #b1b7bf;
   --accent: #10a37f;
   --accent-2: #0e8e6f;
+  --accent-ring: var(--accent-2);
   --danger: #ef4444;
   --border: #2a2a2a;
   --border-strong: #3a3a3a;
@@ -48,6 +49,21 @@ a {
   color: var(--accent);
 }
 
+input:focus,
+select:focus,
+textarea:focus,
+button:focus {
+  outline: none;
+}
+
+input:focus-visible,
+select:focus-visible,
+textarea:focus-visible,
+button:focus-visible {
+  outline: none;
+  box-shadow: inset 0 0 0 1px var(--border-strong);
+}
+
 .chat-shell {
   display: grid;
   grid-template-columns: 248px minmax(0, 1fr);
@@ -82,10 +98,21 @@ a {
   background: transparent !important;
   backdrop-filter: none;
   box-shadow: none;
-  position: sticky;
+  position: absolute;
   top: 0;
+  left: 0;
+  right: 0;
   z-index: 40;
   height: var(--topbar-height);
+  pointer-events: none;
+}
+
+.topbar > *,
+.topbar button,
+.topbar a,
+.topbar [role="listbox"],
+.topbar [role="option"] {
+  pointer-events: auto;
 }
 
 
@@ -249,7 +276,7 @@ a {
 }
 
 .assistant-card .message-content {
-  color: #f8fafc;
+  color: var(--text-primary);
 }
 
 .message-loading-spinner {
@@ -271,7 +298,7 @@ a {
 .composer-bar {
   position: sticky;
   bottom: 0;
-  background: transparent;
+  background: var(--bg);
   z-index: 30;
 }
 
@@ -299,13 +326,14 @@ a {
   --sidebar: #ffffff;
   --sidebar-border: #e5e5e5;
   --panel: #ffffff;
-  --panel-2: #f0f0f0;
-  --panel-3: #e8e8e8;
+  --panel-2: #f6f6f6;
+  --panel-3: #f0f0f0;
   --text-primary: #111111;
   --text-secondary: #4a4a4a;
   --text-muted: #6f6f6f;
   --accent: #0e8e6f;
   --accent-2: #0b7a5f;
+  --accent-ring: color-mix(in srgb, var(--accent) 55%, #000);
   --danger: #dc2626;
   --border: #d5d5d5;
   --border-strong: #bdbdbd;
@@ -313,6 +341,51 @@ a {
   --user-bubble: #d7f2ea;
 }
 
+/* Dark mode: white button background (no data-theme or data-theme="dark") */
+:root .settings-tab-active,
+:root .settings-btn-accent {
+  background: white !important;
+  color: #111111 !important;
+}
+
+[data-theme="dark"] .settings-tab-active,
+[data-theme="dark"] .settings-btn-accent {
+  background: white !important;
+  color: #111111 !important;
+}
+
+/* Light mode: black for selected tab and Save button */
+[data-theme="light"] .settings-tab-active,
+[data-theme="light"] .settings-btn-accent {
+  background: #111111 !important;
+  color: #ffffff !important;
+}
+
+[data-theme="light"] .message-content pre,
+[data-theme="light"] .message-content pre code {
+  color: #e5e7eb;
+}
+
+[data-theme="light"] .message-content code {
+  background: rgba(0, 0, 0, 0.06);
+  color: var(--text-primary);
+}
+
+[data-theme="light"] .message-loading-spinner {
+  border-color: rgba(0, 0, 0, 0.15);
+  border-top-color: #111111;
+}
+
+[data-theme="light"] .send-button.active {
+  background: #111111;
+  color: #ffffff;
+  border-color: transparent;
+}
+
+[data-theme="light"] .send-button.active svg {
+  color: #ffffff;
+}
+
 .message-content h1,
 .message-content h2,
 .message-content h3,
@@ -506,12 +579,16 @@ a {
 }
 
 .composer {
-  background: var(--panel);
+  background: #303030;
   border: 1px solid var(--border);
   border-radius: 18px;
   padding: 10px 12px;
 }
 
+[data-theme="light"] .composer {
+  background: transparent;
+}
+
 .thread-shelf {
   margin-top: 12px;
   padding-top: 8px;
@@ -582,10 +659,22 @@ a {
   line-height: 1.4;
   padding-top: 7px;
   padding-bottom: 9px;
+  padding-left: 6px;
   /* One line by default; height grows with content in Composer.tsx */
   min-height: calc(1.4em + 7px + 9px);
 }
 
+.composer-textarea:focus,
+.composer-textarea:focus-visible {
+  box-shadow: none;
+}
+
+.search-modal-input:focus,
+.search-modal-input:focus-visible {
+  outline: none;
+  box-shadow: none;
+}
+
 .send-button {
   height: 40px;
   width: 40px;
@@ -800,9 +889,9 @@ a {
 }
 
 .chat-scroll {
-  padding-top: calc(var(--topbar-height) - 20px);
+  padding-top: calc(var(--topbar-height) + 24px);
 }
 
 .chat-scroll.empty {
-  padding-top: var(--topbar-height);
+  padding-top: calc(var(--topbar-height) + 24px);
 }

package/template/src/app/page.tsx

@@ -12,6 +12,8 @@ import {
   createNewThread,
   deleteConversation,
   deleteThread,
+  DEFAULT_ACCENT_DARK,
+  DEFAULT_ACCENT_LIGHT,
 } from "../lib/data";
 import { db } from "../lib/db";
 import {
@@ -331,10 +333,23 @@ export default function Home() {
     <div
       className={`chat-shell ${sidebarCollapsed ? "collapsed" : ""}`}
       style={
-        {
-          "--accent": settings?.accentColor || "#66706e",
-          "--accent-2": settings?.accentColor || "#66706e",
-        } as CSSProperties
+        (() => {
+          const stored = settings?.accentColor || DEFAULT_ACCENT_DARK;
+          const isDefaultGray = stored === DEFAULT_ACCENT_DARK;
+          const isLight =
+            settings?.theme === "light" ||
+            (typeof document !== "undefined" &&
+              document.documentElement.dataset.theme === "light");
+          const effective =
+            isDefaultGray && isLight ? DEFAULT_ACCENT_LIGHT : stored;
+          return {
+            "--accent": effective,
+            "--accent-2": effective,
+            ...(isLight && {
+              "--accent-ring": "color-mix(in srgb, var(--accent) 55%, #000)",
+            }),
+          } as CSSProperties;
+        })()
       }
     >
       <Sidebar
@@ -344,7 +359,7 @@ export default function Home() {
         onSelect={async (id) => {
           if (id !== activeThreadId) {
             const prev = threads?.find((t) => t.id === activeThreadId);
-            if (prev?.headMessageId == null) {
+            if (prev && prev.headMessageId == null) {
               await deleteThread(prev.id);
             }
           }
@@ -352,7 +367,7 @@ export default function Home() {
         }}
         onNewChat={async () => {
           const prev = threads?.find((t) => t.id === activeThreadId);
-          if (prev?.headMessageId == null) {
+          if (prev && prev.headMessageId == null) {
             await deleteThread(prev.id);
           }
           const thread = await createNewThread();
@@ -387,7 +402,7 @@ export default function Home() {
         onOpenSearch={() => setSearchOpen(true)}
       />
 
-      <div className="flex h-screen min-w-0 flex-col overflow-hidden">
+      <div className="relative flex h-screen min-w-0 flex-col overflow-hidden">
         <TopBar
           connectionId={connection?.id ?? ""}
           connectionName={connection?.name ?? "No connection"}

package/template/src/components/MapView.tsx

@@ -16,6 +16,21 @@ import { useUIStore } from "../lib/store";
 const NODE_WIDTH = 220;
 const NODE_HEIGHT = 80;
 
+/** Strip markdown syntax for a short plain-text preview (e.g. "## Hi there" → "Hi there"). */
+function stripMarkdownForPreview(text: string): string {
+  return text
+    .replace(/^#+\s*/m, "") // headings: ## Title -> Title
+    .replace(/\*\*([^*]+)\*\*/g, "$1") // **bold**
+    .replace(/\*([^*]+)\*/g, "$1") // *italic*
+    .replace(/_([^_]+)_/g, "$1") // _italic_
+    .replace(/`([^`]+)`/g, "$1") // `code`
+    .replace(/\[([^\]]+)\]\([^)]+\)/g, "$1") // [link](url) -> link
+    .replace(/^[-*]\s+/gm, "") // list bullets
+    .replace(/^>\s*/gm, "") // blockquote
+    .replace(/\s+/g, " ")
+    .trim();
+}
+
 const graph = new dagre.graphlib.Graph();
 graph.setDefaultEdgeLabel(() => ({}));
 
@@ -120,7 +135,10 @@ export default function MapView({
 
   const { nodes, edges } = useMemo(() => {
     const nodes: Node[] = visibleMessages.map((message) => {
-      const preview = splitContentAndSources(message.content).content.trim().slice(0, 60) || "(empty)";
+      const raw = splitContentAndSources(message.content).content.trim();
+      const preview = raw
+        ? stripMarkdownForPreview(raw).slice(0, 60)
+        : "(empty)";
       const isActive = activePathIds.has(message.id);
       const roleClass =
         message.role === "user"
@@ -169,6 +187,7 @@ export default function MapView({
       padding: 0.2,
       duration,
       includeHiddenNodes: false,
+      minZoom: 0.85,
     });
   }, []);
 
@@ -198,7 +217,7 @@ export default function MapView({
         nodes={nodes}
         edges={edges}
         fitView
-        fitViewOptions={{ padding: 0.2, includeHiddenNodes: false }}
+        fitViewOptions={{ padding: 0.2, includeHiddenNodes: false, minZoom: 0.85 }}
         onInit={(instance) => {
           flowRef.current = instance;
           refitView(0);