atmn 1.1.25 → 2.0.0

package/src/actions/sandbox/useSandbox.ts

@@ -0,0 +1,157 @@
+import {
+	readEnvFileValue,
+	removeEnvValues,
+	writeEnvValues,
+} from "../../env/loadEnv";
+import { SANDBOX_PIN_NAME, sandboxKeyName } from "../../env/sandboxKeyName";
+import { done, type Prompter } from "../../prompt/prompt";
+import { type Choice, matchChoice, select } from "../../prompt/select";
+import { renderSandboxes, type SandboxRow } from "../../render/renderSandboxes";
+import { stripTerminalControls } from "../../render/stripTerminalControls";
+import type { OrgInfo } from "../env/types/orgInfo";
+import type { UseSandboxClient } from "./types/sandboxClient";
+
+export type SandboxUseOptions = {
+	/** Absent only for `--clear`, which touches nothing remote. */
+	client?: UseSandboxClient;
+	/** The main organization, as `/organization/me` answered for the main key. */
+	org?: Pick<OrgInfo, "id" | "name" | "slug">;
+	/** A name or an id; asked for when absent and interactive. */
+	query?: string;
+	/** Drop the pin instead of setting one. */
+	clear?: boolean;
+	json?: boolean;
+	/** Where the .env lives; the first existing file is used, else the first dir. */
+	envDirs: string[];
+	prompter: Prompter;
+};
+
+export type SandboxUseResult = {
+	organization: Pick<OrgInfo, "id" | "name" | "slug">;
+	sandbox: { id: string; name: string; slug: string };
+	keyName: string;
+	keyMinted: boolean;
+	envPath: string;
+	notes: string[];
+};
+
+const choicesOf = ({
+	sandboxes,
+	currentId,
+}: {
+	sandboxes: SandboxRow[];
+	currentId: string | undefined;
+}): Choice[] =>
+	sandboxes.map((sandbox) => ({
+		value: sandbox.id,
+		label: stripTerminalControls(sandbox.name),
+		detail: sandbox.id,
+		current: sandbox.id === currentId,
+	}));
+
+const notesFor = ({ name }: { name: string }): string[] => [
+	`Every atmn command now targets sandbox ${name}.`,
+	"Run `atmn env` to confirm; `atmn sandbox use --clear` returns to the main sandbox.",
+	"`atmn push` previews only; add --yes to apply.",
+];
+
+/**
+ * The pin is the only per-project state a sandbox needs: `--sandbox` and the
+ * key name derive from it. A key is minted when this machine has none for
+ * the sandbox, so a teammate's sandbox is one command away.
+ */
+export const runSandboxUse = async ({
+	client,
+	org,
+	query,
+	clear = false,
+	json = false,
+	envDirs,
+	prompter,
+}: SandboxUseOptions): Promise<SandboxUseResult | null> => {
+	if (clear) {
+		const changed = removeEnvValues({
+			dirs: envDirs,
+			keys: [SANDBOX_PIN_NAME],
+		});
+		if (json) {
+			prompter.write(
+				`${JSON.stringify({ cleared: true, envPaths: changed, notes: ["Commands target the main sandbox again."] }, null, 2)}\n`,
+			);
+			return null;
+		}
+		prompter.write(
+			`${done(`Cleared ${SANDBOX_PIN_NAME}; commands target the main sandbox again.`)}\n`,
+		);
+		return null;
+	}
+	if (client === undefined || org === undefined)
+		throw new Error("sandbox use needs the main key to list sandboxes.");
+
+	const { list } = await client.listSandboxes({});
+	const currentId = process.env[SANDBOX_PIN_NAME];
+	const choices = choicesOf({ sandboxes: list, currentId });
+
+	let picked: Choice | null;
+	if (query !== undefined && query !== "") {
+		picked = matchChoice({ choices, query });
+		if (picked === null)
+			throw new Error(
+				`No sandbox named or with id ${JSON.stringify(query)}. Run atmn sandbox list.`,
+			);
+	} else {
+		if (!prompter.interactive)
+			prompter.write(
+				`${renderSandboxes({ sandboxes: list, currentSandboxId: currentId })}\n`,
+			);
+		picked = await select({
+			prompter,
+			choices,
+			question: "Which sandbox?",
+			flag: "atmn sandbox use <name|id>",
+		});
+		if (picked === null) return null;
+	}
+
+	const sandbox = list.find((row) => row.id === picked.value);
+	if (sandbox === undefined) throw new Error("Sandbox vanished from the list.");
+	const keyName = sandboxKeyName({ sandboxId: sandbox.id });
+	const name = stripTerminalControls(sandbox.name);
+
+	const onDisk =
+		process.env[keyName] ||
+		readEnvFileValue({ dirs: envDirs, key: keyName }) ||
+		undefined;
+	let keyMinted = false;
+	const values: Record<string, string> = { [SANDBOX_PIN_NAME]: sandbox.id };
+	if (onDisk === undefined) {
+		const minted = await client.createSandboxKey({ id: sandbox.id });
+		values[keyName] = minted.secretKey;
+		keyMinted = true;
+	}
+	const envPath = writeEnvValues({ dirs: envDirs, values });
+
+	const result: SandboxUseResult = {
+		organization: { id: org.id, name: org.name, slug: org.slug },
+		sandbox: { id: sandbox.id, name: sandbox.name, slug: sandbox.slug },
+		keyName,
+		keyMinted,
+		envPath,
+		notes: notesFor({ name }),
+	};
+
+	if (json) {
+		prompter.write(`${JSON.stringify(result, null, 2)}\n`);
+		return result;
+	}
+
+	if (keyMinted)
+		prompter.write(`${done(`Minted a key for ${name} (${sandbox.id})`)}\n`);
+	prompter.write(
+		`${done(`Pinned ${SANDBOX_PIN_NAME}=${sandbox.id} in ${envPath}`)}\n`,
+	);
+	prompter.write(
+		`  Every command now targets ${name}. atmn sandbox use --clear returns to the main sandbox.\n`,
+	);
+	return result;
+};

