opencode-session-port 0.0.0-stage → 0.1.0

package/src/tui/ui/password-dialog.tsx

@@ -0,0 +1,251 @@
+import type { Plugin } from "@opencode/plugin/tui";
+import { useKeyboard, usePaste, type JSX } from "@opentui/solid";
+import { createMemo, createSignal, onCleanup } from "solid-js";
+import {
+	showPasswordPrompt,
+	type PasswordMode,
+	type PasswordPromptState,
+} from "./password-flow.ts";
+
+type Context = Plugin.Context;
+
+const palette = {
+	background: "#111922",
+	field: "#202d3b",
+	edge: "#344557",
+	accent: "#53d6c3",
+	text: "#edf3f7",
+	muted: "#94a4b2",
+	gold: "#e5be76",
+} as const;
+
+interface PasswordDialogProps {
+	readonly mode: PasswordMode;
+	readonly maxPasswordBytes: number;
+	readonly prompt: PasswordPromptState;
+	readonly accept: (password: Uint8Array) => void;
+	readonly cancel: () => void;
+}
+
+interface PasswordFieldProps {
+	readonly label: string;
+	readonly active: boolean;
+	/** A mask from PasswordPromptState; never pass the entered password here. */
+	readonly displayMask: string;
+	readonly emptyHint: string;
+}
+
+interface ConsumableKeyEvent {
+	preventDefault(): void;
+	stopPropagation(): void;
+}
+
+function consumeKey(event: ConsumableKeyEvent): void {
+	event.preventDefault();
+	event.stopPropagation();
+}
+
+function formatByteLimit(maxPasswordBytes: number): string {
+	return maxPasswordBytes % 1024 === 0
+		? `${maxPasswordBytes / 1024} KiB`
+		: `${maxPasswordBytes} bytes`;
+}
+
+function PasswordField(props: PasswordFieldProps) {
+	return (
+		<box
+			flexDirection="column"
+			border
+			borderStyle="rounded"
+			borderColor={props.active ? palette.accent : palette.edge}
+			backgroundColor={palette.field}
+			paddingX={1}
+			paddingY={0}
+		>
+			<box flexDirection="row" gap={1}>
+				<text fg={props.active ? palette.accent : palette.muted}>
+					{props.active ? ">" : " "}
+				</text>
+				<text fg={props.active ? palette.text : palette.muted}>{props.label}</text>
+			</box>
+			<text fg={props.displayMask ? palette.text : palette.muted}>
+				{props.displayMask || props.emptyHint}
+				{props.active ? "▏" : ""}
+			</text>
+		</box>
+	);
+}
+
+function PasswordDialog(props: PasswordDialogProps) {
+	const [revision, setRevision] = createSignal(0);
+	const view = createMemo(() => {
+		revision();
+		return props.prompt.snapshot();
+	});
+	const refresh = () => setRevision((current) => current + 1);
+
+	const submit = () => {
+		const result = props.prompt.submit();
+		refresh();
+		if (result.status === "accepted") props.accept(result.password);
+	};
+
+	onCleanup(() => props.prompt.dispose());
+
+	useKeyboard((event) => {
+		const key = event.name.toLowerCase();
+
+		if (key === "escape" || key === "esc") {
+			consumeKey(event);
+			props.cancel();
+			return;
+		}
+		if (key === "enter" || key === "return") {
+			consumeKey(event);
+			submit();
+			return;
+		}
+		if (key === "tab") {
+			consumeKey(event);
+			props.prompt.switchField();
+			refresh();
+			return;
+		}
+		if (key === "backspace") {
+			consumeKey(event);
+			props.prompt.backspace();
+			refresh();
+			return;
+		}
+		if (event.ctrl && key === "u") {
+			consumeKey(event);
+			props.prompt.clearActive();
+			refresh();
+			return;
+		}
+		if (event.ctrl || event.meta) return;
+
+		const text = event.sequence;
+		if (text && !/[\u0000-\u001f\u007f-\u009f]/u.test(text)) {
+			consumeKey(event);
+			props.prompt.insert(text);
+			refresh();
+		}
+	});
+
+	usePaste((event) => {
+		// Prevent the paste from reaching other handlers. Decode strictly and
+		// keep only the mask in state exposed to the rendered tree.
+		event.preventDefault();
+		event.stopPropagation();
+		props.prompt.insertPasteBytes(event.bytes);
+		refresh();
+	});
+
+	return (
+		<box
+			flexDirection="column"
+			width={62}
+			gap={1}
+			border
+			borderStyle="rounded"
+			borderColor={palette.edge}
+			backgroundColor={palette.background}
+			paddingX={2}
+			paddingY={1}
+		>
+			<box flexDirection="row" justifyContent="space-between">
+				<text fg={palette.accent}>SESSIONPORT</text>
+				<text fg={palette.muted}>
+					{props.mode === "checkpoint" ? "CHECKPOINT" : "RESTORE"}
+				</text>
+			</box>
+
+			<box flexDirection="column" gap={0}>
+				<text fg={palette.text}>Password</text>
+				<text fg={palette.muted}>
+					{props.mode === "checkpoint"
+						? "Choose a password to protect this checkpoint."
+						: "Enter the password used to create this checkpoint."}
+				</text>
+				{props.mode === "checkpoint" && (
+					<>
+						<text fg={palette.muted}>
+							Use a longer password you do not reuse elsewhere.
+						</text>
+						<text fg={palette.muted}>
+							Password strength is not checked.
+						</text>
+					</>
+				)}
+				<text fg={palette.muted}>SessionPort cannot recover a lost password.</text>
+				<text fg={palette.muted}>You can type or paste; your entry stays masked.</text>
+				<text fg={palette.muted}>
+					Password entries are limited to {formatByteLimit(props.maxPasswordBytes)} of UTF-8.
+				</text>
+			</box>
+
+			<PasswordField
+				label="Password"
+				active={view().activeField === "password"}
+				displayMask={view().passwordMask}
+				emptyHint="Type a password"
+			/>
+
+			{props.mode === "checkpoint" && (
+				<PasswordField
+					label="Confirm password"
+					active={view().activeField === "confirmation"}
+					displayMask={view().confirmationMask ?? ""}
+					emptyHint="Type it again"
+				/>
+			)}
+
+			<box flexDirection="row" minHeight={1}>
+				<text fg={view().message ? palette.gold : palette.muted}>
+					{view().message ?? " "}
+				</text>
+			</box>
+
+			<box flexDirection="row" justifyContent="space-between">
+				<text fg={palette.muted}>
+					{props.mode === "checkpoint" ? "Tab: switch fields · Esc: cancel" : "Esc: cancel"}
+				</text>
+				<text fg={palette.accent}>
+					{props.mode === "restore"
+						? "ENTER  CONTINUE"
+						: view().activeField === "password"
+							? "ENTER  NEXT"
+							: "ENTER  CREATE"}
+				</text>
+			</box>
+			<text fg={palette.muted}>
+				Backspace: delete · Ctrl+U: clear · Paste: allowed
+			</text>
+		</box>
+	);
+}
+
+/** Request one password entry (or a matching checkpoint confirmation). */
+export function requestPassword(
+	context: Context,
+	mode: "checkpoint" | "restore",
+	maxPasswordBytes = 4096,
+): Promise<Uint8Array | undefined> {
+	context.ui.dialog.set({ size: "medium", centered: true });
+
+	return showPasswordPrompt<JSX.Element>(
+		context.ui.dialog,
+		mode,
+		(prompt, accept, cancel) => (
+			<PasswordDialog
+				mode={mode}
+				maxPasswordBytes={maxPasswordBytes}
+				prompt={prompt}
+				accept={accept}
+				cancel={cancel}
+			/>
+		),
+		maxPasswordBytes,
+	);
+}

