wiki-viewer 1.14.1 → 2.0.0

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

@@ -1,246 +0,0 @@
-"use client";
-
-/**
- * Command palette (cmd+k / ctrl+k) for full-text search + app actions.
- * Mounts once in the app shell; visibility is driven by the search store.
- *
- * Action mode activates when the query is empty or starts with ">".
- * New optional props let the parent wire page-level callbacks; they default
- * to no-ops so this component compiles without any parent changes.
- */
-import { useEffect } from "react";
-import {
-	AlignCenter,
-	Bot,
-	Copy,
-	FilePlus,
-	Moon,
-	PanelLeft,
-	Sun,
-} from "lucide-react";
-import { useTheme } from "next-themes";
-import {
-	CommandDialog,
-	CommandEmpty,
-	CommandGroup,
-	CommandInput,
-	CommandItem,
-	CommandList,
-	CommandSeparator,
-} from "@/components/ui/command";
-import { useSearchStore } from "@/stores/search-store";
-import { useAIPanelStore } from "@/stores/ai-panel-store";
-import {
-	useViewWidthStore,
-	VIEW_WIDTH_LABEL,
-	VIEW_WIDTH_ORDER,
-} from "@/stores/view-width-store";
-import { SnippetText } from "./snippet-text";
-
-export interface SearchCommandDialogProps {
-	onOpenFile: (relPath: string) => void;
-	/** Wire to page-level sidebar toggle. Defaults to no-op. */
-	onToggleSidebar?: () => void;
-	/** Wire to page-level new-file action. Defaults to no-op. */
-	onNewFile?: () => void;
-	/** Wire to page-level copy-path action. Defaults to no-op. */
-	onCopyPath?: () => void;
-}
-
-export function SearchCommandDialog({
-	onOpenFile,
-	onToggleSidebar = () => undefined,
-	onNewFile = () => undefined,
-	onCopyPath = () => undefined,
-}: SearchCommandDialogProps) {
-	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);
-
-	const { resolvedTheme, setTheme } = useTheme();
-	const toggleAIPanel = useAIPanelStore((s) => s.toggle);
-	const viewWidth = useViewWidthStore((s) => s.width);
-	const cycleViewWidth = useViewWidthStore((s) => s.cycle);
-
-	// Action mode: empty query or ">" prefix (VS Code convention).
-	const trimmed = query.trimStart();
-	const isActionMode = trimmed === "" || trimmed.startsWith(">");
-
-	// The bare text to actually search files (strip leading ">").
-	const fileQuery = isActionMode ? "" : query;
-
-	// 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 — only fires when NOT in action mode.
-	useEffect(() => {
-		if (!open) return;
-		if (isActionMode) return;
-		const id = setTimeout(() => {
-			void search(fileQuery);
-		}, 120);
-		return () => clearTimeout(id);
-	}, [fileQuery, isActionMode, open, search]);
-
-	// Helper: run action then close.
-	function runAction(fn: () => void) {
-		fn();
-		setOpen(false);
-		setQuery("");
-	}
-
-	// Next view-width label for display.
-	const nextWidthIdx =
-		(VIEW_WIDTH_ORDER.indexOf(viewWidth) + 1) % VIEW_WIDTH_ORDER.length;
-	const nextWidthLabel = VIEW_WIDTH_LABEL[VIEW_WIDTH_ORDER[nextWidthIdx]];
-
-	return (
-		<CommandDialog
-			open={open}
-			onOpenChange={(v) => {
-				setOpen(v);
-				if (!v) setQuery("");
-			}}
-			// cmdk's built-in fuzzy filter would re-rank our BM25 results; disable it.
-			shouldFilter={false}
-		>
-			<CommandInput
-				placeholder="Search files… ( > for actions )"
-				value={query}
-				onValueChange={setQuery}
-			/>
-			<CommandList>
-				{/* ── Action mode ─────────────────────────────────────── */}
-				{isActionMode && (
-					<CommandGroup heading="Actions">
-						<CommandItem
-							value="toggle-dark-mode"
-							onSelect={() =>
-								runAction(() =>
-									setTheme(resolvedTheme === "dark" ? "light" : "dark"),
-								)
-							}
-						>
-							{resolvedTheme === "dark" ? (
-								<Sun className="mr-2 h-4 w-4" />
-							) : (
-								<Moon className="mr-2 h-4 w-4" />
-							)}
-							{resolvedTheme === "dark"
-								? "Switch to light mode"
-								: "Switch to dark mode"}
-						</CommandItem>
-
-						<CommandItem
-							value="toggle-ai-panel"
-							onSelect={() => runAction(toggleAIPanel)}
-						>
-							<Bot className="mr-2 h-4 w-4" />
-							Toggle AI panel
-						</CommandItem>
-
-						<CommandItem
-							value="toggle-sidebar"
-							onSelect={() => runAction(onToggleSidebar)}
-						>
-							<PanelLeft className="mr-2 h-4 w-4" />
-							Toggle sidebar
-						</CommandItem>
-
-						<CommandItem
-							value="new-file"
-							onSelect={() => runAction(onNewFile)}
-						>
-							<FilePlus className="mr-2 h-4 w-4" />
-							New file
-						</CommandItem>
-
-						<CommandItem
-							value="copy-path"
-							onSelect={() => runAction(onCopyPath)}
-						>
-							<Copy className="mr-2 h-4 w-4" />
-							Copy current file path
-						</CommandItem>
-
-						<CommandItem
-							value="cycle-view-width"
-							onSelect={() => runAction(cycleViewWidth)}
-						>
-							<AlignCenter className="mr-2 h-4 w-4" />
-							<span>
-								Change view width{" "}
-								<span className="text-muted-foreground">
-									({VIEW_WIDTH_LABEL[viewWidth]} → {nextWidthLabel})
-								</span>
-							</span>
-						</CommandItem>
-					</CommandGroup>
-				)}
-
-				{/* ── File-search mode ────────────────────────────────── */}
-				{!isActionMode && (
-					<>
-						{loading && (
-							<div className="px-3 py-2 text-xs text-muted-foreground">
-								Searching…
-							</div>
-						)}
-						{!loading && fileQuery.trim() !== "" && results.length === 0 && (
-							<CommandEmpty>No matches.</CommandEmpty>
-						)}
-						{results.length > 0 && (
-							<>
-								<CommandSeparator />
-								<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);
-												setQuery("");
-											}}
-										>
-											<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>
-	);
-}