package/src/actions/sandbox/withSandboxScopeHint.ts

@@ -0,0 +1,27 @@
+import { AutumnApiError } from "../../generated/client";
+
+const SCOPE_REFUSAL = "Insufficient scopes";
+
+export const SANDBOX_LOGIN_HINT =
+	"Your key can't manage sandboxes: it was minted before atmn asked for platform:write. Run atmn login again to mint one that can.";
+
+export const SETTINGS_LOGIN_HINT =
+	"Your key can't write settings: it was minted before atmn asked for organisation:write. Run atmn login again to mint one that can, or drop the settings block.";
+
+/** A key minted by an older login fails here first; say what to do, not just which scope is missing. */
+export const withSandboxScopeHint = ({ error }: { error: unknown }): unknown =>
+	withScopeHint({ error, hint: SANDBOX_LOGIN_HINT });
+
+export const withSettingsScopeHint = ({ error }: { error: unknown }): unknown =>
+	withScopeHint({ error, hint: SETTINGS_LOGIN_HINT });
+
+const withScopeHint = ({
+	error,
+	hint,
+}: {
+	error: unknown;
+	hint: string;
+}): unknown =>
+	error instanceof AutumnApiError && error.message.includes(SCOPE_REFUSAL)
+		? new Error(hint, { cause: error })
+		: error;

package/src/actions/skills/skills.ts

