codebay 0.9.1 → 0.10.1

package/src/components/TopBar.svelte

@@ -1,8 +1,10 @@
 <script lang="ts">
 	import Plus from '@lucide/svelte/icons/plus';
 	import Component from '@lucide/svelte/icons/component';
+	import Terminal from '@lucide/svelte/icons/terminal';
+	import LayoutTemplate from '@lucide/svelte/icons/layout-template';
 	import { isDev } from 'mochi-framework';
-	import type { AuthProvider, InstanceFilter } from '../types.ts';
+	import type { AuthProvider, InstanceFilter, InstanceMode } from '../types.ts';
 	import type { AvatarArt } from '../avatars/index.ts';
 	import Brand from './Brand.svelte';
 	import InstanceFilterControl from './InstanceFilter.svelte';
@@ -18,6 +20,7 @@
 		ready = true,
 		creating = false,
 		filter,
+		defaultMode = 'ide',
 		onFilter,
 		onNew,
 		onDeleteAll
@@ -28,10 +31,14 @@
 		ready?: boolean;
 		creating?: boolean;
 		filter?: InstanceFilter;
+		/** Drives the shortcut button, which always offers the mode the main button won't create. */
+		defaultMode?: InstanceMode;
 		onFilter?: (v: InstanceFilter) => void;
-		onNew?: () => void;
+		onNew?: (mode?: InstanceMode) => void;
 		onDeleteAll?: () => void;
 	} = $props();
+
+	const altMode = $derived<InstanceMode>(defaultMode === 'terminal' ? 'ide' : 'terminal');
 </script>
 
 <header class="topbar">
@@ -48,14 +55,28 @@
 		<Button variant="danger" size="sm" onclick={onDeleteAll} disabled={!canDelete}>
 			Delete all
 		</Button>
-		<Button
-			variant="primary"
-			icon={creating ? undefined : Plus}
-			onclick={onNew}
-			disabled={!ready || creating}
-		>
-			{creating ? 'Creating…' : 'New instance'}
-		</Button>
+		<div class="new-group">
+			<Button
+				variant="primary"
+				size="sm"
+				icon={creating ? undefined : Plus}
+				onclick={() => onNew?.()}
+				disabled={!ready || creating}
+			>
+				{creating ? 'Creating…' : 'New instance'}
+			</Button>
+			<Button
+				variant="primary"
+				size="sm"
+				square
+				icon={altMode === 'terminal' ? Terminal : LayoutTemplate}
+				iconSize={15}
+				onclick={() => onNew?.(altMode)}
+				disabled={!ready || creating}
+				title={altMode === 'terminal' ? 'New terminal instance' : 'New full IDE instance'}
+				aria-label={altMode === 'terminal' ? 'New terminal instance' : 'New full IDE instance'}
+			/>
+		</div>
 	</div>
 </header>
 
@@ -72,4 +93,10 @@
 		align-items: center;
 		gap: 14px;
 	}
+	/* The mode shortcut reads as part of the New instance control, not a separate action. */
+	.new-group {
+		display: inline-flex;
+		align-items: center;
+		gap: 6px;
+	}
 </style>

package/src/components/UiShowcase.svelte

@@ -71,9 +71,8 @@
 
 	let avatarScale = $state(8);
 	let avatarName = $state('demo-instance');
-	let avatarId = $state('alpha');
-	// '' means "pick by id"; otherwise the value is an avatar name from the catalog.
-	let avatarArtName = $state('');
+	// '' renders an empty panel; otherwise the value is an avatar name from the catalog.
+	let avatarArtName = $state(avatars[0]!.name);
 	const avatarArt = $derived(avatars.find((a) => a.name === avatarArtName));
 
 	let btnVariant = $state<'default' | 'primary' | 'danger'>('primary');
@@ -149,7 +148,7 @@
 	canDelete={true}
 	ready={true}
 	creating={false}
-	onNew={() => toast('New instance (demo)')}
+	onNew={(mode) => toast(`New ${mode ?? 'default'} instance (demo)`)}
 	onDeleteAll={() => toast('Delete all (demo)')}
 />
 
@@ -187,7 +186,7 @@
 		</details>
 
 		<ComponentDemo title="Avatar">
