wiki-viewer 1.14.1 → 2.0.0

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

@@ -1,189 +0,0 @@
-"use client";
-
-import type React from "react";
-import { useCallback, useRef, useState } from "react";
-import { Button } from "@/components/ui/button";
-import {
-	DialogContent,
-	DialogFooter,
-	DialogHeader,
-	Dialog as DialogRoot,
-	DialogTitle,
-} from "@/components/ui/dialog";
-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";
-
-export interface WikiCreateResult {
-	ok: boolean;
-	slug: string;
-	dir?: Dir;
-}
-
-interface DialogState {
-	slug: string;
-	dir: Dir;
-	title: string;
-}
-
-function humanizeSlug(slug: string): string {
-	return slug
-		.split("-")
-		.filter(Boolean)
-		.map((part) => part.charAt(0).toUpperCase() + part.slice(1))
-		.join(" ");
-}
-
-const DIRS: Dir[] = ["entities", "concepts", "comparisons"];
-
-export function useWikiLinkCreate(): {
-	open: (slug: string) => Promise<WikiCreateResult>;
-	Dialog: React.ReactNode;
-} {
-	const [isOpen, setIsOpen] = useState(false);
-	const [dialogState, setDialogState] = useState<DialogState>({
-		slug: "",
-		dir: "entities",
-		title: "",
-	});
-	const [isSubmitting, setIsSubmitting] = useState(false);
-	const resolveRef = useRef<((result: WikiCreateResult) => void) | null>(null);
-
-	const open = useCallback((slug: string): Promise<WikiCreateResult> => {
-		setDialogState({
-			slug,
-			dir: "entities",
-			title: humanizeSlug(slug),
-		});
-		setIsOpen(true);
-		return new Promise<WikiCreateResult>((resolve) => {
-			resolveRef.current = resolve;
-		});
-	}, []);
-
-	const handleCancel = useCallback(() => {
-		setIsOpen(false);
-		resolveRef.current?.({ ok: false, slug: dialogState.slug });
-		resolveRef.current = null;
-	}, [dialogState.slug]);
-
-	const handleCreate = useCallback(async () => {
-		const { slug, dir, title } = dialogState;
-		setIsSubmitting(true);
-		try {
-			const res = await wsFetch("/api/wiki/page", {
-				method: "POST",
-				headers: { "Content-Type": "application/json" },
-				body: JSON.stringify({
-					slug,
-					dir,
-					title: title.trim() || undefined,
-				}),
-			});
-
-			if (res.ok || res.status === 409) {
-				// 409 means the page already exists — still a success from our POV
-				const store = useWikiSlugsStore.getState();
-				store.invalidate();
-				void store.load();
-				setIsOpen(false);
-				resolveRef.current?.({ ok: true, slug, dir });
-				resolveRef.current = null;
-			} else {
-				const data: unknown = await res.json().catch(() => ({}));
-				const msg =
-					data !== null &&
-					typeof data === "object" &&
-					"error" in data &&
-					typeof (data as { error: unknown }).error === "string"
-						? (data as { error: string }).error
-						: "Failed to create page";
-				showError(msg);
-			}
-		} catch {
-			showError("Failed to create page");
-		} finally {
-			setIsSubmitting(false);
-		}
-	}, [dialogState]);
-
-	const dialogNode = (
-		<DialogRoot
-			open={isOpen}
-			onOpenChange={(v) => {
-				if (!v) handleCancel();
-			}}
-		>
-			<DialogContent>
-				<DialogHeader>
-					<DialogTitle>Create wiki page</DialogTitle>
-				</DialogHeader>
-
-				<div className="space-y-4 py-2">
-					<div className="space-y-1.5">
-						<Label htmlFor="wiki-create-slug">Slug</Label>
-						<Input
-							id="wiki-create-slug"
-							value={dialogState.slug}
-							readOnly
-							className="bg-muted cursor-default select-all"
-						/>
-					</div>
-
-					<div className="space-y-1.5">
-						<Label>Directory</Label>
-						<div className="flex gap-4">
-							{DIRS.map((d) => (
-								<label
-									key={d}
-									className="flex items-center gap-1.5 text-sm cursor-pointer"
-								>
-									<input
-										type="radio"
-										name="wiki-create-dir"
-										value={d}
-										checked={dialogState.dir === d}
-										onChange={() => setDialogState((s) => ({ ...s, dir: d }))}
-										className="accent-primary"
-									/>
-									{d}
-								</label>
-							))}
-						</div>
-					</div>
-
-					<div className="space-y-1.5">
-						<Label htmlFor="wiki-create-title">Title (optional)</Label>
-						<Input
-							id="wiki-create-title"
-							value={dialogState.title}
-							onChange={(e) =>
-								setDialogState((s) => ({ ...s, title: e.target.value }))
-							}
-							placeholder="Humanized title..."
-						/>
-					</div>
-				</div>
-
-				<DialogFooter>
-					<Button
-						variant="outline"
-						onClick={handleCancel}
-						disabled={isSubmitting}
-					>
-						Cancel
-					</Button>
-					<Button onClick={() => void handleCreate()} disabled={isSubmitting}>
-						{isSubmitting ? "Creating..." : "Create"}
-					</Button>
-				</DialogFooter>
-			</DialogContent>
-		</DialogRoot>
-	);
-
-	return { open, Dialog: dialogNode };
-}

