feat(ui,api): strip board redesign - island, rail by day, context view, server search, vault graph

ui/src/lib/panel/index.svelte.ts

@@ -1,9 +1,12 @@
 import type { ApiClient } from "$lib/api/client";
 import { LiveStream } from "$lib/api/live.svelte";
 import type { BusEvent, ConversationSummary } from "$lib/api/types";
+import type { PanelCache } from "./cache";
 
 const RELOAD_DEBOUNCE_MS = 1500;
 const PAGE = 500;
+const CACHED_ROWS = 200;
+const INDEX_KEY = "index";
 
 // The conversation index kept fresh by ``/api/events``: rows land as
 // ``conversation.*`` events arrive, turn markers flip ``running_turn``
@@ -14,10 +17,17 @@ export class ConversationIndex {
   loaded = $state(false);
   readonly live: LiveStream;
   protected readonly client: () => ApiClient | null;
+  private readonly cache: PanelCache | null;
   private reloadTimer: ReturnType<typeof setTimeout> | null = null;
 
-  constructor(client: () => ApiClient | null) {
+  constructor(client: () => ApiClient | null, cache: PanelCache | null = null) {
     this.client = client;
+    this.cache = cache;
+    const cached = cache?.get<ConversationSummary[]>(INDEX_KEY);
+    if (cached && cached.length > 0) {
+      this.conversations = cached;
+      this.loaded = true;
+    }
     this.live = new LiveStream(client, "/api/events", {
       onEvent: (event) => this.apply(event),
       prepare: () => this.load(),
@@ -44,6 +54,7 @@ export class ConversationIndex {
     const list = await client.conversations({ limit: PAGE });
     this.conversations = list.conversations;
     this.loaded = true;
+    this.cache?.set(INDEX_KEY, list.conversations.slice(0, CACHED_ROWS));
   }
 
   apply(event: BusEvent): void {