-			<Avatar id={avatarId} name={avatarName} scale={avatarScale} art={avatarArt} />
+			<Avatar name={avatarName} scale={avatarScale} art={avatarArt} />
 			{#snippet controls()}
 				<label>
 					<span>scale ({avatarScale})</span>
@@ -197,14 +196,10 @@
 					<span>name</span>
 					<input type="text" bind:value={avatarName} />
 				</label>
-				<label>
-					<span>id</span>
-					<input type="text" bind:value={avatarId} />
-				</label>
 				<label>
 					<span>art</span>
 					<select bind:value={avatarArtName}>
-						<option value="">(pick by id)</option>
+						<option value="">(none)</option>
 						{#each avatars as art (art.name)}
 							<option value={art.name}>{art.name}</option>
 						{/each}

package/src/container-injections/claude-aliases.ts

@@ -5,7 +5,7 @@ import {
 } from '../lib/container-files.server.ts';
 import type { Injection } from '../lib/injections.server.ts';
 
-/** Both resolve `claude`, which `claude-skip-permissions` also aliases, so the two compose. */
+/** Both resolve `claude`, which `claude-permission-mode` also aliases, so the two compose. */
 const ALIAS_LINES = [
 	"alias c200='CLAUDE_CODE_DISABLE_1M_CONTEXT=1 claude'",
 	"alias cs='claude --model sonnet'"

package/src/container-injections/claude-code-custom.ts

@@ -43,7 +43,8 @@ export function customEndpointConfig(): {
 	};
 }
 
-const ENV_FILE_NAME = '.codebay-claude-env';
+/** Exported so the terminal/IDE launchers can source it explicitly — see `SOURCE_INJECTED_ENV`. */
+export const ENV_FILE_NAME = '.codebay-claude-env';
 
 /** The whole file (token included) rides `stdin` inside `installShellEnvFile`, so nothing hits argv. */
 function envFileContent(config: NonNullable<ReturnType<typeof customEndpointConfig>>): string {

package/src/container-injections/claude-code-ide-extension.ts

@@ -7,9 +7,14 @@ export const EXTENSION_ID = 'anthropic.claude-code';
 const EXT_GLOB = '~/.local/share/code-server/extensions/anthropic.claude-code-*';
 
 /** Idempotent (skips if already present); best-effort — needs Open VSX egress. */
+// The bracketed `install-extensio[n]` keeps pgrep from matching this script's own `bash -lc` argv,
+// so it only sees the launch line's real background install (which it waits out before falling back).
 export const INSTALL_SCRIPT =
 	`if ls -d ${EXT_GLOB} >/dev/null 2>&1; then exit 0; fi; ` +
 	`command -v code-server >/dev/null 2>&1 || { echo "code-server not found" >&2; exit 1; }; ` +
+	`for _ in {1..90}; do ` +
+	`pgrep -f 'install-extensio[n] ${EXTENSION_ID}' >/dev/null 2>&1 || break; sleep 1; done; ` +
+	`if ls -d ${EXT_GLOB} >/dev/null 2>&1; then exit 0; fi; ` +
 	`code-server --install-extension ${EXTENSION_ID}`;
 
 export const CHECK_SCRIPT = `ls -d ${EXT_GLOB} >/dev/null 2>&1 && echo 1 || echo 0`;

package/src/container-injections/claude-code-models.ts

@@ -26,7 +26,8 @@ export function manualModelConfig(): Record<string, string> | null {
 	return Object.keys(filled).length ? filled : null;
 }
 
-const ENV_FILE_NAME = '.codebay-claude-models-env';
+/** Exported so the terminal/IDE launchers can source it explicitly — see `SOURCE_INJECTED_ENV`. */
+export const ENV_FILE_NAME = '.codebay-claude-models-env';
 
 function injectModels(
 	target: ContainerTarget,

package/src/container-injections/claude-code-update.ts

@@ -1,4 +1,5 @@
 import { execInContainer } from '../lib/exec.server.ts';
+import { getOption, setOption } from '../lib/db.server.ts';
 import type { Injection } from '../lib/injections.server.ts';
 
 /**
@@ -18,6 +19,63 @@ export const UPDATE_SCRIPT =
 	'npm install -g @anthropic-ai/claude-code@latest >/dev/null 2>&1 || exit 1; ' +
 	'echo "updated $installed -> $latest"';
 
+/**
+ * Same check with the latest version supplied by the host as `$0` (exec args, never interpolated
+ * into the script), skipping the in-container `npm view` registry round-trip.
+ */
+export const PINNED_UPDATE_SCRIPT =
+	'latest="$0"; ' +
+	'command -v claude >/dev/null 2>&1 || exit 0; ' +
+	'command -v npm >/dev/null 2>&1 || exit 0; ' +
+	"installed=$(claude --version 2>/dev/null | grep -oE '[0-9]+\\.[0-9]+\\.[0-9]+' | head -n1); " +
+	'if [ "$installed" = "$latest" ]; then echo "current $latest"; exit 0; fi; ' +
+	'npm install -g @anthropic-ai/claude-code@latest >/dev/null 2>&1 || exit 1; ' +
+	'echo "updated $installed -> $latest"';
+
+/** Anything looser could smuggle shell metacharacters out of a corrupted DB row into a container. */
+export const VERSION_RE = /^\d+\.\d+\.\d+$/;
+
+export const CACHE_TTL_MS = 60 * 60 * 1000;
+
+export const LATEST_VERSION_KEY = 'claude_code_latest_version';
+export const LATEST_CHECKED_AT_KEY = 'claude_code_latest_checked_at';
+
+export function cacheIsFresh(checkedAt: string | null, now: number, ttlMs = CACHE_TTL_MS): boolean {
+	const t = Number(checkedAt);
+	return Number.isFinite(t) && t > 0 && now - t < ttlMs;
+}
+
+/** Best-effort: any failure (offline, timeout, odd payload) returns null and the caller falls back. */
+export async function fetchLatestVersion(): Promise<string | null> {
+	try {
+		const res = await fetch('https://registry.npmjs.org/@anthropic-ai/claude-code/latest', {
+			signal: AbortSignal.timeout(3000)
+		});
+		if (!res.ok) return null;
+		const version = ((await res.json()) as { version?: unknown }).version;
+		return typeof version === 'string' && VERSION_RE.test(version) ? version : null;
+	} catch {
+		return null;
+	}
+}
+
+/** Fresh cached version, a newly fetched one (cached for next time), or null → use UPDATE_SCRIPT. */
+async function resolveLatestVersion(): Promise<string | null> {
+	const cached = getOption(LATEST_VERSION_KEY);
+	if (
+		cached &&
+		VERSION_RE.test(cached) &&
+		cacheIsFresh(getOption(LATEST_CHECKED_AT_KEY), Date.now())
+	) {
+		return cached;
+	}
+	const version = await fetchLatestVersion();
+	if (!version) return null;
+	setOption(LATEST_VERSION_KEY, version);
+	setOption(LATEST_CHECKED_AT_KEY, String(Date.now()));
+	return version;
+}
+
 /** Best-effort, non-fatal — a failed update leaves the cached version in place. */
 export const claudeCodeUpdate: Injection = {
 	id: 'claude-code-update',
@@ -25,10 +83,13 @@ export const claudeCodeUpdate: Injection = {
 
 	async apply(target, log) {
 		log('Checking Claude Code is up to date…\n');
+		const latest = await resolveLatestVersion();
 		// Omitting remoteUser runs as root, which the global npm reinstall needs.
 		const res = await execInContainer(
 			{ containerId: target.containerId },
-			{ script: UPDATE_SCRIPT, capture: true }
+			latest
+				? { script: PINNED_UPDATE_SCRIPT, args: [latest], capture: true }
+				: { script: UPDATE_SCRIPT, capture: true }
 		);
 		if (!res.ok) {
 			log(`⚠ Claude Code update check failed: ${res.error} — keeping the installed version\n`);

package/src/container-injections/claude-effort-level.ts

@@ -0,0 +1,32 @@
+import { getOption } from '../lib/db.server.ts';
+import { mergeClaudeSettings, readClaudeSettings } from '../lib/claude-settings.server.ts';
+import { normalizeEffortLevel } from '../types.ts';
+import type { ClaudeEffortLevel } from '../types.ts';
+import type { Injection } from '../lib/injections.server.ts';
+
+/** Also read by the settings-page `serverProps` to seed the UI. */
+export function getClaudeEffortLevel(): ClaudeEffortLevel {
+	return normalizeEffortLevel(getOption('claude_effort_level'));
+}
+
+/** Writes Claude Code's `effortLevel` default into the container so new sessions start at the chosen effort. */
+export const claudeEffortLevel: Injection = {
+	id: 'claude-effort-level',
+	label: 'effort level',
+
+	async apply(target, log) {
+		const level = getClaudeEffortLevel();
+		log(`Setting Claude effort level (${level})…\n`);
+		const result = await mergeClaudeSettings(target, { effortLevel: level });
+		log(
+			result.ok
+				? '✓ Claude effort level configured in container\n'
+				: `⚠ Claude effort level injection failed: ${result.error}\n`
+		);
+	},
+
+	async check(target) {
+		const settings = await readClaudeSettings(target);
+		return settings?.effortLevel === getClaudeEffortLevel();
+	}
+};

package/src/container-injections/claude-permission-mode.ts

@@ -0,0 +1,40 @@
+import {
+	appendLinesIfAbsent,
+	linesPresent,
+	SHELL_RC_FILES
+} from '../lib/container-files.server.ts';
+import { getOption } from '../lib/db.server.ts';
+import { claudePermissionFlags, normalizePermissionMode } from '../types.ts';
+import type { ClaudePermissionMode } from '../types.ts';
+import type { Injection } from '../lib/injections.server.ts';
+
+/** Also read by `provision()`, which bakes the same flags into the container's launcher. */
+export function getClaudePermissionMode(): ClaudePermissionMode {
+	return normalizePermissionMode(getOption('claude_permission_mode'));
+}
+
+const aliasLine = () => `alias claude='claude ${claudePermissionFlags(getClaudePermissionMode())}'`;
+
+/**
+ * Keeps a hand-typed `claude` on the same permission mode the auto-launched session gets.
+ * The `default` mode's bypass is safe here only because instances are throwaway sandboxes.
+ */
+export const claudePermissionMode: Injection = {
+	id: 'claude-permission-mode',
+	label: 'claude permission mode',
+
+	async apply(target, log) {
+		const line = aliasLine();
+		log(`Installing ${line}…\n`);
+		const res = await appendLinesIfAbsent(target, SHELL_RC_FILES, [line]);
+		log(
+			res.ok
+				? '✓ claude permission-mode alias installed\n'
+				: `⚠ claude alias setup failed: ${res.error}\n`
+		);
+	},
+
+	async check(target) {
+		return linesPresent(target, SHELL_RC_FILES, [aliasLine()]);
+	}
+};

package/src/container-injections/custom-env-vars.ts

@@ -0,0 +1,82 @@
+import { getOption } from '../lib/db.server.ts';
+import { checkPresence } from '../lib/exec.server.ts';
+import type { Injection } from '../lib/injections.server.ts';
+
+export interface CustomEnvVar {
+	name: string;
+	value: string;
+}
+
+/** Same rule the host-env-vars name list and the settings action validate against. */
+const NAME_RE = /^[A-Za-z_][A-Za-z0-9_]*$/;
+
+/** Exported so `/settings` and the log-redaction step parse the stored list the same way. */
+export function parseCustomEnvVars(raw: string | null): CustomEnvVar[] {
+	let parsed: unknown;
+	try {
+		parsed = JSON.parse(raw ?? '[]');
+	} catch {
+		return [];
+	}
+	if (!Array.isArray(parsed)) return [];
+	const out: CustomEnvVar[] = [];
+	for (const entry of parsed) {
+		const name = (entry as CustomEnvVar)?.name;
+		const value = (entry as CustomEnvVar)?.value;
+		if (typeof name === 'string' && typeof value === 'string' && NAME_RE.test(name)) {
+			out.push({ name, value });
+		}
+	}
+	return out;
+}
+
+/** Null means "skip" — neither `containerEnv` nor the injection render anything. */
+export function customEnvVarsConfig(): { vars: CustomEnvVar[] } | null {
+	if (getOption('custom_env_vars_enabled') !== '1') return null;
+	const vars = parseCustomEnvVars(getOption('custom_env_vars')).filter((v) => v.value !== '');
+	return vars.length ? { vars } : null;
+}
+
+/** The secret values eligible for log redaction — only while the feature is enabled. */
+export function customEnvVarValues(): string[] {
+	return customEnvVarsConfig()?.vars.map((v) => v.value) ?? [];
+}
+
+/** Names ride argv (never a value), and `printenv` output is discarded so no value is ever echoed. */
+const PRESENCE_SCRIPT =
+	'for n in "$@"; do printenv "$n" >/dev/null 2>&1 || { echo 0; exit 0; }; done; echo 1';
+
+/**
+ * The values themselves are injected via devcontainer.json `containerEnv` at container-create time
+ * (a post-up injection can't set container-wide env); this module verifies they landed and draws
+ * the health row. No `auth` block: values come from Settings, not a discovered host dependency.
+ */
+export const customEnvVars: Injection = {
+	id: 'custom-env-vars',
+	label: 'custom env vars',
+
+	async apply(target, log) {
+		const config = customEnvVarsConfig();
+		if (!config) {
+			log('⚠ Custom env vars not configured (disabled or none set); skipped\n');
+			return;
+		}
+		const names = config.vars.map((v) => v.name);
+		log(`Verifying ${names.length} custom env var(s) via containerEnv: ${names.join(', ')}…\n`);
+		const present = await checkPresence(target, PRESENCE_SCRIPT, ['custom-env-vars', ...names]);
+		log(
+			present
+				? '✓ custom env vars present in the container\n'
+				: '⚠ custom env vars not visible (containerEnv may not apply to this base image)\n'
+		);
+	},
+
+	async check(target) {
+		const config = customEnvVarsConfig();
+		if (!config) return false;
+		return checkPresence(target, PRESENCE_SCRIPT, [
+			'custom-env-vars',
+			...config.vars.map((v) => v.name)
+		]);
+	}
+};

package/src/container-injections/host-env-vars.ts

@@ -7,7 +7,8 @@ import {
 } from '../lib/container-files.server.ts';
 import type { ContainerTarget, Injection } from '../lib/injections.server.ts';
 
-const ENV_FILE_NAME = '.codebay-host-env';
+/** Exported so the terminal/IDE launchers can source it explicitly — see `SOURCE_INJECTED_ENV`. */
+export const ENV_FILE_NAME = '.codebay-host-env';
 
 interface ResolvedVar {
 	name: string;

package/src/lib/config.server.ts

@@ -51,6 +51,9 @@ export const APP_VERSION: string = (() => {
 /** Per-instance working copies live here: <INSTANCES_DIR>/<id>/workspace. */
 export const INSTANCES_DIR = join(DATA_DIR, 'instances');
 
+/** Extracted Claude Code logs, in one flat folder that outlives the instances they came from. */
+export const LOGS_DIR = join(DATA_DIR, 'logs');
+
 export const DB_PATH = join(DATA_DIR, 'app.sqlite');
 
 export const PORT_BASE = 8001;

package/src/lib/db.server.ts

@@ -30,6 +30,8 @@ export interface InstanceRow {
 	remote_user: string | null;
 	/** `'local'` when the folder shipped its own config, else the injected image; null pre-dates this. */
 	image_source: string | null;
+	/** Sprite name chosen collision-free at creation; null pre-dates this and falls back to the id hash. */
+	avatar: string | null;
 	/** Fixed at creation: which editor surface this instance provisions and serves. */
 	mode: InstanceMode;
 	/** Terminal mode only: 1 when the scratch-shell pane was left open, so a reload restores it. */
@@ -64,8 +66,8 @@ export function closeDb(): void {
 export function insertInstance(row: InstanceRow): void {
 	db.query(
 		`INSERT INTO instances
-       (id, name, source_path, workspace_path, host_port, container_id, remote_workspace_folder, status, error, created_at, bridge_token, remote_user, image_source, mode, terminal_split)
-     VALUES ($id, $name, $source_path, $workspace_path, $host_port, $container_id, $remote_workspace_folder, $status, $error, $created_at, $bridge_token, $remote_user, $image_source, $mode, $terminal_split)`
+       (id, name, source_path, workspace_path, host_port, container_id, remote_workspace_folder, status, error, created_at, bridge_token, remote_user, image_source, avatar, mode, terminal_split)
+     VALUES ($id, $name, $source_path, $workspace_path, $host_port, $container_id, $remote_workspace_folder, $status, $error, $created_at, $bridge_token, $remote_user, $image_source, $avatar, $mode, $terminal_split)`
 	).run({
 		$id: row.id,
 		$name: row.name,
@@ -80,6 +82,7 @@ export function insertInstance(row: InstanceRow): void {
 		$bridge_token: row.bridge_token,
 		$remote_user: row.remote_user,
 		$image_source: row.image_source,
+		$avatar: row.avatar,
 		$mode: row.mode,
 		$terminal_split: row.terminal_split
 	});
@@ -143,7 +146,9 @@ const UPDATABLE_COLUMNS = [
 	'error',
 	'remote_user',
 	'image_source',
-	'terminal_split'
+	'terminal_split',
+	// Reassigned when a rebuild finds the recorded port taken over on the host.
+	'host_port'
 ] as const;
 
 type UpdatableColumn = (typeof UPDATABLE_COLUMNS)[number];