@@ -0,0 +1,246 @@
+import { spawnSync } from "node:child_process";
+import {
+	existsSync,
+	lstatSync,
+	mkdirSync,
+	readFileSync,
+	realpathSync,
+	writeFileSync,
+} from "node:fs";
+import { dirname, join } from "node:path";
+import chalk from "chalk";
+import {
+	type BundledSkill,
+	SKILLS,
+	SKILLS_VERSION,
+} from "../../generated/skills";
+import { done, hint, same, type WriteLine } from "../../prompt/prompt";
+
+/** The folder under the config where the canonical copies live. */
+export const SKILLS_DIR_NAME = "skills";
+
+const FRONTMATTER_VERSION = /^version:\s*(.+)$/m;
+
+const findSkill = ({ name }: { name: string }): BundledSkill => {
+	const skill = SKILLS.find((candidate) => candidate.name === name);
+	if (skill === undefined)
+		throw new Error(
+			`No skill named ${JSON.stringify(name)}. Bundled: ${SKILLS.map((candidate) => candidate.name).join(", ")}.`,
+		);
+	return skill;
+};
+
+export const renderSkillsList = (): string => {
+	const width = Math.max(...SKILLS.map((skill) => skill.name.length));
+	const rows = SKILLS.map(
+		(skill) =>
+			`${skill.name.padEnd(width)}  ${skill.description}  ${chalk.dim(`(${skill.references.length} refs)`)}`,
+	);
+	return [
+		...rows,
+		"",
+		`${chalk.dim("atmn skills <name>")}                print a skill`,
+		`${chalk.dim("atmn skills <name> --ref <path>")}   print one of its references`,
+		`${chalk.dim("atmn skills install [--dir d]")}     write them next to your config`,
+		`${chalk.dim("atmn skills update [--dir d]")}      bring an older install up to v${SKILLS_VERSION}`,
+	].join("\n");
+};
+
+/** Raw to stdout, so `atmn skills catalog | …` is the whole integration. */
+export const printSkill = ({
+	name,
+	ref,
+	json = false,
+	write,
+}: {
+	name: string;
+	ref?: string;
+	json?: boolean;
+	write: WriteLine;
+}): void => {
+	const skill = findSkill({ name });
+	if (json) {
+		write(`${JSON.stringify(skill, null, 2)}\n`);
+		return;
+	}
+	if (ref !== undefined) {
+		const reference = skill.references.find((entry) => entry.path === ref);
+		if (reference === undefined)
+			throw new Error(
+				`${skill.name} has no reference ${JSON.stringify(ref)}. Available: ${skill.references.map((entry) => entry.path).join(", ")}.`,
+			);
+		write(`${reference.contents}\n`);
+		return;
+	}
+	write(`${skill.markdown}\n`);
+};
+
+const writeSkill = ({ dir, skill }: { dir: string; skill: BundledSkill }) => {
+	const skillDir = join(dir, skill.name);
+	mkdirSync(skillDir, { recursive: true });
+	writeFileSync(join(skillDir, "SKILL.md"), skill.markdown, "utf8");
+	for (const reference of skill.references) {
+		const path = join(skillDir, reference.path);
+		mkdirSync(dirname(path), { recursive: true });
+		writeFileSync(path, reference.contents, "utf8");
+	}
+};
+
+export const installSkills = ({
+	dir,
+	write,
+}: {
+	dir: string;
+	write: WriteLine;
+}): { written: string[] } => {
+	for (const skill of SKILLS) writeSkill({ dir, skill });
+	write(
+		`${done(`Wrote ${SKILLS.length} skills to ${dir} (v${SKILLS_VERSION})`)}\n`,
+	);
+	write(`${hint(`npx skills add ${dir} -y`)}      link them into your agent\n`);
+	return { written: SKILLS.map((skill) => skill.name) };
+};
+
+/** The fan-out to agent folders is `npx skills`' job: it knows the agents, we don't. */
+export const linkSkills = async ({
+	dir,
+	write,
+	spawn = (args) =>
+		spawnSync(args[0] ?? "npx", args.slice(1), { stdio: "inherit" }).status ??
+		1,
+}: {
+	dir: string;
+	write: WriteLine;
+	spawn?: (args: string[]) => number;
+}): Promise<boolean> => {
+	const exitCode = spawn(["npx", "skills", "add", dir, "--all"]);
+	if (exitCode === 0) return true;
+	write(
+		`${hint(`npx skills add ${dir} --all`)} did not complete; run it yourself when you are ready.\n`,
+	);
+	return false;
+};
+
+export type SkillStatus = {
+	name: string;
+	/** The version the installed SKILL.md states; null when not installed. */
+	installed: string | null;
+	bundled: string;
+};
+
+/** A skill folder may be a symlink into the canonical copy: follow it, so
+ * rewriting it updates every agent dir that links there at once. */
+const realSkillDir = ({
+	dir,
+	name,
+}: {
+	dir: string;
+	name: string;
+}): string | null => {
+	const path = join(dir, name);
+	if (!existsSync(path)) return null;
+	return lstatSync(path).isSymbolicLink() ? realpathSync(path) : path;
+};
+
+const installedVersion = ({
+	skillDir,
+}: {
+	skillDir: string;
+}): string | null => {
+	const markdownPath = join(skillDir, "SKILL.md");
+	if (!existsSync(markdownPath)) return null;
+	const match = FRONTMATTER_VERSION.exec(readFileSync(markdownPath, "utf8"));
+	return match?.[1]?.trim() ?? "unknown";
+};
+
+/** SemVer ordering: numeric core, then prerelease identifiers (a release beats any prerelease). */
+const compareVersions = (a: string, b: string): number => {
+	const parse = (v: string) => {
+		const version = v.split("+", 1)[0] ?? "";
+		const dash = version.indexOf("-");
+		const core = dash === -1 ? version : version.slice(0, dash);
+		const pre = dash === -1 ? null : version.slice(dash + 1).split(".");
+		return {
+			nums: core.split(".").map((n) => Number.parseInt(n, 10) || 0),
+			pre,
+		};
+	};
+	const x = parse(a);
+	const y = parse(b);
+	for (let i = 0; i < Math.max(x.nums.length, y.nums.length); i++) {
+		const d = (x.nums[i] ?? 0) - (y.nums[i] ?? 0);
+		if (d !== 0) return d;
+	}
+	if (x.pre === null && y.pre === null) return 0;
+	if (x.pre === null) return 1;
+	if (y.pre === null) return -1;
+	for (let i = 0; i < Math.max(x.pre.length, y.pre.length); i++) {
+		const p = x.pre[i];
+		const q = y.pre[i];
+		if (p === undefined) return -1;
+		if (q === undefined) return 1;
+		const pn = /^\d+$/.test(p) ? Number(p) : null;
+		const qn = /^\d+$/.test(q) ? Number(q) : null;
+		if (pn !== null && qn !== null) {
+			if (pn !== qn) return pn - qn;
+		} else if (pn !== null) return -1;
+		else if (qn !== null) return 1;
+		else if (p !== q) return p < q ? -1 : 1;
+	}
+	return 0;
+};
+
+/** Older than the bundle: the only case update touches. Unknown reads as older. */
+const isStale = (installed: string | null): boolean =>
+	installed !== null &&
+	(installed === "unknown" || compareVersions(installed, SKILLS_VERSION) < 0);
+
+export const skillsStatus = ({ dir }: { dir: string }): SkillStatus[] =>
+	SKILLS.map((skill) => {
+		const skillDir = realSkillDir({ dir, name: skill.name });
+		return {
+			name: skill.name,
+			installed: skillDir === null ? null : installedVersion({ skillDir }),
+			bundled: SKILLS_VERSION,
+		};
+	});
+
+/** One dim line for push/pull when an installed skill is older than the CLI; null when nothing is. */
+export const staleSkillsHint = ({ dir }: { dir: string }): string | null => {
+	const stale = skillsStatus({ dir }).filter((entry) =>
+		isStale(entry.installed),
+	);
+	if (stale.length === 0) return null;
+	const versions = [...new Set(stale.map((entry) => entry.installed))].join(
+		", ",
+	);
+	return chalk.dim(
+		`skills are at v${versions}, the CLI is v${SKILLS_VERSION}: atmn skills update`,
+	);
+};
+
+export const updateSkills = ({
+	dir,
+	write,
+}: {
+	dir: string;
+	write: WriteLine;
+}): { updated: string[] } => {
+	const updated: string[] = [];
+	for (const skill of SKILLS) {
+		const skillDir = realSkillDir({ dir, name: skill.name });
+		const installed = skillDir === null ? null : installedVersion({ skillDir });
+		if (installed !== null && !isStale(installed)) {
+			write(
+				`${same(`${skill.name}  ${installed === SKILLS_VERSION ? "up to date" : `${installed} is newer than this CLI, kept`}`)}\n`,
+			);
+			continue;
+		}
+		writeSkill({ dir: skillDir === null ? dir : dirname(skillDir), skill });
+		updated.push(skill.name);
+		write(
+			`${done(`${skill.name}  ${installed === null ? "installed" : `${installed} → ${SKILLS_VERSION}`}`)}\n`,
+		);
+	}
+	return { updated };
+};