package/src/tui/ui/password-flow.ts

@@ -0,0 +1,288 @@
+/**
+ * Secret-entry state for the password dialog.
+ *
+ * This module deliberately exposes masks and actions, never password strings.
+ * JavaScript strings cannot be reliably zeroed; dispose() drops the owned
+ * references as a best-effort cleanup, not a secure-erasure guarantee.
+ */
+
+export type PasswordMode = "checkpoint" | "restore";
+
+export type PasswordField = "password" | "confirmation";
+
+export interface PasswordPromptSnapshot {
+	readonly mode: PasswordMode;
+	readonly activeField: PasswordField;
+	readonly passwordMask: string;
+	readonly confirmationMask?: string;
+	readonly message?: string;
+	readonly closed: boolean;
+}
+
+export type PasswordSubmission =
+	| { readonly status: "confirmation-required" }
+	| { readonly status: "mismatch" }
+	| { readonly status: "invalid-encoding" }
+	| { readonly status: "accepted"; readonly password: Uint8Array }
+	| { readonly status: "closed" };
+
+const MASK_GLYPH = "●";
+const MISMATCH_MESSAGE = "The entries did not match. Try again.";
+const INVALID_PASTE_MESSAGE = "Paste was not valid UTF-8 and was not added.";
+const INVALID_ENCODING_MESSAGE = "Password contains invalid Unicode and cannot be encoded as UTF-8.";
+const PASSWORD_LIMIT_MESSAGE = "Password limit reached. Remove some text before adding more.";
+
+/**
+ * Count the bytes TextEncoder would produce, stopping as soon as the supplied
+ * limit is exceeded. Unpaired surrogates count as their UTF-8 replacement
+ * character here; submit() still rejects them as invalid Unicode.
+ */
+function utf8ByteLengthWithin(value: string, limit: number): number | undefined {
+	let byteLength = 0;
+	for (let index = 0; index < value.length; index += 1) {
+		const unit = value.charCodeAt(index);
+		let bytes: number;
+
+		if (unit <= 0x7f) {
+			bytes = 1;
+		} else if (unit <= 0x7ff) {
+			bytes = 2;
+		} else if (unit >= 0xd800 && unit <= 0xdbff) {
+			const next = value.charCodeAt(index + 1);
+			if (next >= 0xdc00 && next <= 0xdfff) {
+				bytes = 4;
+				index += 1;
+			} else {
+				bytes = 3;
+			}
+		} else {
+			// BMP characters and isolated low surrogates (TextEncoder replacement).
+			bytes = 3;
+		}
+
+		// Subtraction keeps the addition bounded even for very large input.
+		if (bytes > limit - byteLength) return undefined;
+		byteLength += bytes;
+	}
+	return byteLength;
+}
+
+function isWellFormedUnicode(value: string): boolean {
+	for (let index = 0; index < value.length; index += 1) {
+		const unit = value.charCodeAt(index);
+		if (unit >= 0xd800 && unit <= 0xdbff) {
+			const next = value.charCodeAt(index + 1);
+			if (!(next >= 0xdc00 && next <= 0xdfff)) return false;
+			index += 1;
+		} else if (unit >= 0xdc00 && unit <= 0xdfff) {
+			return false;
+		}
+	}
+	return true;
+}
+
+function mask(value: string): string {
+	// One mask per Unicode code point keeps surrogate pairs intact and never
+	// includes any part of the entered value in a rendered string.
+	return MASK_GLYPH.repeat(Array.from(value).length);
+}
+
+/** Owns the one or two secret strings for a single modal session. */
+export class PasswordPromptState {
+	readonly #mode: PasswordMode;
+	readonly #maxPasswordBytes: number;
+	#password = "";
+	#confirmation = "";
+	#activeField: PasswordField = "password";
+	#message: string | undefined;
+	#closed = false;
+
+	constructor(mode: PasswordMode, maxPasswordBytes = 4096) {
+		if (!Number.isSafeInteger(maxPasswordBytes) || maxPasswordBytes < 0) {
+			throw new RangeError("maxPasswordBytes must be a non-negative safe integer");
+		}
+		this.#mode = mode;
+		this.#maxPasswordBytes = maxPasswordBytes;
+	}
+
+	snapshot(): PasswordPromptSnapshot {
+		const shared = {
+			mode: this.#mode,
+			activeField: this.#activeField,
+			passwordMask: mask(this.#password),
+			message: this.#message,
+			closed: this.#closed,
+		};
+
+		return Object.freeze(
+			this.#mode === "checkpoint"
+				? { ...shared, confirmationMask: mask(this.#confirmation) }
+				: shared,
+		);
+	}
+
+	/** Add keyboard or pasted text exactly as supplied; no normalization/filtering. */
+	insert(text: string): void {
+		if (this.#closed || text.length === 0) return;
+		const isConfirmation = this.#mode === "checkpoint" && this.#activeField === "confirmation";
+		const currentValue = isConfirmation ? this.#confirmation : this.#password;
+		const currentByteLength = utf8ByteLengthWithin(currentValue, this.#maxPasswordBytes);
+		const additionalByteLength =
+			currentByteLength === undefined
+				? undefined
+				: utf8ByteLengthWithin(text, this.#maxPasswordBytes - currentByteLength);
+
+		if (additionalByteLength === undefined) {
+			this.#message = PASSWORD_LIMIT_MESSAGE;
+			return;
+		}
+
+		this.#message = undefined;
+		if (isConfirmation) {
+			this.#confirmation += text;
+			return;
+		}
+		this.#password += text;
+	}
+
+	/**
+	 * Decode pasted bytes as strict UTF-8 without stripping a leading BOM.
+	 * Invalid byte sequences fail closed and leave the current field unchanged.
+	 */
+	insertPasteBytes(bytes: Uint8Array): void {
+		if (this.#closed || bytes.length === 0) return;
+
+		try {
+			const text = new TextDecoder("utf-8", { fatal: true, ignoreBOM: true }).decode(bytes);
+			this.insert(text);
+		} catch {
+			this.#message = INVALID_PASTE_MESSAGE;
+		}
+	}
+
+	/** Delete one Unicode code point from the currently active field. */
+	backspace(): void {
+		if (this.#closed) return;
+		this.#message = undefined;
+		if (this.#mode === "checkpoint" && this.#activeField === "confirmation") {
+			this.#confirmation = Array.from(this.#confirmation).slice(0, -1).join("");
+			return;
+		}
+		this.#password = Array.from(this.#password).slice(0, -1).join("");
+	}
+
+	clearActive(): void {
+		if (this.#closed) return;
+		this.#message = undefined;
+		if (this.#mode === "checkpoint" && this.#activeField === "confirmation") {
+			this.#confirmation = "";
+			return;
+		}
+		this.#password = "";
+	}
+
+	/** Move between the checkpoint password and confirmation fields. */
+	switchField(): void {
+		if (this.#closed || this.#mode !== "checkpoint") return;
+		this.#activeField = this.#activeField === "password" ? "confirmation" : "password";
+		this.#message = undefined;
+	}
+
+	submit(): PasswordSubmission {
+		if (this.#closed) return { status: "closed" };
+
+		if (this.#mode === "checkpoint" && this.#activeField === "password") {
+			if (!isWellFormedUnicode(this.#password)) {
+				this.#message = INVALID_ENCODING_MESSAGE;
+				return { status: "invalid-encoding" };
+			}
+			this.#activeField = "confirmation";
+			this.#message = undefined;
+			return { status: "confirmation-required" };
+		}
+
+		if (
+			!isWellFormedUnicode(this.#password) ||
+			(this.#mode === "checkpoint" && !isWellFormedUnicode(this.#confirmation))
+		) {
+			this.#message = INVALID_ENCODING_MESSAGE;
+			return { status: "invalid-encoding" };
+		}
+
+		if (this.#mode === "checkpoint" && this.#password !== this.#confirmation) {
+			this.#password = "";
+			this.#confirmation = "";
+			this.#activeField = "password";
+			this.#message = MISMATCH_MESSAGE;
+			return { status: "mismatch" };
+		}
+
+		// TextEncoder provides the required exact UTF-8 encoding without any
+		// Unicode normalization. Clear owned string references before returning.
+		const password = new TextEncoder().encode(this.#password);
+		this.dispose();
+		return { status: "accepted", password };
+	}
+
+	/** Drop the owned secret references on cancel, completion, or unmount. */
+	dispose(): void {
+		this.#password = "";
+		this.#confirmation = "";
+		this.#message = undefined;
+		this.#closed = true;
+	}
+}
+
+export interface PasswordDialogPort<Rendered> {
+	show(render: () => Rendered, onClose?: () => void): void;
+	clear(): void;
+}
+
+/**
+ * Small dialog lifecycle seam so cancellation/cleanup can be tested without
+ * loading the OpenTUI runtime. The real UI supplies the public dialog API.
+ */
+export function showPasswordPrompt<Rendered>(
+	dialog: PasswordDialogPort<Rendered>,
+	mode: PasswordMode,
+	render: (
+		prompt: PasswordPromptState,
+		accept: (password: Uint8Array) => void,
+		cancel: () => void,
+	) => Rendered,
+	maxPasswordBytes = 4096,
+): Promise<Uint8Array | undefined> {
+	return new Promise((resolve, reject) => {
+		const prompt = new PasswordPromptState(mode, maxPasswordBytes);
+		let settled = false;
+
+		const settle = (password: Uint8Array | undefined): void => {
+			if (settled) return;
+			settled = true;
+			prompt.dispose();
+			try {
+				dialog.clear();
+			} finally {
+				resolve(password);
+			}
+		};
+
+		const onClose = (): void => {
+			if (settled) return;
+			settled = true;
+			prompt.dispose();
+			resolve(undefined);
+		};
+
+		try {
+			dialog.show(
+				() => render(prompt, (password) => settle(password), () => settle(undefined)),
+				onClose,
+			);
+		} catch (error) {
+			settled = true;
+			prompt.dispose();
+			reject(error);
+		}
+	});
+}

package/src/tui/ui/restore-project-selector.ts

@@ -0,0 +1,62 @@
+import type { Plugin } from "@opencode/plugin/tui";
+
+export interface RestoreProjectChoice {
+	readonly projectID: string;
+	/** Canonical host-project directory; this is also the explicit import target. */
+	readonly targetDirectory: string;
+	readonly label: string;
+}
+
+export type RestoreProjectDialog = Pick<Plugin.Context["ui"]["dialog"], "select">;
+
+function assertResolvedChoices(choices: readonly RestoreProjectChoice[]): void {
+	const directoryByProjectID = new Map<string, string>();
+	const projectIDByDirectory = new Map<string, string>();
+
+	for (const choice of choices) {
+		if (!choice.projectID.trim() || !choice.targetDirectory.trim()) {
+			throw new TypeError(
+				"Restore choices require both a project ID and canonical target directory.",
+			);
+		}
+
+		const knownDirectory = directoryByProjectID.get(choice.projectID);
+		if (knownDirectory !== undefined && knownDirectory !== choice.targetDirectory) {
+			throw new Error("Restore choices contain an ambiguous project ID and target directory pair.");
+		}
+
+		const knownProjectID = projectIDByDirectory.get(choice.targetDirectory);
+		if (knownProjectID !== undefined && knownProjectID !== choice.projectID) {
+			throw new Error("Restore choices contain an ambiguous project ID and target directory pair.");
+		}
+
+		directoryByProjectID.set(choice.projectID, choice.targetDirectory);
+		projectIDByDirectory.set(choice.targetDirectory, choice.projectID);
+	}
+}
+
+/**
+ * Present already-resolved host projects for selection. This helper does not
+ * enumerate projects or derive a directory; callers must provide each
+ * project's canonical target directory alongside its project ID. Empty input
+ * stays in the host selector so the user sees an actionable empty state; the
+ * host's undefined result continues to mean that selection was cancelled.
+ */
+export function selectRestoreProject(
+	dialog: RestoreProjectDialog,
+	choices: readonly RestoreProjectChoice[],
+): Promise<RestoreProjectChoice | undefined> {
+	assertResolvedChoices(choices);
+	const empty = choices.length === 0;
+	return dialog.select<RestoreProjectChoice>({
+		title: empty
+			? "No projects available to restore into"
+			: "Choose an existing project to restore into",
+		placeholder: empty ? "Open or add a project, then retry /restore" : "Select a project",
+		options: choices.map((choice) => ({
+			title: choice.label.trim() || choice.targetDirectory,
+			description: choice.targetDirectory,
+			value: choice,
+		})),
+	});
+}