package/.next/standalone/src/components/search/sidebar-search-box.tsx

@@ -1,121 +0,0 @@
-"use client";
-
-/**
- * Persistent sidebar search box. Renders an inline results dropdown under the
- * input. Shares state with the cmd+k palette via the search store.
- * Supports keyboard navigation: ArrowUp / ArrowDown to move, Enter to open,
- * Escape to clear.
- */
-import { useEffect, useRef, useState } from "react";
-import { Search } from "lucide-react";
-import { useSearchStore } from "@/stores/search-store";
-import { SnippetText } from "./snippet-text";
-
-export function SidebarSearchBox({
-	onOpenFile,
-}: {
-	onOpenFile: (relPath: string) => void;
-}) {
-	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 search = useSearchStore((s) => s.search);
-	const clear = useSearchStore((s) => s.clear);
-
-	const [active, setActive] = useState(0);
-	const listRef = useRef<HTMLDivElement>(null);
-
-	// Reset / clamp the highlighted row whenever the result set changes.
-	useEffect(() => {
-		setActive(0);
-	}, [results]);
-
-	// Keep the active row scrolled into view.
-	useEffect(() => {
-		const el = listRef.current?.querySelector<HTMLElement>(
-			`[data-idx="${active}"]`,
-		);
-		el?.scrollIntoView({ block: "nearest" });
-	}, [active]);
-
-	function openAt(idx: number) {
-		const r = results[idx];
-		if (!r) return;
-		onOpenFile(r.path);
-		clear();
-	}
-
-	return (
-		<div className="flex flex-col gap-1 px-2 py-1.5">
-			<div className="relative">
-				<Search className="pointer-events-none absolute left-2 top-1/2 h-3.5 w-3.5 -translate-y-1/2 opacity-50" />
-				<input
-					type="text"
-					className="w-full rounded-sm border bg-transparent py-1 pl-7 pr-2 text-xs outline-none focus:ring-1 focus:ring-ring"
-					placeholder="Search… (⌘K)"
-					value={query}
-					onChange={(e) => {
-						setQuery(e.target.value);
-						void search(e.target.value);
-					}}
-					onKeyDown={(e) => {
-						if (e.key === "Escape") {
-							clear();
-							return;
-						}
-						if (results.length === 0) return;
-						if (e.key === "ArrowDown") {
-							e.preventDefault();
-							setActive((i) => (i + 1) % results.length);
-						} else if (e.key === "ArrowUp") {
-							e.preventDefault();
-							setActive((i) => (i - 1 + results.length) % results.length);
-						} else if (e.key === "Enter") {
-							e.preventDefault();
-							openAt(active);
-						}
-					}}
-				/>
-			</div>
-			{query.trim() !== "" && (
-				<div
-					ref={listRef}
-					className="max-h-64 overflow-y-auto rounded-sm border bg-popover"
-				>
-					{loading && (
-						<div className="px-2 py-1 text-xs text-muted-foreground">
-							Searching…
-						</div>
-					)}
-					{!loading && results.length === 0 && (
-						<div className="px-2 py-1 text-xs text-muted-foreground">
-							No matches
-						</div>
-					)}
-					{results.map((r, idx) => (
-						<button
-							key={r.path}
-							type="button"
-							data-idx={idx}
-							onClick={() => openAt(idx)}
-							onMouseEnter={() => setActive(idx)}
-							className={`block w-full px-2 py-1 text-left ${
-								idx === active ? "bg-accent" : "hover:bg-accent"
-							}`}
-						>
-							<div className="truncate font-mono text-xs">
-								{r.path}
-							</div>
-							{r.snippet && (
-								<div className="truncate text-[10px] text-muted-foreground">
-									<SnippetText html={r.snippet} />
-								</div>
-							)}
-						</button>
-					))}
-				</div>
-			)}
-		</div>
-	);
-}