package/src/auth/announceAuthorizationUrl.ts

@@ -0,0 +1,26 @@
+import { tryOpenBrowser } from "./browser/tryOpenBrowser";
+import type { BrowserOpener } from "./types/browserOpener";
+
+/**
+ * The URL is printed whether or not a browser opened, so it can be finished on
+ * a phone or a laptop when the CLI is running over SSH or in a container.
+ */
+export const announceAuthorizationUrl = async ({
+	url,
+	write,
+	openBrowser,
+}: {
+	url: string;
+	write: (text: string) => void;
+	openBrowser: BrowserOpener;
+}): Promise<void> => {
+	write(`\nVisit this URL to authenticate:\n\n  ${url}\n\n`);
+
+	const opened = await tryOpenBrowser({ url, openBrowser });
+
+	write(
+		opened
+			? "Opened your browser. Waiting for authorization...\n"
+			: "No browser could be opened here — open the URL above on any machine.\nWaiting for authorization...\n",
+	);
+};

package/src/auth/browser/openSystemBrowser.ts

@@ -0,0 +1,7 @@
+import open from "open";
+import type { BrowserOpener } from "../types/browserOpener";
+import { watchLauncher } from "./watchLauncher";
+
+export const openSystemBrowser: BrowserOpener = async ({ url }) => {
+	await watchLauncher({ launcher: await open(url) });
+};

