@bojackduy/opencode-telescope 0.1.10 → 0.1.13

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "@bojackduy/opencode-telescope",
-  "version": "0.1.10",
+  "version": "0.1.13",
   "description": "Fuzzy search across all OpenCode conversations — grep session and chat history, find code snippets, and jump to any chat instantly",
   "type": "module",
   "license": "MIT",
@@ -63,11 +63,11 @@
     "solid-js": "*"
   },
   "devDependencies": {
-    "@opencode-ai/plugin": "^1.14.28",
-    "@opentui/core": "^0.1.105",
-    "@opentui/solid": "^0.1.105",
-    "@types/bun": "^1.3.13",
-    "solid-js": "^1.9.12",
-    "typescript": "^5.9.3"
+    "@opencode-ai/plugin": "^1.17.9",
+    "@opentui/core": "^0.4.1",
+    "@opentui/solid": "^0.4.1",
+    "@types/bun": "^1.3.14",
+    "solid-js": "^1.9.13",
+    "typescript": "^6.0.3"
   }
 }

package/search.ts

@@ -1,5 +1,5 @@
 import { Database } from "bun:sqlite"
-import { existsSync, readdirSync } from "node:fs"
+import { existsSync, readdirSync, statSync } from "node:fs"
 import { homedir } from "node:os"
 import path from "node:path"
 import { debug } from "./ui/debug.ts"
@@ -40,6 +40,17 @@ export type ConversationPreviewPart = {
   target: boolean
 }
 