package/.next/standalone/src/components/editor/wiki-link-decorator.ts

@@ -1,79 +0,0 @@
-import type { EditorState, Transaction } from "@tiptap/pm/state";
-import { Plugin, PluginKey } from "@tiptap/pm/state";
-import { Decoration, DecorationSet } from "@tiptap/pm/view";
-import { useWikiSlugsStore } from "@/stores/wiki-slugs-store";
-
-const WIKI_LINK_DECORATOR_KEY = new PluginKey<DecorationSet>(
-	"wikiLinkDecorator",
-);
-
-const REFRESH_META = "wikiLinkDecorator:refresh";
-
-/**
- * Walk the doc, find every wikiLink mark, and emit an inline decoration
- * carrying data-broken="true" for any slug not in the slug index store.
- *
- * Decorations apply attributes during ProseMirror's own DOM render pass,
- * so they don't trigger the MutationObserver feedback loop that direct
- * setAttribute would.
- */
-function buildDecorations(state: EditorState): DecorationSet {
-	const { has } = useWikiSlugsStore.getState();
-	const markType = state.schema.marks.wikiLink;
-	if (!markType) return DecorationSet.empty;
-
-	const decorations: Decoration[] = [];
-	state.doc.descendants((node, pos) => {
-		if (!node.isText) return;
-		const mark = node.marks.find((m) => m.type === markType);
-		if (!mark) return;
-		const slug = mark.attrs.slug as string | undefined;
-		if (!slug || has(slug)) return;
-		decorations.push(
-			Decoration.inline(pos, pos + node.nodeSize, {
-				"data-broken": "true",
-			}),
-		);
-	});
-
-	return DecorationSet.create(state.doc, decorations);
-}
-
-/**
- * Plugin that marks wiki-links as broken when their slug is absent from
- * the slug index. Recomputes on doc changes and when the slug store
- * signals a refresh via a meta-only transaction.
- */
-export function wikiLinkDecoratorPlugin(): Plugin {
-	return new Plugin<DecorationSet>({
-		key: WIKI_LINK_DECORATOR_KEY,
-		state: {
-			init: (_config, state) => buildDecorations(state),
-			apply(tr: Transaction, old: DecorationSet, _oldState, newState) {
-				if (tr.getMeta(REFRESH_META)) return buildDecorations(newState);
-				if (!tr.docChanged) return old.map(tr.mapping, tr.doc);
-				return buildDecorations(newState);
-			},
-		},
-		props: {
-			decorations(state) {
-				return WIKI_LINK_DECORATOR_KEY.getState(state) ?? DecorationSet.empty;
-			},
-		},
-		view(editorView) {
-			// Subscribe to slug-store changes. When the index loads or
-			// invalidates, dispatch a meta-only transaction so the plugin
-			// state recomputes against the latest snapshot.
-			const unsubscribe = useWikiSlugsStore.subscribe(() => {
-				const tr = editorView.state.tr.setMeta(REFRESH_META, true);
-				editorView.dispatch(tr);
-			});
-
-			return {
-				destroy() {
-					unsubscribe();
-				},
-			};
-		},
-	});
-}

package/.next/standalone/src/components/editor/wiki-link-extension.ts