package/.next/standalone/src/components/search/snippet-text.tsx

@@ -1,48 +0,0 @@
-/**
- * Safe renderer for FTS5 snippet() output.
- * Parses <mark>...</mark> tags from the snippet string without using
- * dangerouslySetInnerHTML. Any other HTML in source files is rendered as text.
- */
-
-interface Part {
-	text: string;
-	mark: boolean;
-}
-
-function parseSnippet(html: string): Part[] {
-	const parts: Part[] = [];
-	const re = /<mark>([\s\S]*?)<\/mark>/g;
-	let last = 0;
-	let m: RegExpExecArray | null;
-	while ((m = re.exec(html)) !== null) {
-		if (m.index > last) {
-			parts.push({ text: html.slice(last, m.index), mark: false });
-		}
-		parts.push({ text: m[1] ?? "", mark: true });
-		last = m.index + m[0].length;
-	}
-	if (last < html.length) {
-		parts.push({ text: html.slice(last), mark: false });
-	}
-	return parts;
-}
-
-export function SnippetText({ html }: { html: string }) {
-	const parts = parseSnippet(html);
-	return (
-		<>
-			{parts.map((p, i) =>
-				p.mark ? (
-					<mark
-						key={i}
-						className="bg-yellow-200 dark:bg-yellow-700 rounded-[2px] px-[1px]"
-					>
-						{p.text}
-					</mark>
-				) : (
-					<span key={i}>{p.text}</span>
-				),
-			)}
-		</>
-	);
-}