+export type ConversationPreviewPage = {
+  parts: ConversationPreviewPart[]
+  hasMoreBefore: boolean
+  hasMoreAfter: boolean
+}
+
+export type ConversationPreviewCursor = {
+  id: string
+  timeCreated: number
+}
+
 export type ToolState = {
   status: "pending" | "running" | "completed" | "error"
   input?: unknown
@@ -69,6 +80,21 @@ type ConversationRow = {
 }
 
 let cachedDbPath: string | undefined
+let _db: Database | undefined
+let _dbPath: string | undefined
+let _indexDb: Database | undefined
+let _indexDbPath: string | undefined
+
+function getDb(dbPath?: string): Database {
+  const resolved = dbPath ?? resolveDatabasePath()
+  if (!_db || resolved !== _dbPath) {
+    _db?.close()
+    _db = new Database(resolved, { readonly: true })
+    _dbPath = resolved
+    tableCache.clear()
+  }
+  return _db
+}
 
 export function resolveDatabasePath() {
   if (cachedDbPath) return cachedDbPath
@@ -105,90 +131,177 @@ export function searchSessionMessages(query: string, options?: { limit?: number;
   const term = query.trim()
   if (!term) return []
   if (options?.dbPath === ":memory:") return []
-  const db = new Database(options?.dbPath ?? resolveDatabasePath(), { readonly: true })
-  try {
-    return searchRows(db, term, options?.limit ?? 80, options?.directory, options?.offset)
-  } finally {
-    db.close()
-  }
+  const dbPath = options?.dbPath ?? resolveDatabasePath()
+  const db = getDb(dbPath)
+  return searchRows(db, dbPath, term, options?.limit ?? 80, options?.directory, options?.offset)
 }
 
 export function recentSessionMessages(options?: { limit?: number; offset?: number; dbPath?: string; directory?: string }) {
-  const db = new Database(options?.dbPath ?? resolveDatabasePath(), { readonly: true })
-  try {
-    return visibleTextRows(db, options?.limit ?? 40, undefined, options?.directory, options?.offset).flatMap(
-      (row) => rowToSearchResult(row, "") ?? [],
-    )
-  } finally {
-    db.close()
-  }
+  const db = getDb(options?.dbPath)
+  return visibleTextRows(db, options?.limit ?? 40, undefined, options?.directory, options?.offset).flatMap(
+    (row) => rowToSearchResult(row, "") ?? [],
+  )
 }
 
-export function loadConversationWindow(result: SearchResult, options?: { before?: number; after?: number; dbPath?: string }) {
+export function loadConversationAround(result: SearchResult, options?: { before?: number; after?: number; dbPath?: string }): ConversationPreviewPage {
   debug.time("preview:query:total")
-  const db = new Database(options?.dbPath ?? resolveDatabasePath(), { readonly: true })
-  try {
-    const before = options?.before ?? 3
-    const after = options?.after ?? 6
-
-    debug.time("preview:query:hit")
-    const hit = db.query<{ time_created: number }, [string]>(
-      "SELECT time_created FROM part WHERE id = ?",
-    ).get(result.id)
-    debug.timeEnd("preview:query:hit")
-    if (!hit) {
-      debug.timeEnd("preview:query:total")
-      return []
-    }
-
-    const fetchBefore = Math.max(before * 4, 30)
-    const fetchAfter = Math.max(after * 4, 50)
-
-    debug.time("preview:query:before")
-    const beforeRows = db.query<ConversationRow, [string, number, number, string, number]>(`
-      SELECT p.id, p.message_id, p.session_id,
-             json_extract(m.data, '$.role') AS role,
-             json_extract(p.data, '$.type') AS type,
-             p.time_created, p.data
-      FROM part p
-      JOIN message m ON m.id = p.message_id
-      WHERE p.session_id = ?
-        AND (p.time_created < ? OR (p.time_created = ? AND p.id < ?))
-      ORDER BY p.time_created DESC, p.id DESC
-      LIMIT ?
-    `).all(result.sessionID, hit.time_created, hit.time_created, result.id, fetchBefore)
-    debug.timeEnd("preview:query:before")
-
-    debug.time("preview:query:after")
-    const afterRows = db.query<ConversationRow, [string, number, number, string, number]>(`
-      SELECT p.id, p.message_id, p.session_id,
-             json_extract(m.data, '$.role') AS role,
-             json_extract(p.data, '$.type') AS type,
-             p.time_created, p.data
-      FROM part p
-      JOIN message m ON m.id = p.message_id
-      WHERE p.session_id = ?
-        AND (p.time_created > ? OR (p.time_created = ? AND p.id >= ?))
-      ORDER BY p.time_created ASC, p.id ASC
-      LIMIT ?
-    `).all(result.sessionID, hit.time_created, hit.time_created, result.id, fetchAfter)
-    debug.timeEnd("preview:query:after")
-
-    debug.time("preview:query:parse")
-    const isValid = (row: ConversationRow) =>
-      (row.role === "user" || row.role === "assistant") &&
-      (row.type === "text" || row.type === "reasoning" || row.type === "tool")
-
-    const parts = [
-      ...beforeRows.filter(isValid).slice(0, before).reverse(),
-      ...afterRows.filter(isValid).slice(0, after + 1),
-    ].flatMap((row) => parseConversationPart(row, row.id === result.id) ?? [])
-    debug.timeEnd("preview:query:parse")
+  const db = getDb(options?.dbPath)
+  const before = options?.before ?? 3
+  const after = options?.after ?? 6
+
+  debug.time("preview:query:hit")
+  const hit = db.query<{ time_created: number }, [string]>(
+    "SELECT time_created FROM part WHERE id = ?",
+  ).get(result.id)
+  debug.timeEnd("preview:query:hit")
+  if (!hit) {
+    debug.log("preview:window", {
+      item: result.id,
+      session: result.sessionID,
+      before,
+      after,
+      hit: false,
+    })
     debug.timeEnd("preview:query:total")
-    return parts
-  } finally {
-    db.close()
+    return { parts: [], hasMoreBefore: false, hasMoreAfter: false }
+  }
+
+  const fetchBefore = Math.max(before * 4, before + 1, 30)
+  const fetchAfter = Math.max((after + 1) * 4, after + 2, 50)
+
+  debug.time("preview:query:before")
+  const beforeRows = db.query<ConversationRow, [string, number, number, string, number]>(`
+    SELECT p.id, p.message_id, p.session_id,
+           json_extract(m.data, '$.role') AS role,
+           json_extract(p.data, '$.type') AS type,
+           p.time_created, p.data
+    FROM part p
+    JOIN message m ON m.id = p.message_id
+    WHERE p.session_id = ?
+      AND (p.time_created < ? OR (p.time_created = ? AND p.id < ?))
+    ORDER BY p.time_created DESC, p.id DESC
+    LIMIT ?
+  `).all(result.sessionID, hit.time_created, hit.time_created, result.id, fetchBefore)
+  debug.timeEnd("preview:query:before")
+
+  debug.time("preview:query:after")
+  const afterRows = db.query<ConversationRow, [string, number, number, string, number]>(`
+    SELECT p.id, p.message_id, p.session_id,
+           json_extract(m.data, '$.role') AS role,
+           json_extract(p.data, '$.type') AS type,
+           p.time_created, p.data
+    FROM part p
+    JOIN message m ON m.id = p.message_id
+    WHERE p.session_id = ?
+      AND (p.time_created > ? OR (p.time_created = ? AND p.id >= ?))
+    ORDER BY p.time_created ASC, p.id ASC
+    LIMIT ?
+  `).all(result.sessionID, hit.time_created, hit.time_created, result.id, fetchAfter)
+  debug.timeEnd("preview:query:after")
+
+  debug.time("preview:query:parse")
+  const validBefore = beforeRows.filter(isPreviewRow)
+  const validAfter = afterRows.filter(isPreviewRow)
+  const parts = [
+    ...validBefore.slice(0, before).reverse(),
+    ...validAfter.slice(0, after + 1),
+  ].flatMap((row) => parseConversationPart(row, row.id === result.id) ?? [])
+  const page = {
+    parts,
+    hasMoreBefore: validBefore.length > before,
+    hasMoreAfter: validAfter.length > after + 1,
   }
+  debug.log("preview:window", {
+    item: result.id,
+    session: result.sessionID,
+    mode: "around",
+    before,
+    after,
+    fetchBefore,
+    fetchAfter,
+    beforeRows: beforeRows.length,
+    afterRows: afterRows.length,
+    parts: parts.length,
+    hasMoreBefore: page.hasMoreBefore,
+    hasMoreAfter: page.hasMoreAfter,
+    first: parts[0]?.id,
+    last: parts.at(-1)?.id,
+  })
+  debug.timeEnd("preview:query:parse")
+  debug.timeEnd("preview:query:total")
+  return page
+}
+
+export function loadConversationBefore(result: SearchResult, cursor: ConversationPreviewCursor, options?: { limit?: number; dbPath?: string }) {
+  debug.time("preview:query:before-page")
+  const db = getDb(options?.dbPath)
+  const limit = options?.limit ?? 20
+  const fetchLimit = Math.max(limit * 4, limit + 1, 30)
+  const rows = db.query<ConversationRow, [string, number, number, string, number]>(`
+    SELECT p.id, p.message_id, p.session_id,
+           json_extract(m.data, '$.role') AS role,
+           json_extract(p.data, '$.type') AS type,
+           p.time_created, p.data
+    FROM part p
+    JOIN message m ON m.id = p.message_id
+    WHERE p.session_id = ?
+      AND (p.time_created < ? OR (p.time_created = ? AND p.id < ?))
+    ORDER BY p.time_created DESC, p.id DESC
+    LIMIT ?
+  `).all(result.sessionID, cursor.timeCreated, cursor.timeCreated, cursor.id, fetchLimit)
+  const valid = rows.filter(isPreviewRow)
+  const parts = valid.slice(0, limit).reverse().flatMap((row) => parseConversationPart(row, false) ?? [])
+  const page = { parts, hasMoreBefore: valid.length > limit }
+  debug.log("preview:window", {
+    item: result.id,
+    session: result.sessionID,
+    mode: "before",
+    cursor,
+    limit,
+    rows: rows.length,
+    parts: parts.length,
+    hasMoreBefore: page.hasMoreBefore,
+    first: parts[0]?.id,
+    last: parts.at(-1)?.id,
+  })
+  debug.timeEnd("preview:query:before-page")
+  return page
+}
+
+export function loadConversationAfter(result: SearchResult, cursor: ConversationPreviewCursor, options?: { limit?: number; dbPath?: string }) {
+  debug.time("preview:query:after-page")
+  const db = getDb(options?.dbPath)
+  const limit = options?.limit ?? 20
+  const fetchLimit = Math.max(limit * 4, limit + 1, 30)
+  const rows = db.query<ConversationRow, [string, number, number, string, number]>(`
+    SELECT p.id, p.message_id, p.session_id,
+           json_extract(m.data, '$.role') AS role,
+           json_extract(p.data, '$.type') AS type,
+           p.time_created, p.data
+    FROM part p
+    JOIN message m ON m.id = p.message_id
+    WHERE p.session_id = ?
+      AND (p.time_created > ? OR (p.time_created = ? AND p.id > ?))
+    ORDER BY p.time_created ASC, p.id ASC
+    LIMIT ?
+  `).all(result.sessionID, cursor.timeCreated, cursor.timeCreated, cursor.id, fetchLimit)
+  const valid = rows.filter(isPreviewRow)
+  const parts = valid.slice(0, limit).flatMap((row) => parseConversationPart(row, false) ?? [])
+  const page = { parts, hasMoreAfter: valid.length > limit }
+  debug.log("preview:window", {
+    item: result.id,
+    session: result.sessionID,
+    mode: "after",
+    cursor,
+    limit,
+    rows: rows.length,
+    parts: parts.length,
+    hasMoreAfter: page.hasMoreAfter,
+    first: parts[0]?.id,
+    last: parts.at(-1)?.id,
+  })
+  debug.timeEnd("preview:query:after-page")
+  return page
 }
 
 export function rowToSearchResult(row: Row, query: string): SearchResult | undefined {
@@ -395,6 +508,11 @@ function parseConversationPart(row: ConversationRow, target: boolean): Conversat
   }
 }
 
+function isPreviewRow(row: ConversationRow) {
+  return (row.role === "user" || row.role === "assistant") &&
+    (row.type === "text" || row.type === "reasoning" || row.type === "tool")
+}
+
 function parsePartData(data: string) {
   try {
     const value = JSON.parse(data) as unknown
@@ -417,9 +535,46 @@ function parseToolState(value: unknown): ToolState | undefined {
   }
 }
 
-function searchRows(db: Database, query: string, limit: number, directory?: string, offset?: number) {
+function searchRows(db: Database, dbPath: string, query: string, limit: number, directory?: string, offset?: number) {
   if (!tableExists(db, "part") || !tableExists(db, "message")) return []
-  return visibleTextRows(db, limit, query, directory, offset).flatMap((row) => rowToSearchResult(row, query) ?? [])
+  debug.time("query:sql")
+  const rows = indexedTextRows(db, dbPath, limit, query, directory, offset) ?? visibleTextRows(db, limit, query, directory, offset)
+  debug.timeEnd("query:sql")
+  debug.time("query:map")
+  const results = rows.flatMap((row) => rowToSearchResult(row, query) ?? [])
+  debug.timeEnd("query:map")
+  return results
+}
+
+function indexedTextRows(db: Database, dbPath: string, limit: number, query: string, directory?: string, offset?: number) {
+  const match = ftsQuery(query)
+  if (!match) return []
+  try {
+    const index = ensureSearchIndex(db, dbPath)
+    const conditions = ["document_fts MATCH ?"]
+    const params: (string | number)[] = [match]
+    if (directory) {
+      conditions.push("directory = ?")
+      params.push(directory)
+    }
+    params.push(limit)
+    if (offset) params.push(offset)
+    const offsetClause = offset ? "OFFSET ?" : ""
+    debug.time("query:fts:exec")
+    const rows = index.query<Row, (string | number)[]>(`
+      SELECT id, message_id, session_id, session_title, directory, role,
+             CAST(time_created AS INTEGER) AS time_created, text
+      FROM document_fts
+      WHERE ${conditions.join(" AND ")}
+      ORDER BY bm25(document_fts), CAST(time_created AS INTEGER) DESC
+      LIMIT ? ${offsetClause}
+    `).all(...params as any[])
+    debug.timeEnd("query:fts:exec")
+    return rows
+  } catch (err) {
+    debug.log("fts:fallback", err instanceof Error ? err.message : String(err))
+    return
+  }
 }
 
 function visibleTextRows(db: Database, limit: number, query?: string, directory?: string, offset?: number) {
@@ -444,24 +599,145 @@ function visibleTextRows(db: Database, limit: number, query?: string, directory?
   params.push(limit)
   if (offset) params.push(offset)
 
-  return db
-    .query<Row, (string | number)[]>(`
-      SELECT p.id, p.message_id, p.session_id, s.title AS session_title, s.directory,
-             json_extract(m.data, '$.role') AS role,
-             p.time_created,
-             json_extract(p.data, '$.text') AS text
-      FROM part p
-      JOIN message m ON m.id = p.message_id
-      JOIN session s ON s.id = p.session_id
-      WHERE ${conditions.join(" AND ")}
-      ORDER BY p.time_created DESC
-      LIMIT ? ${offsetClause}
-    `)
-    .all(...params as any[])
+  const sql = `
+    SELECT p.id, p.message_id, p.session_id, s.title AS session_title, s.directory,
+           json_extract(m.data, '$.role') AS role,
+           p.time_created,
+           json_extract(p.data, '$.text') AS text
+    FROM part p
+    JOIN message m ON m.id = p.message_id
+    JOIN session s ON s.id = p.session_id
+    WHERE ${conditions.join(" AND ")}
+    ORDER BY p.time_created DESC
+    LIMIT ? ${offsetClause}
+  `
+  debug.time("query:sql:exec")
+  const rows = db.query<Row, (string | number)[]>(sql).all(...params as any[])
+  debug.timeEnd("query:sql:exec")
+  return rows
+}
+
+function ensureSearchIndex(source: Database, sourcePath: string) {
+  const indexPath = searchIndexPath(sourcePath)
+  if (!_indexDb || _indexDbPath !== indexPath) {
+    _indexDb?.close()
+    _indexDb = new Database(indexPath)
+    _indexDbPath = indexPath
+    migrateSearchIndex(_indexDb)
+  }
+
+  const state = sourceState(source, sourcePath)
+  const currentDataVersion = getMeta(_indexDb, "source_data_version")
+  const currentMtimeMs = getMeta(_indexDb, "source_mtime_ms")
+  const currentPath = getMeta(_indexDb, "source_path")
+  if (currentPath !== sourcePath || currentDataVersion !== String(state.dataVersion) || currentMtimeMs !== String(state.mtimeMs)) {
+    rebuildSearchIndex(source, _indexDb, sourcePath, state)
+  }
+  return _indexDb
+}
+
+function searchIndexPath(sourcePath: string) {
+  const parsed = path.parse(sourcePath)
+  return path.join(parsed.dir, `${parsed.name}-search.db`)
+}
+
+function migrateSearchIndex(db: Database) {
+  db.exec(`
+    CREATE TABLE IF NOT EXISTS index_meta(
+      key TEXT PRIMARY KEY,
+      value TEXT NOT NULL
+    );
+    CREATE VIRTUAL TABLE IF NOT EXISTS document_fts USING fts5(
+      id UNINDEXED,
+      message_id UNINDEXED,
+      session_id UNINDEXED,
+      session_title,
+      directory UNINDEXED,
+      role UNINDEXED,
+      time_created UNINDEXED,
+      text,
+      tokenize='unicode61'
+    );
+  `)
+}
+
+function sourceState(db: Database, sourcePath: string) {
+  const stat = statSync(sourcePath)
+  const dataVersion = db.query<{ data_version: number }, []>("PRAGMA data_version").get()?.data_version ?? 0
+  return { dataVersion, mtimeMs: stat.mtimeMs }
+}
+
+function rebuildSearchIndex(source: Database, index: Database, sourcePath: string, state: { dataVersion: number; mtimeMs: number }) {
+  debug.time("fts:rebuild")
+  const rows = source.query<Row, []>(`
+    SELECT p.id, p.message_id, p.session_id, s.title AS session_title, s.directory,
+           json_extract(m.data, '$.role') AS role,
+           p.time_created,
+           json_extract(p.data, '$.text') AS text
+    FROM part p
+    JOIN message m ON m.id = p.message_id
+    JOIN session s ON s.id = p.session_id
+    WHERE json_extract(p.data, '$.type') = 'text'
+      AND json_extract(m.data, '$.role') IN ('user', 'assistant')
+      AND json_extract(p.data, '$.text') IS NOT NULL
+    ORDER BY p.time_created DESC
+  `).all()
+  const insert = index.query<Row, [string, string, string, string, string, string, number, string]>(`
+    INSERT INTO document_fts(id, message_id, session_id, session_title, directory, role, time_created, text)
+    VALUES (?, ?, ?, ?, ?, ?, ?, ?)
+  `)
+  index.exec("BEGIN IMMEDIATE")
+  try {
+    index.exec("DELETE FROM document_fts")
+    for (const row of rows) {
+      insert.run(
+        row.id,
+        row.message_id,
+        row.session_id,
+        row.session_title ?? "Untitled session",
+        row.directory,
+        row.role,
+        row.time_created,
+        row.text,
+      )
+    }
+    setMeta(index, "source_path", sourcePath)
+    setMeta(index, "source_data_version", String(state.dataVersion))
+    setMeta(index, "source_mtime_ms", String(state.mtimeMs))
+    index.exec("COMMIT")
+  } catch (err) {
+    index.exec("ROLLBACK")
+    throw err
+  } finally {
+    debug.timeEnd("fts:rebuild")
+  }
+}
+
+function ftsQuery(query: string) {
+  const tokens = query.trim().split(/\s+/)
+    .map((token) => token.replace(/["*^:()]/g, " ").trim())
+    .filter(Boolean)
+  if (!tokens.length) return ""
+  return tokens.map((token) => `"${token.replace(/"/g, '""')}"*`).join(" AND ")
+}
+
+function getMeta(db: Database, key: string) {
+  return db.query<{ value: string }, [string]>("SELECT value FROM index_meta WHERE key = ?").get(key)?.value
+}
+
+function setMeta(db: Database, key: string, value: string) {
+  db.query<unknown, [string, string]>(`
+    INSERT INTO index_meta(key, value) VALUES (?, ?)
+    ON CONFLICT(key) DO UPDATE SET value = excluded.value
+  `).run(key, value)
 }
 
+const tableCache = new Map<string, boolean>()
 function tableExists(db: Database, name: string) {
-  return Boolean(db.query<{ name: string }, [string]>("SELECT name FROM sqlite_master WHERE type = 'table' AND name = ?").get(name))
+  if (tableCache.has(name)) return tableCache.get(name)!
+  const exists = Boolean(db.query<{ name: string }, [string]>("SELECT name FROM sqlite_master WHERE type = 'table' AND name = ?").get(name))
+  tableCache.set(name, exists)
+  return exists
 }
 
 function defaultDataDir() {

package/telescope.tsx

@@ -6,7 +6,9 @@ import { For, Show, createEffect, createMemo, createSignal, onCleanup } from "so
 import { ConversationPreview, PreviewHeader } from "./components/preview.tsx"
 import { EmptyState, ResultRow, SkeletonRow } from "./components/result-list.tsx"
 import {
-  loadConversationWindow,
+  loadConversationAfter,
+  loadConversationAround,
+  loadConversationBefore,
   recentSessionMessages,
   resolveDatabasePath,
   searchSessionMessages,
@@ -30,12 +32,18 @@ export const Telescope = (props: { api: TuiPluginApi; onClose: () => void }) =>
   const [loading, setLoading] = createSignal(true)
   const [hasMore, setHasMore] = createSignal(true)
   const [loadingMore, setLoadingMore] = createSignal(false)
-  const BATCH_SIZE = 25
-  const RECENT_BATCH_SIZE = 15
-  const INITIAL_PREVIEW_BEFORE = 3
-  const INITIAL_PREVIEW_AFTER = 6
-  const PREVIEW_EXPAND_STEP = 5
-  const [previewRange, setPreviewRange] = createSignal({ before: INITIAL_PREVIEW_BEFORE, after: INITIAL_PREVIEW_AFTER })
+  const [prefetchingResults, setPrefetchingResults] = createSignal(false)
+  const [resultPageInfo, setResultPageInfo] = createSignal({ loadedUntil: 0, hasMore: true, pageSize: 0, lastOffset: 0, lastAdded: 0 })
+  const [hasMorePreviewBefore, setHasMorePreviewBefore] = createSignal(false)
+  const [hasMorePreviewAfter, setHasMorePreviewAfter] = createSignal(false)
+  const [loadingPreviewMore, setLoadingPreviewMore] = createSignal(false)
+  const MIN_SEARCH_BATCH_SIZE = 25
+  const MIN_RECENT_BATCH_SIZE = 15
+  const RESULT_OVERSCAN_MULTIPLIER = 2
+  const RESULT_PREFETCH_VIEWPORTS = 3
+  const INITIAL_PREVIEW_BEFORE = 20
+  const INITIAL_PREVIEW_AFTER = 30
+  const PREVIEW_PAGE_SIZE = 20
   let input: InputRenderable | undefined
   let resultScroll: ScrollBoxRenderable | undefined
   let previewScroll: ScrollBoxRenderable | undefined
@@ -49,6 +57,47 @@ export const Telescope = (props: { api: TuiPluginApi; onClose: () => void }) =>
   const verticalOffset = createMemo(() => Math.floor(dimensions().height / 4 - height() / 2) - 2)
   const dbPath = createMemo(() => resolveDatabasePath())
   const directory = props.api.state.path.directory
+  let advanceSelectionAfterLoad = false
+  let resultPrefetchTimer: ReturnType<typeof setTimeout> | undefined
+  onCleanup(() => {
+    if (resultPrefetchTimer) clearTimeout(resultPrefetchTimer)
+  })
+
+  const resultRowHeight = createMemo(() => leftWidth() >= 48 ? 3 : 4)
+  const visibleResultRows = () => {
+    const viewportHeight = resultScroll?.height || Math.max(8, height() - 7)
+    return Math.max(5, Math.floor(viewportHeight / resultRowHeight()))
+  }
+  const searchBatchSize = () => Math.max(MIN_SEARCH_BATCH_SIZE, visibleResultRows() * 2)
+  const recentBatchSize = () => Math.max(MIN_RECENT_BATCH_SIZE, visibleResultRows() * 2)
+  const resultPrefetchThreshold = () => Math.max(visibleResultRows() * RESULT_PREFETCH_VIEWPORTS, searchBatchSize())
+  const resultRenderWindow = createMemo(() => {
+    const total = results().length
+    const visible = visibleResultRows()
+    const overscan = visible * RESULT_OVERSCAN_MULTIPLIER
+    const index = selected()
+    const start = Math.max(0, index - overscan)
+    const end = Math.min(total, index + visible + overscan)
+    return { start, end, items: results().slice(start, end) }
+  })
+
+  let lastResultRenderWindow = ""
+  createEffect(() => {
+    const window = resultRenderWindow()
+    const key = `${window.start}:${window.end}:${results().length}`
+    if (key === lastResultRenderWindow) return
+    lastResultRenderWindow = key
+    debug.log("results:render-window", {
+      selected: selected(),
+      totalLoaded: results().length,
+      start: window.start,
+      end: window.end,
+      rendered: window.items.length,
+      visibleRows: visibleResultRows(),
+      overscanRows: visibleResultRows() * RESULT_OVERSCAN_MULTIPLIER,
+      pageInfo: resultPageInfo(),
+    })
+  })
 
   createEffect(() => {
     const q = query().trim()
@@ -59,15 +108,18 @@ export const Telescope = (props: { api: TuiPluginApi; onClose: () => void }) =>
 
     if (!q) {
       setLoading(true)
+      const limit = recentBatchSize()
       const timer = setTimeout(() => {
         debug.time("query:recent")
         try {
-          const batch = recentSessionMessages({ limit: RECENT_BATCH_SIZE, offset: 0, dbPath: db, directory: dir })
+          const batch = recentSessionMessages({ limit, offset: 0, dbPath: db, directory: dir })
           setResults(batch)
-          setHasMore(batch.length >= RECENT_BATCH_SIZE)
+          setHasMore(batch.length >= limit)
+          setResultPageInfo({ loadedUntil: batch.length, hasMore: batch.length >= limit, pageSize: limit, lastOffset: 0, lastAdded: batch.length })
           setSelected(0)
         } catch (err) {
           setResults([])
+          setResultPageInfo({ loadedUntil: 0, hasMore: false, pageSize: limit, lastOffset: 0, lastAdded: 0 })
           setError(err instanceof Error ? err.message : String(err))
         }
         debug.timeEnd("query:recent")
@@ -79,15 +131,18 @@ export const Telescope = (props: { api: TuiPluginApi; onClose: () => void }) =>
 
     setLoading(true)
     setBusy(true)
+    const limit = searchBatchSize()
     const timer = setTimeout(() => {
       debug.time("query:search")
       try {
-        const batch = searchSessionMessages(q, { limit: BATCH_SIZE, offset: 0, dbPath: db, directory: dir })
+        const batch = searchSessionMessages(q, { limit, offset: 0, dbPath: db, directory: dir })
         setResults(batch)
-        setHasMore(batch.length >= BATCH_SIZE)
+        setHasMore(batch.length >= limit)
+        setResultPageInfo({ loadedUntil: batch.length, hasMore: batch.length >= limit, pageSize: limit, lastOffset: 0, lastAdded: batch.length })
         setSelected(0)
       } catch (err) {
         setResults([])
+        setResultPageInfo({ loadedUntil: 0, hasMore: false, pageSize: limit, lastOffset: 0, lastAdded: 0 })
         setError(err instanceof Error ? err.message : String(err))
       } finally {
         debug.timeEnd("query:search")
@@ -98,15 +153,76 @@ export const Telescope = (props: { api: TuiPluginApi; onClose: () => void }) =>
     onCleanup(() => clearTimeout(timer))
   })
 
+  const loadMoreResults = (advance = false) => {
+    if (advance) advanceSelectionAfterLoad = true
+    if (!hasMore()) {
+      advanceSelectionAfterLoad = false
+      return
+    }
+    if (loadingMore() || prefetchingResults() || busy() || loading()) return
+
+    const total = results().length
+    const q = query().trim()
+    const db = dbPath()
+    const dir = directory
+    const limit = q ? searchBatchSize() : recentBatchSize()
+
+    advance ? setLoadingMore(true) : setPrefetchingResults(true)
+    debug.time("query:load-more")
+    try {
+      const batch = q
+        ? searchSessionMessages(q, { limit, offset: total, dbPath: db, directory: dir })
+        : recentSessionMessages({ limit, offset: total, dbPath: db, directory: dir })
+      const nextHasMore = batch.length >= limit
+      const nextLoadedUntil = total + batch.length
+      debug.log("results:prefetch", { offset: total, limit, added: batch.length, totalLoaded: nextLoadedUntil, hasMore: nextHasMore, advance })
+      setResults((prev) => [...prev, ...batch])
+      setResultPageInfo({ loadedUntil: nextLoadedUntil, hasMore: nextHasMore, pageSize: limit, lastOffset: total, lastAdded: batch.length })
+      if (!nextHasMore) setHasMore(false)
+      if (advanceSelectionAfterLoad) {
+        debug.log("results:advance-after-load", { from: selected(), total, added: batch.length })
+        advanceSelectionAfterLoad = false
+        if (batch.length > 0) setSelected(total)
+      }
+    } catch (err) {
+      debug.log("results:load-more:error", err instanceof Error ? err.message : String(err))
+      advanceSelectionAfterLoad = false
+    } finally {
+      debug.timeEnd("query:load-more")
+      advance ? setLoadingMore(false) : setPrefetchingResults(false)
+    }
+  }
+
+  const scheduleResultPrefetch = (advance = false) => {
+    if (advance) advanceSelectionAfterLoad = true
+    if (resultPrefetchTimer || loadingMore() || prefetchingResults()) return
+    debug.log("results:prefetch-scheduled", { advance, pendingAdvance: advanceSelectionAfterLoad, pageInfo: resultPageInfo() })
+    resultPrefetchTimer = setTimeout(() => {
+      resultPrefetchTimer = undefined
+      loadMoreResults(advanceSelectionAfterLoad)
+    }, 1)
+  }
+
   const move = (delta: number) => {
     if (results().length === 0) return
-    debug.time("nav:total")
-    setSelected((index) => (index + delta + results().length) % results().length)
+    setSelected((index) => {
+      const next = index + delta
+      let finalIndex = next
+      if (next < 0) finalIndex = results().length - 1
+      else if (next >= results().length) {
+        if (hasMore()) scheduleResultPrefetch(true)
+        finalIndex = results().length - 1
+      }
+       
+      if (finalIndex !== index) debug.time("nav:total")
+      return finalIndex
+    })
   }
 
   createEffect(() => {
     const index = selected()
-    const row = resultScroll?.getChildren()[index]
+    const window = resultRenderWindow()
+    const row = resultScroll?.getChildren()[index - window.start]
     if (!resultScroll || !row) return
     const y = row.y - resultScroll.y
     if (y < 0) {
@@ -121,50 +237,107 @@ export const Telescope = (props: { api: TuiPluginApi; onClose: () => void }) =>
   createEffect(() => {
     const index = selected()
     const total = results().length
-    if (index < total - 3) return
-    if (!hasMore() || loadingMore() || busy() || loading()) return
+    const threshold = resultPrefetchThreshold()
+    if (index < total - threshold) return
+    if (!hasMore() || loadingMore() || prefetchingResults() || busy() || loading()) return
 
-    const q = query().trim()
-    const db = dbPath()
-    const dir = directory
-
-    setLoadingMore(true)
-    const timer = setTimeout(() => {
-      debug.time("query:load-more")
-      try {
-        const batch = q
-          ? searchSessionMessages(q, { limit: BATCH_SIZE, offset: total, dbPath: db, directory: dir })
-          : recentSessionMessages({ limit: RECENT_BATCH_SIZE, offset: total, dbPath: db, directory: dir })
-        setResults((prev) => [...prev, ...batch])
-        if (batch.length < (q ? BATCH_SIZE : RECENT_BATCH_SIZE)) setHasMore(false)
-      } catch {
-        // keep existing results on error
-      } finally {
-        debug.timeEnd("query:load-more")
-        setLoadingMore(false)
-      }
-    }, 100)
+    const timer = setTimeout(() => scheduleResultPrefetch(false), 100)
     onCleanup(() => clearTimeout(timer))
   })
 
+  const previewContentHeight = () => {
+    const children = previewScroll?.getChildren()
+    const lastChild = children?.[children.length - 1] as { y: number; height: number } | undefined
+    return lastChild ? lastChild.y + lastChild.height : 0
+  }
+
+  const loadPreviewBefore = (previousContentHeight = previewContentHeight(), preserveScroll = true) => {
+    const item = selectedResult()
+    const first = previewParts()[0]
+    if (!item || !first || loadingPreviewMore()) return
+    setLoadingPreviewMore(true)
+    debug.time("preview:load-before")
+    try {
+      const page = loadConversationBefore(item, { id: first.id, timeCreated: first.timeCreated }, { limit: PREVIEW_PAGE_SIZE, dbPath: dbPath() })
+      debug.log("preview:load-before", {
+        item: item.id,
+        added: page.parts.length,
+        hasMoreBefore: page.hasMoreBefore,
+        preserveScroll,
+        first: page.parts[0]?.id,
+        last: page.parts.at(-1)?.id,
+      })
+      if (page.parts.length > 0) {
+        setPreviewParts((prev) => [...page.parts, ...prev])
+        if (preserveScroll) {
+          setTimeout(() => {
+            const delta = previewContentHeight() - previousContentHeight
+            if (delta > 0) previewScroll?.scrollBy(delta)
+          }, 1)
+        }
+      }
+      setHasMorePreviewBefore(page.hasMoreBefore)
+    } catch (err) {
+      debug.log("preview:load-before:error", err instanceof Error ? err.message : String(err))
+    } finally {
+      debug.timeEnd("preview:load-before")
+      setLoadingPreviewMore(false)
+    }
+  }
+
+  const loadPreviewAfter = () => {
+    const item = selectedResult()
+    const last = previewParts().at(-1)
+    if (!item || !last || loadingPreviewMore()) return
+    setLoadingPreviewMore(true)
+    debug.time("preview:load-after")
+    try {
+      const page = loadConversationAfter(item, { id: last.id, timeCreated: last.timeCreated }, { limit: PREVIEW_PAGE_SIZE, dbPath: dbPath() })
+      debug.log("preview:load-after", {
+        item: item.id,
+        added: page.parts.length,
+        hasMoreAfter: page.hasMoreAfter,
+        first: page.parts[0]?.id,
+        last: page.parts.at(-1)?.id,
+      })
+      if (page.parts.length > 0) setPreviewParts((prev) => [...prev, ...page.parts])
+      setHasMorePreviewAfter(page.hasMoreAfter)
+    } catch (err) {
+      debug.log("preview:load-after:error", err instanceof Error ? err.message : String(err))
+    } finally {
+      debug.timeEnd("preview:load-after")
+      setLoadingPreviewMore(false)
+    }
+  }
+
   let lastPreviewItemId = ""
   createEffect(() => {
     const item = selectedResult()
-    const range = previewRange()
     if (!item) {
       setPreviewParts([])
+      setHasMorePreviewBefore(false)
+      setHasMorePreviewAfter(false)
       return
     }
-    if (item.id !== lastPreviewItemId) {
-      lastPreviewItemId = item.id
-      debug.log("preview:new-item", item.sessionTitle?.slice(0, 40) ?? item.id.slice(-8))
-      setPreviewRange({ before: INITIAL_PREVIEW_BEFORE, after: INITIAL_PREVIEW_AFTER })
-      return
-    }
+    if (item.id === lastPreviewItemId) return
+    lastPreviewItemId = item.id
+    debug.log("preview:new-item", item.sessionTitle?.slice(0, 40) ?? item.id.slice(-8))
     const db = dbPath()
     debug.time("preview:load")
     try {
-      setPreviewParts(loadConversationWindow(item, { before: range.before, after: range.after, dbPath: db }))
+      const page = loadConversationAround(item, { before: INITIAL_PREVIEW_BEFORE, after: INITIAL_PREVIEW_AFTER, dbPath: db })
+      debug.log("preview:init", {
+        item: item.id,
+        session: item.sessionID,
+        parts: page.parts.length,
+        hasMoreBefore: page.hasMoreBefore,
+        hasMoreAfter: page.hasMoreAfter,
+        first: page.parts[0]?.id,
+        last: page.parts.at(-1)?.id,
+      })
+      setPreviewParts(page.parts)
+      setHasMorePreviewBefore(page.hasMoreBefore)
+      setHasMorePreviewAfter(page.hasMoreAfter)
     } catch {}
     debug.timeEnd("nav:total")
     debug.timeEnd("preview:load")
@@ -174,24 +347,41 @@ export const Telescope = (props: { api: TuiPluginApi; onClose: () => void }) =>
     const item = selectedResult()
     if (!item) return
     const interval = setInterval(() => {
+      if (loadingPreviewMore()) return
       const scroll = previewScroll
       const children = scroll?.getChildren()
       if (!scroll || !children || children.length === 0) return
-      const range = previewRange()
       const lastChild = children[children.length - 1] as { y: number; height: number }
       const totalContentHeight = lastChild.y + lastChild.height
-      const atTop = scroll.y <= 0 && range.before > 0
+      const atTop = scroll.y <= 0
+      const nearTop = scroll.y <= 2
       const atBottom = scroll.y + scroll.height >= totalContentHeight - 1
-      if (atTop) setPreviewRange((prev) => ({ ...prev, before: prev.before + PREVIEW_EXPAND_STEP }))
-      if (atBottom) setPreviewRange((prev) => ({ ...prev, after: prev.after + PREVIEW_EXPAND_STEP }))
+      if (nearTop || atBottom) {
+        debug.log("preview:scroll-edge", {
+          y: scroll.y,
+          height: scroll.height,
+          contentHeight: totalContentHeight,
+          atTop,
+          nearTop,
+          atBottom,
+          hasMoreBefore: hasMorePreviewBefore(),
+          hasMoreAfter: hasMorePreviewAfter(),
+          children: children.length,
+        })
+      }
+      if (nearTop && hasMorePreviewBefore()) loadPreviewBefore(totalContentHeight, !atTop)
+      if (atBottom && hasMorePreviewAfter()) loadPreviewAfter()
     }, 400)
     onCleanup(() => clearInterval(interval))
   })
 
+  let scrolledItem = ""
   createEffect(() => {
     const item = selectedResult()
     previewParts()
     if (!item) return
+    if (item.id === scrolledItem) return
+    scrolledItem = item.id
     const timer = setTimeout(() => scrollPreviewToTarget(previewScroll, messageTargetID(item)), 1)
     onCleanup(() => clearTimeout(timer))
   })
@@ -324,18 +514,21 @@ export const Telescope = (props: { api: TuiPluginApi; onClose: () => void }) =>
                   >
                     <Show when={!loading()}>
                       <Show when={results().length > 0} fallback={<EmptyState query={query()} theme={theme()} />}>
-                        <For each={results()}>
-                          {(item, index) => (
-                            <ResultRow
-                              item={item}
-                              active={index() === selected()}
-                              width={leftWidth()}
-                              query={query()}
-                              theme={theme()}
-                              onMouseOver={() => setSelected(index())}
-                              onOpen={open}
-                            />
-                          )}
+                        <For each={resultRenderWindow().items}>
+                          {(item, index) => {
+                            const absoluteIndex = () => resultRenderWindow().start + index()
+                            return (
+                              <ResultRow
+                                item={item}
+                                active={absoluteIndex() === selected()}
+                                width={leftWidth()}
+                                query={query()}
+                                theme={theme()}
+                                onMouseOver={() => setSelected(absoluteIndex())}
+                                onOpen={open}
+                              />
+                            )
+                          }}
                         </For>
                         <Show when={loadingMore()}>
                           <SkeletonRow theme={theme()} />

package/ui/debug.ts

@@ -1,6 +1,16 @@
+import { appendFileSync, mkdirSync } from "node:fs"
+import path from "node:path"
+
 const enabled = process.env.OPENCODE_TELESCOPE_DEBUG === "1"
+const logPath = process.env.OPENCODE_TELESCOPE_LOG
+const consoleEnabled = !logPath || process.env.OPENCODE_TELESCOPE_CONSOLE === "1"
 const timers = new Map<string, number>()
 
+if (enabled && logPath) {
+  mkdirSync(path.dirname(logPath), { recursive: true })
+  writeFileLog("session:start", { pid: process.pid })
+}
+
 export const debug = {
   get enabled() {
     return enabled
@@ -14,12 +24,31 @@ export const debug = {
     if (!enabled) return
     const start = timers.get(label)
     if (start !== undefined) {
-      console.log(`[telescope:time] ${label} ${(performance.now() - start).toFixed(2)}ms`)
+      writeLog("time", label, { ms: Number((performance.now() - start).toFixed(2)) })
       timers.delete(label)
     }
   },
 
   log(...args: unknown[]) {
-    if (enabled) console.log("[telescope]", ...args)
+    if (enabled) writeLog("log", String(args[0] ?? "message"), args.length > 1 ? args.slice(1) : undefined)
   },
 }
+
+function writeLog(type: "log" | "time", label: string, payload: unknown) {
+  if (logPath) writeFileLog(label, payload, type)
+  if (consoleEnabled) console.log(type === "time" ? `[telescope:time] ${label}` : "[telescope]", payload ?? "")
+}
+
+function writeFileLog(label: string, payload: unknown, type = "log") {
+  if (!logPath) return
+  appendFileSync(logPath, `${JSON.stringify({ ts: new Date().toISOString(), type, label, payload: safeJson(payload) })}\n`)
+}
+
+function safeJson(value: unknown) {
+  try {
+    JSON.stringify(value)
+    return value
+  } catch {
+    return String(value)
+  }
+}