package/src/auth/browser/tryOpenBrowser.ts

@@ -0,0 +1,17 @@
+import type { BrowserOpener } from "../types/browserOpener";
+
+/** Never throws: a machine with no browser is a supported way to log in. */
+export const tryOpenBrowser = async ({
+	url,
+	openBrowser,
+}: {
+	url: string;
+	openBrowser: BrowserOpener;
+}): Promise<boolean> => {
+	try {
+		await openBrowser({ url });
+		return true;
+	} catch {
+		return false;
+	}
+};

package/src/auth/browser/watchLauncher.ts

@@ -0,0 +1,46 @@
+/** Anything with node's `once`; a spawned `ChildProcess` satisfies it. */
+export type Launcher = {
+	once(event: string, listener: (...args: unknown[]) => void): unknown;
+};
+
+/**
+ * How long to keep watching before treating a still-running launcher as a
+ * success — some openers stay resident for the life of the browser.
+ */
+export const LAUNCHER_SETTLE_MS = 1500;
+
+/**
+ * A launcher that never spawned (no xdg-open) or exited non-zero (no display,
+ * no default browser) opened nothing. This, not a TTY check, is what tells us
+ * the environment is headless.
+ */
+export const watchLauncher = ({
+	launcher,
+	settleMs = LAUNCHER_SETTLE_MS,
+}: {
+	launcher: Launcher;
+	settleMs?: number;
+}): Promise<void> =>
+	new Promise((resolve, reject) => {
+		const settled = setTimeout(resolve, settleMs);
+
+		launcher.once("error", (...args: unknown[]) => {
+			clearTimeout(settled);
+			const [cause] = args;
+			reject(
+				cause instanceof Error
+					? cause
+					: new Error("Browser launcher failed to start"),
+			);
+		});
+
+		launcher.once("close", (...args: unknown[]) => {
+			clearTimeout(settled);
+			const [code] = args;
+			if (typeof code === "number" && code !== 0) {
+				reject(new Error(`Browser launcher exited with code ${code}`));
+				return;
+			}
+			resolve();
+		});
+	});

package/src/auth/buildAuthorizationUrl.ts

@@ -0,0 +1,36 @@
+import { CodeChallengeMethod, OAuth2Client } from "arctic";
+import { getAuthorizationEndpoint, getOAuthRedirectUri } from "./oauthConfig";
+
+export const createOAuthClient = ({
+	clientId,
+	port,
+}: {
+	clientId: string;
+	port: number;
+}): OAuth2Client =>
+	new OAuth2Client(clientId, null, getOAuthRedirectUri({ port }));
+
+export const buildAuthorizationUrl = ({
+	client,
+	backendUrl,
+	scopes,
+	state,
+	codeVerifier,
+}: {
+	client: OAuth2Client;
+	backendUrl: string;
+	scopes: readonly string[];
+	state: string;
+	codeVerifier: string;
+}): URL => {
+	const url = client.createAuthorizationURLWithPKCE(
+		getAuthorizationEndpoint({ backendUrl }),
+		state,
+		CodeChallengeMethod.S256,
+		codeVerifier,
+		[...scopes],
+	);
+	// Always show the org picker; a silent grant would pin the wrong org.
+	url.searchParams.set("prompt", "consent");
+	return url;
+};