@@ -1,120 +0,0 @@
-import { InputRule, Mark, mergeAttributes } from "@tiptap/core";
-import { wikiLinkDecoratorPlugin } from "./wiki-link-decorator";
-
-// Matches: [[slug]]  [[slug|alias]]  [[slug#anchor]]
-// Groups:  1=slug    2=alias         3=anchor
-const INPUT_RULE_REGEX = /\[\[([a-z0-9-]+)(?:\|([^\]#|]+)|#([a-z0-9-]+))?\]\]$/;
-
-declare module "@tiptap/core" {
-	interface Commands<ReturnType> {
-		wikiLink: {
-			/** Apply a wiki-link mark to the current selection. */
-			setWikiLink: (attrs: {
-				slug: string;
-				alias?: string | null;
-				anchor?: string | null;
-			}) => ReturnType;
-			/** Remove the wiki-link mark from the current selection. */
-			unsetWikiLink: () => ReturnType;
-		};
-	}
-}
-
-export const WikiLink = Mark.create({
-	name: "wikiLink",
-	priority: 1000,
-	keepOnSplit: false,
-	inclusive: false,
-
-	addAttributes() {
-		return {
-			slug: {
-				default: null,
-				parseHTML: (element) => element.getAttribute("data-slug"),
-				renderHTML: (attributes) => ({
-					"data-slug": attributes.slug,
-				}),
-			},
-			alias: {
-				default: null,
-				parseHTML: (element) => element.getAttribute("data-alias"),
-				renderHTML: (attributes) =>
-					attributes.alias != null ? { "data-alias": attributes.alias } : {},
-			},
-			anchor: {
-				default: null,
-				parseHTML: (element) => element.getAttribute("data-anchor"),
-				renderHTML: (attributes) =>
-					attributes.anchor != null ? { "data-anchor": attributes.anchor } : {},
-			},
-		};
-	},
-
-	parseHTML() {
-		return [{ tag: 'a[data-wiki-link="true"]' }];
-	},
-
-	renderHTML({ HTMLAttributes }) {
-		const slug = String(HTMLAttributes["data-slug"] ?? "");
-		const anchor =
-			HTMLAttributes["data-anchor"] != null
-				? String(HTMLAttributes["data-anchor"])
-				: null;
-		const href = anchor ? `#wiki:${slug}#${anchor}` : `#wiki:${slug}`;
-		return [
-			"a",
-			mergeAttributes(HTMLAttributes, {
-				"data-wiki-link": "true",
-				href,
-				class: "wiki-link",
-			}),
-			0,
-		];
-	},
-
-	addInputRules() {
-		// markInputRule always uses the last capture group as visible text and
-		// cannot produce variable text per form ([[slug]] vs [[slug|alias]] vs
-		// [[slug#anchor]]). A raw InputRule is required here.
-		return [
-			new InputRule({
-				find: INPUT_RULE_REGEX,
-				handler: ({ state, range, match }) => {
-					const slug: string = match[1] ?? "";
-					const alias: string | null = match[2] ?? null;
-					const anchor: string | null = match[3] ?? null;
-					const visibleText = alias ?? (anchor ? `${slug}#${anchor}` : slug);
-					const { tr } = state;
-					tr.replaceWith(
-						range.from,
-						range.to,
-						state.schema.text(visibleText, [
-							this.type.create({ slug, alias, anchor }),
-						]),
-					);
-				},
-			}),
-		];
-	},
-
-	addProseMirrorPlugins() {
-		return [wikiLinkDecoratorPlugin()];
-	},
-
-	addCommands() {
-		return {
-			setWikiLink:
-				(attrs) =>
-				({ commands }) =>
-					commands.setMark(this.name, {
-						slug: attrs.slug,
-						alias: attrs.alias ?? null,
-						anchor: attrs.anchor ?? null,
-					}),
-			unsetWikiLink:
-				() =>
-				({ commands }) =>
-					commands.unsetMark(this.name),
-		};
-	},
-});

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

@@ -1,250 +0,0 @@
-"use client";
-
-import type { Editor } from "@tiptap/react";
-import { useCallback, useEffect, useRef, useState } from "react";
-import { cn } from "@/lib/utils";
-import { useWikiSlugsStore } from "@/stores/wiki-slugs-store";
-import type { WikiCreateResult } from "./wiki-link-create-dialog";
-
-interface WikiLinkPickerProps {
-	editor: Editor | null;
-	onCreateRequest: (slug: string) => Promise<WikiCreateResult>;
-}
-
-const SLUG_RE = /^[a-z0-9-]+$/;
-const MAX_RESULTS = 20;
-
-function fuzzyMatch(slug: string, query: string): boolean {
-	if (!query) return true;
-	return slug.includes(query.toLowerCase());
-}
-
-export function WikiLinkPicker({
-	editor,
-	onCreateRequest,
-}: WikiLinkPickerProps) {
-	const [open, setOpen] = useState(false);
-	const [query, setQuery] = useState("");
-	const [selectedIndex, setSelectedIndex] = useState(0);
-	const [position, setPosition] = useState({ top: 0, left: 0 });
-	const menuRef = useRef<HTMLDivElement>(null);
-
-	// triggerFrom: doc position immediately after `[[` is fully inserted.
-	// Calculated as `from + 1` at the moment the second `[` keydown fires.
-	const triggerFromRef = useRef<number>(0);
-
-	const slugs = useWikiSlugsStore((s) => s.slugs);
-	const slugDir = useWikiSlugsStore((s) => s.slugDir);
-	const has = useWikiSlugsStore((s) => s.has);
-
-	const allSlugs = Array.from(slugs).sort();
-	const filtered = allSlugs
-		.filter((s) => fuzzyMatch(s, query))
-		.slice(0, MAX_RESULTS);
-
-	const canCreate = query.length > 0 && SLUG_RE.test(query) && !has(query);
-	const totalItems = filtered.length + (canCreate ? 1 : 0);
-
-	const handleClose = useCallback(() => {
-		setOpen(false);
-		setQuery("");
-		setSelectedIndex(0);
-	}, []);
-
-	const insertWikiLink = useCallback(
-		(slug: string) => {
-			if (!editor) return;
-			const { from } = editor.state.selection;
-			// Delete the `[[query` range and replace with the wiki-link mark.
-			const start = triggerFromRef.current - 2; // back over [[
-			const markType = editor.state.schema.marks.wikiLink;
-			if (!markType) return;
-			const mark = markType.create({ slug, alias: null, anchor: null });
-			const node = editor.state.schema.text(slug, [mark]);
-			const tr = editor.state.tr.replaceWith(start, from, node);
-			editor.view.dispatch(tr);
-			editor.commands.focus();
-			handleClose();
-		},
-		[editor, handleClose],
-	);
-
-	const handleSelect = useCallback(
-		async (index: number) => {
-			if (!editor) return;
-			if (index < filtered.length) {
-				insertWikiLink(filtered[index] ?? "");
-			} else if (canCreate) {
-				// Delegate to create dialog; insert mark on success.
-				const result = await onCreateRequest(query);
-				if (result.ok) {
-					insertWikiLink(result.slug);
-				} else {
-					handleClose();
-				}
-			}
-		},
-		[
-			editor,
-			filtered,
-			canCreate,
-			query,
-			insertWikiLink,
-			onCreateRequest,
-			handleClose,
-		],
-	);
-
-	useEffect(() => {
-		if (!editor) return;
-
-		const handleKeyDown = (event: KeyboardEvent) => {
-			if (!open) {
-				// Detect second `[` — trigger is `[[`
-				if (event.key === "[") {
-					const { from } = editor.state.selection;
-					const textBefore = editor.state.doc.textBetween(
-						Math.max(0, from - 1),
-						from,
-					);
-					if (textBefore !== "[") return;
-
-					// Skip if cursor is inside an existing wikiLink mark
-					const $pos = editor.state.doc.resolve(from);
-					const insideWikiLink = $pos
-						.marks()
-						.some((m) => m.type.name === "wikiLink");
-					if (insideWikiLink) return;
-
-					const coords = editor.view.coordsAtPos(from);
-					const editorRect = editor.view.dom.getBoundingClientRect();
-					setPosition({
-						top: coords.bottom - editorRect.top + 4,
-						left: coords.left - editorRect.left,
-					});
-					// After keydown resolves, the second `[` will be inserted
-					// moving the cursor to `from + 1`.
-					triggerFromRef.current = from + 1;
-					setOpen(true);
-					setQuery("");
-					setSelectedIndex(0);
-				}
-				return;
-			}
-
-			// Picker is open — handle navigation keys
-			if (event.key === "ArrowDown") {
-				event.preventDefault();
-				setSelectedIndex((i) => (totalItems > 0 ? (i + 1) % totalItems : 0));
-			} else if (event.key === "ArrowUp") {
-				event.preventDefault();
-				setSelectedIndex((i) =>
-					totalItems > 0 ? (i - 1 + totalItems) % totalItems : 0,
-				);
-			} else if (event.key === "Enter") {
-				event.preventDefault();
-				event.stopPropagation();
-				if (totalItems > 0) {
-					void handleSelect(selectedIndex);
-				}
-			} else if (event.key === "Escape") {
-				handleClose();
-			} else if (event.key === "]") {
-				// Closing bracket dismisses without inserting
-				handleClose();
-			} else if (event.key === "Backspace") {
-				if (query.length === 0) {
-					handleClose();
-				} else {
-					setQuery((q) => q.slice(0, -1));
-					setSelectedIndex(0);
-				}
-			} else if (event.key.length === 1 && !event.metaKey && !event.ctrlKey) {
-				setQuery((q) => q + event.key);
-				setSelectedIndex(0);
-			}
-		};
-
-		window.addEventListener("keydown", handleKeyDown, true);
-		return () => window.removeEventListener("keydown", handleKeyDown, true);
-	}, [
-		editor,
-		open,
-		query,
-		selectedIndex,
-		totalItems,
-		handleClose,
-		handleSelect,
-	]);
-
-	// Close on outside click
-	useEffect(() => {
-		if (!open) return;
-		const handleMouseDown = (e: MouseEvent) => {
-			if (menuRef.current && !menuRef.current.contains(e.target as Node)) {
-				handleClose();
-			}
-		};
-		window.addEventListener("mousedown", handleMouseDown);
-		return () => window.removeEventListener("mousedown", handleMouseDown);
-	}, [open, handleClose]);
-
-	if (!open || totalItems === 0) return null;
-
-	return (
-		<div
-			ref={menuRef}
-			className="absolute z-50 w-[280px] bg-popover border border-border rounded-lg shadow-lg py-1 overflow-hidden max-h-[300px] overflow-y-auto"
-			style={{ top: position.top, left: position.left }}
-		>
-			{filtered.map((slug, i) => {
-				const dir = slugDir.get(slug);
-				return (
-					<button
-						key={slug}
-						type="button"
-						onMouseDown={(e) => {
-							e.preventDefault();
-							void handleSelect(i);
-						}}
-						onMouseEnter={() => setSelectedIndex(i)}
-						className={cn(
-							"flex items-center justify-between w-full px-3 py-1.5 text-left text-sm transition-colors",
-							i === selectedIndex
-								? "bg-accent text-accent-foreground"
-								: "hover:bg-accent/50",
-						)}
-					>
-						<span className="truncate">{slug}</span>
-						{dir && (
-							<span className="ml-2 shrink-0 text-[10px] text-muted-foreground bg-muted px-1.5 py-0.5 rounded">
-								{dir}
-							</span>
-						)}
-					</button>
-				);
-			})}
-
-			{canCreate && (
-				<button
-					type="button"
-					onMouseDown={(e) => {
-						e.preventDefault();
-						void handleSelect(filtered.length);
-					}}
-					onMouseEnter={() => setSelectedIndex(filtered.length)}
-					className={cn(
-						"flex items-center w-full px-3 py-1.5 text-left text-sm transition-colors",
-						filtered.length === selectedIndex
-							? "bg-accent text-accent-foreground"
-							: "hover:bg-accent/50",
-					)}
-				>
-					<span className="text-muted-foreground">
-						+ Create new &ldquo;{query}&rdquo;
-					</span>
-				</button>
-			)}
-		</div>
-	);
-}

package/.next/standalone/src/components/layout/viewer-toolbar.tsx

@@ -1,54 +0,0 @@
-"use client";
-
-import type { ReactNode } from "react";
-import { cn } from "@/lib/utils";
-
-// Simplified toolbar stub used by the ported viewer components.
-// Replace with a fuller implementation if navigation breadcrumbs are needed.
-
-export function ViewerToolbar({
-	path,
-	badge,
-	sublabel,
-	showBreadcrumb: _showBreadcrumb = true,
-	leading,
-	children,
-	className,
-}: {
-	path?: string;
-	badge?: string;
-	sublabel?: string;
-	showBreadcrumb?: boolean;
-	leading?: ReactNode;
-	children?: ReactNode;
-	className?: string;
-}) {
-	return (
-		<div
-			className={cn(
-				"flex shrink-0 items-center justify-between gap-3 border-b border-border bg-background px-4 py-2",
-				className,
-			)}
-		>
-			<div className="flex min-w-0 flex-1 items-center gap-2">
-				{leading}
-				{path && (
-					<span className="text-xs text-muted-foreground truncate" title={path}>
-						{path.split("/").pop() ?? path}
-					</span>
-				)}
-				{badge && (
-					<span className="shrink-0 rounded bg-muted px-1.5 py-0.5 text-xs text-muted-foreground/50">
-						{badge}
-					</span>
-				)}
-				{sublabel && (
-					<span className="shrink-0 text-xs text-muted-foreground/40">
-						{sublabel}
-					</span>
-				)}
-			</div>
-			<div className="flex shrink-0 items-center gap-1">{children}</div>
-		</div>
-	);
-}