wiki-viewer 1.7.1 → 1.8.0

package/.next/standalone/src/components/editor/comment-thread.tsx

@@ -4,6 +4,7 @@ import * as Popover from "@radix-ui/react-popover";
 import { useEffect, useRef, useState } from "react";
 import { authHeaders } from "@/lib/proof/client-auth";
 import { useProofStore } from "@/stores/proof-store";
+import { wsFetch } from "@/lib/workspace-client";
 import type { Comment } from "@/lib/proof/types";
 
 // ── helpers ──────────────────────────────────────────────────────────────────
@@ -28,7 +29,7 @@ async function postOp(
 	ops: object[],
 ): Promise<{ ok: boolean; stale: boolean; newRevision?: number }> {
 	const encoded = encodeURIComponent(path).replace(/%2F/g, "/");
-	const res = await fetch(`/api/agent/files/${encoded}`, {
+	const res = await wsFetch(`/api/agent/files/${encoded}`, {
 		method: "POST",
 		headers: {
 			"Content-Type": "application/json",

package/.next/standalone/src/components/editor/csv-viewer.tsx

@@ -2,6 +2,7 @@
 
 import { Code2, Download, Save } from "lucide-react";
 import { useCallback, useEffect, useState } from "react";
+import { wsFetch } from "@/lib/workspace-client";
 import { ViewerToolbar } from "@/components/layout/viewer-toolbar";
 import { Button } from "@/components/ui/button";
 
@@ -80,7 +81,7 @@ export function CsvViewer({ path }: CsvViewerProps) {
 	const csvUrl = `/api/assets/${path}`;
 
 	useEffect(() => {
-		fetch(csvUrl)
+		wsFetch(csvUrl)
 			.then((r) => r.text())
 			.then((text) => {
 				setRawText(text);
@@ -121,7 +122,7 @@ export function CsvViewer({ path }: CsvViewerProps) {
 		setSaving(true);
 		const csv = sourceMode ? rawText : rowsToCsv(rows);
 		try {
-			await fetch(`/api/assets/${path}`, {
+			await wsFetch(`/api/assets/${path}`, {
 				method: "PUT",
 				headers: { "Content-Type": "text/plain" },
 				body: csv,

package/.next/standalone/src/components/editor/editor-toolbar.tsx

@@ -85,9 +85,9 @@ function ToolButton({
 				onAction(e);
 			}}
 			className={cn(
-				"h-8 w-8 shrink-0 inline-flex items-center justify-center rounded-md text-foreground/80 hover:bg-accent transition-colors disabled:opacity-40",
+				"h-8 w-8 shrink-0 inline-flex items-center justify-center rounded-md text-foreground/80 hover:bg-accent hover:text-accent-foreground transition-colors disabled:opacity-40",
 				active &&
-					"bg-accent text-foreground ring-1 ring-inset ring-foreground/15",
+					"bg-accent text-accent-foreground ring-1 ring-inset ring-foreground/15",
 			)}
 		>
 			<Icon className="h-4 w-4" />

package/.next/standalone/src/components/editor/editor.tsx

@@ -15,6 +15,7 @@ import { useWikiSlugsStore } from "@/stores/wiki-slugs-store";
 import type { TreeNode } from "@/types";
 import { useProofStore } from "@/stores/proof-store";
 import { captureSuggestion } from "@/lib/proof/suggest-capture";
+import { wsFetch, withWs } from "@/lib/workspace-client";
 import { EditorBubbleMenu } from "./bubble-menu";
 import { EditorToolbar } from "./editor-toolbar";
 import { editorExtensions } from "./extensions";
@@ -39,7 +40,7 @@ async function uploadFile(
 	const formData = new FormData();
 	formData.append("file", file);
 	try {
-		const res = await fetch(`/api/upload/${pagePath}`, {
+		const res = await wsFetch(`/api/upload/${pagePath}`, {
 			method: "POST",
 			body: formData,
 		});
@@ -197,7 +198,7 @@ export function KBEditor() {
 		const path = currentPath;
 		const ping = (action: "open" | "heartbeat" | "close") => {
 			// keepalive lets the "close" beacon survive page unload.
-			void fetch("/api/wiki/presence", {
+			void wsFetch("/api/wiki/presence", {
 				method: "POST",
 				headers: { "Content-Type": "application/json" },
 				body: JSON.stringify({ path, action }),
@@ -225,7 +226,7 @@ export function KBEditor() {
 	// Subscribe to chokidar SSE: when current file changes on disk, reload sidecar.
 	useEffect(() => {
 		if (typeof window === "undefined") return;
-		const es = new EventSource("/api/wiki/watch");
+		const es = new EventSource(withWs("/api/wiki/watch"));
 		es.onmessage = (evt: MessageEvent<string>) => {
 			try {
 				const data = JSON.parse(evt.data) as { type: string; path: string };
@@ -1139,7 +1140,7 @@ export function KBEditor() {
 										className={`px-2 py-0.5 transition-colors ${
 											editMode === "editing"
 												? "bg-primary text-primary-foreground"
-												: "text-muted-foreground hover:bg-accent"
+												: "text-muted-foreground hover:bg-accent hover:text-accent-foreground"
 										}`}
 									>
 										Editing
@@ -1152,7 +1153,7 @@ export function KBEditor() {
 										className={`px-2 py-0.5 transition-colors ${
 											editMode === "suggesting"
 												? "bg-primary text-primary-foreground"
-												: "text-muted-foreground hover:bg-accent"
+												: "text-muted-foreground hover:bg-accent hover:text-accent-foreground"
 										}`}
 									>
 										Suggesting

package/.next/standalone/src/components/editor/file-fallback-viewer.tsx

@@ -3,6 +3,7 @@
 import { Download, File, FolderOpen } from "lucide-react";
 import { ViewerToolbar } from "@/components/layout/viewer-toolbar";
 import { Button } from "@/components/ui/button";
+import { withWs, wsFetch } from "@/lib/workspace-client";
 
 interface FileFallbackViewerProps {
 	path: string;
@@ -10,7 +11,7 @@ interface FileFallbackViewerProps {
 }
 
 export function FileFallbackViewer({ path }: FileFallbackViewerProps) {
-	const assetUrl = `/api/assets/${path}`;
+	const assetUrl = withWs(`/api/assets/${path}`);
 	const filename = path.split("/").pop() || path;
 	const ext = filename.includes(".")
 		? filename.split(".").pop()?.toUpperCase()
@@ -18,7 +19,7 @@ export function FileFallbackViewer({ path }: FileFallbackViewerProps) {
 
 	const revealInFinder = async () => {
 		try {
-			await fetch("/api/system/reveal", {
+			await wsFetch("/api/system/reveal", {
 				method: "POST",
 				headers: { "Content-Type": "application/json" },
 				body: JSON.stringify({ path }),

package/.next/standalone/src/components/editor/folder-index.tsx

@@ -17,6 +17,7 @@ import { useMemo, useState } from "react";
 import { useEditorStore } from "@/stores/editor-store";
 import { useTreeStore } from "@/stores/tree-store";
 import type { TreeNode } from "@/types";
+import { withWs } from "@/lib/workspace-client";
 
 type ViewMode = "list" | "gallery";
 
@@ -199,7 +200,7 @@ export function FolderIndex({ folderPath, entries }: FolderIndexProps) {
 								>
 									<div className="aspect-square w-full overflow-hidden rounded-md border border-border bg-muted">
 										<img
-											src={`/api/assets/${child.path}`}
+											src={withWs(`/api/assets/${child.path}`)}
 											alt={title}
 											loading="lazy"
 											className="h-full w-full object-cover transition-transform group-hover:scale-[1.02]"

package/.next/standalone/src/components/editor/image-viewer.tsx

@@ -3,6 +3,7 @@
 import { Download, ExternalLink } from "lucide-react";
 import { ViewerToolbar } from "@/components/layout/viewer-toolbar";
 import { Button } from "@/components/ui/button";
+import { withWs } from "@/lib/workspace-client";
 
 interface ImageViewerProps {
 	path: string;
@@ -10,7 +11,7 @@ interface ImageViewerProps {
 }
 
 export function ImageViewer({ path, title }: ImageViewerProps) {
-	const src = `/api/assets/${path}`;
+	const src = withWs(`/api/assets/${path}`);
 	const filename = path.split("/").pop() || path;
 	const ext = filename.includes(".")
 		? filename.split(".").pop()?.toUpperCase()

package/.next/standalone/src/components/editor/media-popover.tsx

@@ -3,6 +3,7 @@
 import { Clipboard, Link as LinkIcon, Upload } from "lucide-react";
 import { useRef, useState } from "react";
 import { cn } from "@/lib/utils";
+import { wsFetch } from "@/lib/workspace-client";
 
 export type MediaKind = "image" | "video" | "file";
 
@@ -21,7 +22,7 @@ async function uploadFile(
 	const formData = new FormData();
 	formData.append("file", file);
 	try {
-		const res = await fetch(`/api/upload/${pagePath}`, {
+		const res = await wsFetch(`/api/upload/${pagePath}`, {
 			method: "POST",
 			body: formData,
 		});

package/.next/standalone/src/components/editor/media-viewer.tsx

@@ -3,6 +3,7 @@
 import { Download, ExternalLink } from "lucide-react";
 import { ViewerToolbar } from "@/components/layout/viewer-toolbar";
 import { Button } from "@/components/ui/button";
+import { withWs } from "@/lib/workspace-client";
 
 interface MediaViewerProps {
 	path: string;
@@ -11,7 +12,7 @@ interface MediaViewerProps {
 }
 
 export function MediaViewer({ path, type }: MediaViewerProps) {
-	const src = `/api/assets/${path}`;
+	const src = withWs(`/api/assets/${path}`);
 	const filename = path.split("/").pop() || path;
 	const ext = filename.includes(".")
 		? filename.split(".").pop()?.toUpperCase()

package/.next/standalone/src/components/editor/mermaid-viewer.tsx

@@ -13,6 +13,7 @@ import {
 import { useCallback, useEffect, useRef, useState } from "react";
 import { ViewerToolbar } from "@/components/layout/viewer-toolbar";
 import { Button } from "@/components/ui/button";
+import { withWs, wsFetch } from "@/lib/workspace-client";
 
 interface MermaidViewerProps {
 	path: string;
@@ -85,14 +86,14 @@ export function MermaidViewer({ path, title }: MermaidViewerProps) {
 		setIsPanning(false);
 	}, []);
 
-	const assetUrl = `/api/assets/${path}`;
+	const assetUrl = withWs(`/api/assets/${path}`);
 	const _filename = path.split("/").pop() || path;
 
 	const fetchAndRender = useCallback(async () => {
 		setLoading(true);
 		setError("");
 		try {
-			const res = await fetch(assetUrl);
+			const res = await wsFetch(assetUrl);
 			if (!res.ok) throw new Error("Failed to fetch file");
 			const text = await res.text();
 			setSource(text);

package/.next/standalone/src/components/editor/node-app-viewer.tsx

@@ -13,6 +13,7 @@ import { useCallback, useEffect, useRef, useState } from "react";
 import { ViewerToolbar } from "@/components/layout/viewer-toolbar";
 import { Button } from "@/components/ui/button";
 import type { AppStatus } from "@/lib/app-runner";
+import { wsFetch } from "@/lib/workspace-client";
 
 interface Props {
 	path: string;
@@ -56,7 +57,7 @@ export function NodeAppViewer({ path, title }: Props) {
 
 	const fetchStatus = useCallback(async () => {
 		try {
-			const res = await fetch(`/api/wiki/app?path=${encodeURIComponent(path)}`);
+			const res = await wsFetch(`/api/wiki/app?path=${encodeURIComponent(path)}`);
 			if (!res.ok) return;
 			const data: StatusResponse = await res.json();
 			setStatus(data.status);
@@ -96,7 +97,7 @@ export function NodeAppViewer({ path, title }: Props) {
 		setLogs([]);
 		setStatus("starting");
 		try {
-			const res = await fetch("/api/wiki/app", {
+			const res = await wsFetch("/api/wiki/app", {
 				method: "POST",
 				headers: { "Content-Type": "application/json" },
 				body: JSON.stringify({ path }),
@@ -117,7 +118,7 @@ export function NodeAppViewer({ path, title }: Props) {
 	};
 
 	const handleStop = async () => {
-		await fetch("/api/wiki/app", {
+		await wsFetch("/api/wiki/app", {
 			method: "DELETE",
 			headers: { "Content-Type": "application/json" },
 			body: JSON.stringify({ path }),

package/.next/standalone/src/components/editor/notebook-viewer.tsx

@@ -7,6 +7,7 @@ import { useCallback, useEffect, useMemo, useState } from "react";
 import { ViewerToolbar } from "@/components/layout/viewer-toolbar";
 import { Button } from "@/components/ui/button";
 import { markdownToHtml } from "@/lib/markdown/to-html";
+import { withWs, wsFetch } from "@/lib/workspace-client";
 
 interface NotebookViewerProps {
 	path: string;
@@ -247,14 +248,14 @@ export function NotebookViewer({ path }: NotebookViewerProps) {
 	const [error, setError] = useState<string | null>(null);
 	const [copied, setCopied] = useState(false);
 
-	const assetUrl = `/api/assets/${path}`;
+	const assetUrl = withWs(`/api/assets/${path}`);
 	const filename = path.split("/").pop() || path;
 
 	const fetchNotebook = useCallback(async () => {
 		setLoading(true);
 		setError(null);
 		try {
-			const res = await fetch(assetUrl);
+			const res = await wsFetch(assetUrl);
 			if (!res.ok) throw new Error(`HTTP ${res.status}`);
 			const json = (await res.json()) as Notebook;
 			setNotebook(json);

package/.next/standalone/src/components/editor/office/docx-viewer.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { Loader2 } from "lucide-react";
+import { wsFetch } from "@/lib/workspace-client";
 import { useEffect, useRef, useState } from "react";
 import { OfficeChrome } from "./office-chrome";
 
@@ -28,7 +29,7 @@ export function DocxViewer({ path, title }: Props) {
 			try {
 				const [{ renderAsync }, res] = await Promise.all([
 					import("docx-preview"),
-					fetch(`/api/assets/${path}`),
+					wsFetch(`/api/assets/${path}`),
 				]);
 				if (cancelled) return;
 				if (!res.ok) throw new Error(`Failed to load file (${res.status})`);

package/.next/standalone/src/components/editor/office/office-chrome.tsx

@@ -3,6 +3,7 @@
 import { Download, ExternalLink, FolderOpen } from "lucide-react";
 import { ViewerToolbar } from "@/components/layout/viewer-toolbar";
 import { Button } from "@/components/ui/button";
+import { withWs, wsFetch } from "@/lib/workspace-client";
 
 interface OfficeChromeProps {
 	path: string;
@@ -20,12 +21,12 @@ export function OfficeChrome({
 	external,
 	hideFinder,
 }: OfficeChromeProps) {
-	const assetUrl = `/api/assets/${path}`;
+	const assetUrl = withWs(`/api/assets/${path}`);
 	const filename = path.split("/").pop() || path;
 
 	const revealInFinder = async () => {
 		try {
-			await fetch("/api/system/reveal", {
+			await wsFetch("/api/system/reveal", {
 				method: "POST",
 				headers: { "Content-Type": "application/json" },
 				body: JSON.stringify({ path }),

package/.next/standalone/src/components/editor/office/pptx-viewer.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { Loader2 } from "lucide-react";
+import { wsFetch } from "@/lib/workspace-client";
 import { useEffect, useRef, useState } from "react";
 import { OfficeChrome } from "./office-chrome";
 
@@ -28,7 +29,7 @@ export function PptxViewer({ path, title }: Props) {
 			try {
 				const [{ init }, res] = await Promise.all([
 					import("pptx-preview"),
-					fetch(`/api/assets/${path}`),
+					wsFetch(`/api/assets/${path}`),
 				]);
 				if (cancelled) return;
 				if (!res.ok) throw new Error(`Failed to load file (${res.status})`);

package/.next/standalone/src/components/editor/office/xlsx-viewer.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { Loader2 } from "lucide-react";
+import { wsFetch } from "@/lib/workspace-client";
 import { useEffect, useMemo, useState } from "react";
 import { cn } from "@/lib/utils";
 import { OfficeChrome } from "./office-chrome";
@@ -30,7 +31,7 @@ export function XlsxViewer({ path, title }: Props) {
 			try {
 				const [XLSX, res] = await Promise.all([
 					import("xlsx"),
-					fetch(`/api/assets/${path}`),
+					wsFetch(`/api/assets/${path}`),
 				]);
 				if (cancelled) return;
 				if (!res.ok) throw new Error(`Failed to load file (${res.status})`);

package/.next/standalone/src/components/editor/pdf-viewer.tsx

@@ -3,6 +3,7 @@
 import { ExternalLink } from "lucide-react";
 import { ViewerToolbar } from "@/components/layout/viewer-toolbar";
 import { Button } from "@/components/ui/button";
+import { withWs } from "@/lib/workspace-client";
 
 interface PdfViewerProps {
 	path: string;
@@ -10,7 +11,7 @@ interface PdfViewerProps {
 }
 
 export function PdfViewer({ path, title }: PdfViewerProps) {
-	const pdfSrc = `/api/assets/${path}`;
+	const pdfSrc = withWs(`/api/assets/${path}`);
 
 	return (
 		<div className="flex-1 flex flex-col overflow-hidden">

package/.next/standalone/src/components/editor/proof-span-popover.tsx

@@ -3,6 +3,7 @@
 import * as Popover from "@radix-ui/react-popover";
 import { useEffect, useState } from "react";
 import { authHeaders } from "@/lib/proof/client-auth";
+import { wsFetch } from "@/lib/workspace-client";
 
 interface SpanMeta {
 	spanId: string;
@@ -74,7 +75,7 @@ export function ProofSpanPopover({ targetEl, path, onClose, onComment }: Props)
 		if (busy || !meta) return;
 		setBusy(true);
 		try {
-			await fetch("/api/agent/internal/span", {
+			await wsFetch("/api/agent/internal/span", {
 				method: "POST",
 				headers: { "Content-Type": "application/json", ...authHeaders() },
 				body: JSON.stringify({

package/.next/standalone/src/components/editor/source-viewer.tsx

@@ -6,6 +6,7 @@ import { Check, Copy, Download, ExternalLink, WrapText } from "lucide-react";
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { ViewerToolbar } from "@/components/layout/viewer-toolbar";
 import { Button } from "@/components/ui/button";
+import { withWs, wsFetch } from "@/lib/workspace-client";
 
 interface SourceViewerProps {
 	path: string;
@@ -76,14 +77,14 @@ export function SourceViewer({ path }: SourceViewerProps) {
 	const [wrap, setWrap] = useState(false);
 	const [copied, setCopied] = useState(false);
 
-	const assetUrl = `/api/assets/${path}`;
+	const assetUrl = withWs(`/api/assets/${path}`);
 	const filename = path.split("/").pop() || path;
 	const language = detectLanguage(filename);
 
 	const fetchContent = useCallback(async () => {
 		setLoading(true);
 		try {
-			const res = await fetch(assetUrl);
+			const res = await wsFetch(assetUrl);
 			if (res.ok) {
 				const text = await res.text();
 				setContent(text);

package/.next/standalone/src/components/editor/suggest-edit-popover.tsx

@@ -4,6 +4,7 @@ import * as Popover from "@radix-ui/react-popover";
 import { useEffect, useRef, useState } from "react";
 import { authHeaders } from "@/lib/proof/client-auth";
 import { useProofStore } from "@/stores/proof-store";
+import { wsFetch } from "@/lib/workspace-client";
 import type { SuggestionKind } from "@/lib/proof/types";
 
 async function postOp(
@@ -12,7 +13,7 @@ async function postOp(
 	ops: object[],
 ): Promise<{ ok: boolean; stale: boolean; newRevision?: number }> {
 	const encoded = encodeURIComponent(path).replace(/%2F/g, "/");
-	const res = await fetch(`/api/agent/files/${encoded}`, {
+	const res = await wsFetch(`/api/agent/files/${encoded}`, {
 		method: "POST",
 		headers: {
 			"Content-Type": "application/json",

package/.next/standalone/src/components/editor/suggestion-card.tsx

@@ -2,6 +2,7 @@
 
 import { useState } from "react";
 import { authHeaders } from "@/lib/proof/client-auth";
+import { wsFetch } from "@/lib/workspace-client";
 import type { Suggestion } from "@/lib/proof/types";
 
 interface Props {
@@ -33,7 +34,7 @@ async function postOp(
 	suggestionId: string,
 ): Promise<{ ok: boolean; status: number }> {
 	const encodedPath = encodeURIComponent(path).replace(/%2F/g, "/");
-	const res = await fetch(`/api/agent/files/${encodedPath}`, {
+	const res = await wsFetch(`/api/agent/files/${encodedPath}`, {
 		method: "POST",
 		headers: {
 			"Content-Type": "application/json",

package/.next/standalone/src/components/editor/website-viewer.tsx

@@ -3,6 +3,7 @@
 import { ArrowLeft, ExternalLink } from "lucide-react";
 import { ViewerToolbar } from "@/components/layout/viewer-toolbar";
 import { Button } from "@/components/ui/button";
+import { withWs } from "@/lib/workspace-client";
 
 interface WebsiteViewerProps {
 	path: string;
@@ -20,7 +21,7 @@ export function WebsiteViewer({
 	fullscreen,
 	onExit,
 }: WebsiteViewerProps) {
-	const iframeSrc = src ?? `/api/assets/${path}/index.html`;
+	const iframeSrc = withWs(src ?? `/api/assets/${path}/index.html`);
 	const exitButton =
 		fullscreen && onExit ? (
 			<Button

package/.next/standalone/src/components/editor/wiki-link-create-dialog.tsx

@@ -14,6 +14,7 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { showError } from "@/lib/toast";
 import { useWikiSlugsStore } from "@/stores/wiki-slugs-store";
+import { wsFetch } from "@/lib/workspace-client";
 
 type Dir = "entities" | "concepts" | "comparisons";
 
@@ -74,7 +75,7 @@ export function useWikiLinkCreate(): {
 		const { slug, dir, title } = dialogState;
 		setIsSubmitting(true);
 		try {
-			const res = await fetch("/api/wiki/page", {
+			const res = await wsFetch("/api/wiki/page", {
 				method: "POST",
 				headers: { "Content-Type": "application/json" },
 				body: JSON.stringify({

package/.next/standalone/src/components/search/search-command-dialog.tsx

@@ -0,0 +1,109 @@
+"use client";
+
+/**
+ * Command palette (cmd+k / ctrl+k) for full-text search.
+ * Mounts once in the app shell; visibility is driven by the search store.
+ */
+import { useEffect } from "react";
+import {
+	CommandDialog,
+	CommandEmpty,
+	CommandGroup,
+	CommandInput,
+	CommandItem,
+	CommandList,
+} from "@/components/ui/command";
+import { useSearchStore } from "@/stores/search-store";
+import { SnippetText } from "./snippet-text";
+
+export function SearchCommandDialog({
+	onOpenFile,
+}: {
+	onOpenFile: (relPath: string) => void;
+}) {
+	const open = useSearchStore((s) => s.open);
+	const setOpen = useSearchStore((s) => s.setOpen);
+	const query = useSearchStore((s) => s.query);
+	const setQuery = useSearchStore((s) => s.setQuery);
+	const results = useSearchStore((s) => s.results);
+	const loading = useSearchStore((s) => s.loading);
+	const truncated = useSearchStore((s) => s.truncated);
+	const search = useSearchStore((s) => s.search);
+
+	// Global cmd+k / ctrl+k toggle.
+	useEffect(() => {
+		function onKey(e: KeyboardEvent) {
+			if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "k") {
+				e.preventDefault();
+				setOpen(!open);
+			}
+		}
+		window.addEventListener("keydown", onKey);
+		return () => window.removeEventListener("keydown", onKey);
+	}, [open, setOpen]);
+
+	// Debounced search as the query changes while the palette is open.
+	useEffect(() => {
+		if (!open) return;
+		const id = setTimeout(() => {
+			void search(query);
+		}, 120);
+		return () => clearTimeout(id);
+	}, [query, open, search]);
+
+	return (
+		<CommandDialog
+			open={open}
+			onOpenChange={setOpen}
+			// cmdk's built-in fuzzy filter would re-rank our BM25 results; disable it.
+			shouldFilter={false}
+		>
+			<CommandInput
+				placeholder="Search files…"
+				value={query}
+				onValueChange={setQuery}
+			/>
+			<CommandList>
+				{loading && (
+					<div className="px-3 py-2 text-xs text-muted-foreground">
+						Searching…
+					</div>
+				)}
+				{!loading && query.trim() !== "" && results.length === 0 && (
+					<CommandEmpty>No matches.</CommandEmpty>
+				)}
+				{results.length > 0 && (
+					<CommandGroup
+						heading={
+							truncated
+								? "Top results (refine query for more)"
+								: "Results"
+						}
+					>
+						{results.map((r) => (
+							<CommandItem
+								key={r.path}
+								value={r.path}
+								onSelect={() => {
+									onOpenFile(r.path);
+									setOpen(false);
+								}}
+							>
+								<div className="flex min-w-0 flex-col gap-0.5">
+									<span className="truncate font-mono text-xs">
+										{r.path}
+									</span>
+									{r.snippet && (
+										<span className="truncate text-xs text-muted-foreground">
+											<SnippetText html={r.snippet} />
+										</span>
+									)}
+								</div>
+							</CommandItem>
+						))}
+					</CommandGroup>
+				)}
+			</CommandList>
+		</CommandDialog>
+	);
+}