package/src/auth/callbackPages.ts

@@ -0,0 +1,126 @@
+/** Ported from v2 so the browser half of login looks unchanged. */
+const BASE_STYLES = `
+	@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');
+
+	* { box-sizing: border-box; margin: 0; padding: 0; }
+
+	body {
+		font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+		min-height: 100vh;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		background: #fafaf9;
+		color: #121212;
+		-webkit-font-smoothing: antialiased;
+		-moz-osx-font-smoothing: grayscale;
+	}
+
+	.container { text-align: center; padding: 3rem 2rem; max-width: 400px; }
+
+	.icon {
+		width: 64px;
+		height: 64px;
+		border-radius: 16px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		margin: 0 auto 1.5rem;
+	}
+
+	.icon-success {
+		background: linear-gradient(135deg, #f3e8ff 0%, #ede1ff 100%);
+		border: 2px solid #c4b5fd;
+		color: #8838ff;
+	}
+
+	.icon-error {
+		background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
+		border: 2px solid #fca5a5;
+		color: #dc2626;
+	}
+
+	h1 { font-size: 20px; font-weight: 600; margin-bottom: 0.5rem; letter-spacing: -0.02em; }
+	.error h1 { color: #dc2626; }
+
+	.description { font-size: 14px; color: #666; line-height: 1.5; margin-bottom: 1.5rem; }
+
+	.hint {
+		font-size: 13px;
+		color: #888;
+		padding: 0.75rem 1rem;
+		background: #f5f5f4;
+		border-radius: 8px;
+		border: 1px solid #e5e5e5;
+	}
+
+	@media (prefers-color-scheme: dark) {
+		body { background: #161616; color: #ddd; }
+		.icon-success { background: linear-gradient(135deg, #2d1f4e 0%, #3d2a5e 100%); border-color: #6b46c1; color: #a855f7; }
+		.icon-error { background: linear-gradient(135deg, #4a1a1a 0%, #5c2020 100%); border-color: #dc2626; color: #f87171; }
+		.error h1 { color: #f87171; }
+		.description { color: #999; }
+		.hint { background: #1d1d1d; border-color: #2c2c2c; }
+	}
+`;
+
+const SUCCESS_ICON = `<svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"></polyline></svg>`;
+
+const ERROR_ICON = `<svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>`;
+
+const renderPage = ({
+	variant,
+	icon,
+	title,
+	description,
+	hint,
+}: {
+	variant: "success" | "error";
+	icon: string;
+	title: string;
+	description: string;
+	hint: string;
+}): string => `<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>${title} - Autumn</title>
+	<style>${BASE_STYLES}</style>
+</head>
+<body>
+	<div class="container ${variant}">
+		<div class="icon icon-${variant}">${icon}</div>
+		<h1>${title}</h1>
+		<p class="description">${description}</p>
+		<p class="hint">${hint}</p>
+	</div>
+</body>
+</html>`;
+
+/** The error text comes from the authorization server, so it must be escaped. */
+const escapeHtml = ({ text }: { text: string }): string =>
+	text
+		.replaceAll("&", "&amp;")
+		.replaceAll("<", "&lt;")
+		.replaceAll(">", "&gt;")
+		.replaceAll('"', "&quot;")
+		.replaceAll("'", "&#039;");
+
+export const renderSuccessPage = (): string =>
+	renderPage({
+		variant: "success",
+		icon: SUCCESS_ICON,
+		title: "Authorization Successful",
+		description: "Your CLI has been authenticated successfully.",
+		hint: "You can close this window and return to your terminal.",
+	});
+
+export const renderErrorPage = ({ message }: { message: string }): string =>
+	renderPage({
+		variant: "error",
+		icon: ERROR_ICON,
+		title: "Authorization Failed",
+		description: escapeHtml({ text: message }),
+		hint: "Please close this window and try again in your terminal.",
+	});