claude-mux 0.7.0

package/web/src/routes/api/projects/new-session/+server.ts

@@ -0,0 +1,50 @@
+import { json } from '@sveltejs/kit';
+import type { RequestHandler } from './$types';
+import { existsSync, statSync } from 'fs';
+import { execSync } from 'child_process';
+import { upsertSession } from '$shared/db/index.js';
+
+export const POST: RequestHandler = async ({ request }) => {
+	const { cwd } = await request.json();
+	if (!cwd) {
+		return json({ error: 'cwd required' }, { status: 400 });
+	}
+
+	// Check if the folder exists
+	if (!existsSync(cwd)) {
+		return json({ error: 'Folder does not exist' }, { status: 400 });
+	}
+	const stat = statSync(cwd);
+	if (!stat.isDirectory()) {
+		return json({ error: 'Path is not a directory' }, { status: 400 });
+	}
+
+	try {
+		// Create new tmux window and run claude in the specified directory
+		const sessionName = 'claude-' + Date.now();
+		const tmuxTarget = sessionName + ':1.1';
+		execSync(`tmux new-session -d -s "${sessionName}" -c "${cwd}" -- claude --dangerously-skip-permissions`, {
+			stdio: 'ignore'
+		});
+
+		// Add session immediately so it shows up in UI
+		try {
+			const id = crypto.randomUUID();
+			console.log('[new-session] Creating session:', { id, cwd, tmuxTarget });
+			upsertSession({
+				id,
+				pid: 0,
+				cwd,
+				tmux_target: tmuxTarget,
+				state: 'idle'
+			});
+			console.log('[new-session] Session created successfully');
+		} catch (err) {
+			console.error('[new-session] Session creation failed:', err);
+		}
+
+		return json({ ok: true, session: sessionName });
+	} catch {
+		return json({ error: 'Failed to create session' }, { status: 500 });
+	}
+};

package/web/src/routes/api/sessions/+server.ts

@@ -0,0 +1,62 @@
+import { json } from '@sveltejs/kit';
+import type { RequestHandler } from './$types';
+import { getAllSessions, updateSession } from '$shared/db/index.js';
+import { checkForInterruption, getPaneTitle } from '$shared/tmux/pane.js';
+
+// Sync session state by detecting interruptions (user pressed Escape)
+function syncSessionStates(): void {
+	const sessions = getAllSessions().filter((s) => s.tmux_target);
+
+	for (const session of sessions) {
+		if (!session.tmux_target) continue;
+
+		const update = checkForInterruption(session.tmux_target);
+		if (update && session.state !== 'idle') {
+			updateSession(session.id, update);
+		}
+	}
+}
+
+// Deduplicate sessions by tmux_target, keeping only the most recent one
+function deduplicateByTmuxTarget<T extends { tmux_target: string | null; last_update: number }>(
+	sessions: T[]
+): T[] {
+	const byTarget = new Map<string, T>();
+	const noTarget: T[] = [];
+
+	for (const session of sessions) {
+		if (!session.tmux_target) {
+			noTarget.push(session);
+			continue;
+		}
+
+		const existing = byTarget.get(session.tmux_target);
+		if (!existing || session.last_update > existing.last_update) {
+			byTarget.set(session.tmux_target, session);
+		}
+	}
+
+	return [...byTarget.values(), ...noTarget];
+}
+
+export const GET: RequestHandler = async () => {
+	try {
+		syncSessionStates();
+		const sessions = getAllSessions();
+		// Enrich sessions with pane titles from tmux
+		const enrichedSessions = sessions.map((s) => ({
+			...s,
+			pane_title: s.tmux_target ? getPaneTitle(s.tmux_target) : null
+		}));
+		// Deduplicate by tmux_target to avoid showing same pane multiple times
+		const dedupedSessions = deduplicateByTmuxTarget(enrichedSessions);
+
+		return json({
+			sessions: dedupedSessions,
+			count: dedupedSessions.length,
+			timestamp: Date.now()
+		});
+	} catch {
+		return json({ error: 'Error reading sessions' }, { status: 500 });
+	}
+};

package/web/src/routes/api/sessions/[id]/+server.ts

@@ -0,0 +1,19 @@
+import { json } from '@sveltejs/kit';
+import type { RequestHandler } from './$types';
+import { getSession } from '$shared/db/index.js';
+
+export const GET: RequestHandler = async ({ params }) => {
+	const id = params.id;
+	try {
+		const session = getSession(id);
+		if (!session) {
+			return json({ error: 'Session not found', id }, { status: 404 });
+		}
+		return json({
+			session,
+			timestamp: Date.now()
+		});
+	} catch {
+		return json({ error: 'Error reading session' }, { status: 500 });
+	}
+};

package/web/src/routes/api/sessions/[id]/kill/+server.ts

@@ -0,0 +1,46 @@
+import { json } from '@sveltejs/kit';
+import type { RequestHandler } from './$types';
+import { execFileSync } from 'child_process';
+import { deleteSession } from '$shared/db/index.js';
+
+export const POST: RequestHandler = async ({ params, request }) => {
+	const id = decodeURIComponent(params.id);
+	const body = await request.json().catch(() => ({}));
+	const { pid, tmux_target } = body;
+
+	try {
+		// Kill the Claude process first
+		if (typeof pid === 'number' && pid > 0 && Number.isInteger(pid)) {
+			try {
+				execFileSync('kill', [String(pid)], { stdio: 'ignore' });
+			} catch {
+				// Process may not exist - ignore
+			}
+		}
+
+		// Kill only the specific tmux pane (not the entire session)
+		if (tmux_target && typeof tmux_target === 'string') {
+			try {
+				execFileSync('tmux', ['kill-pane', '-t', tmux_target], { stdio: 'ignore' });
+			} catch {
+				// Pane may not exist - ignore
+			}
+		}
+
+		// Remove session file
+		try {
+			deleteSession(id);
+		} catch {
+			// Cleanup is best-effort
+		}
+		return json({ ok: true });
+	} catch {
+		// Even if kill fails, clean up session
+		try {
+			deleteSession(id);
+		} catch {
+			// Ignore
+		}
+		return json({ ok: true });
+	}
+};

package/web/src/routes/api/sessions/[id]/restart/+server.ts

@@ -0,0 +1,59 @@
+import { json } from '@sveltejs/kit';
+import type { RequestHandler } from './$types';
+import { execFileSync } from 'child_process';
+import { deleteSession } from '$shared/db/index.js';
+
+export const POST: RequestHandler = async ({ params, request }) => {
+	const id = decodeURIComponent(params.id);
+	const body = await request.json().catch(() => ({}));
+	const { pid, tmux_target, cwd } = body;
+
+	if (!tmux_target || typeof tmux_target !== 'string') {
+		return json({ error: 'tmux_target required' }, { status: 400 });
+	}
+
+	if (!cwd || typeof cwd !== 'string') {
+		return json({ error: 'cwd required' }, { status: 400 });
+	}
+
+	try {
+		// Kill the Claude process first (but keep the tmux pane)
+		if (typeof pid === 'number' && pid > 0 && Number.isInteger(pid)) {
+			try {
+				// Use SIGKILL for faster termination
+				execFileSync('kill', ['-9', String(pid)], { stdio: 'ignore' });
+			} catch {
+				// Process may not exist - ignore
+			}
+		}
+
+		// Remove old session file (hooks will create a new one when Claude starts)
+		try {
+			deleteSession(id);
+		} catch {
+			// Cleanup is best-effort
+		}
+
+		// Wait for the process to die and shell to be ready
+		await new Promise((resolve) => setTimeout(resolve, 300));
+
+		// Send Ctrl-C first to ensure we're at a clean shell prompt
+		// (in case the shell is showing exit status or waiting for input)
+		execFileSync('tmux', ['send-keys', '-t', tmux_target, 'C-c'], {
+			stdio: 'ignore'
+		});
+
+		// Small delay for Ctrl-C to be processed
+		await new Promise((resolve) => setTimeout(resolve, 100));
+
+		// Start a fresh Claude process in the same pane
+		// First cd to the correct directory, then start claude
+		execFileSync('tmux', ['send-keys', '-t', tmux_target, `cd "${cwd}" && claude --dangerously-skip-permissions`, 'Enter'], {
+			stdio: 'ignore'
+		});
+
+		return json({ ok: true });
+	} catch (err) {
+		return json({ error: 'Failed to restart session' }, { status: 500 });
+	}
+};

package/web/src/routes/api/sessions/[id]/screenshots/+server.ts

@@ -0,0 +1,32 @@
+import { json } from '@sveltejs/kit';
+import type { RequestHandler } from './$types';
+import { getSession, removeScreenshot } from '$shared/db/index.js';
+
+export const DELETE: RequestHandler = async ({ params, url }) => {
+	const id = decodeURIComponent(params.id);
+	const path = url.searchParams.get('path');
+
+	if (!id) {
+		return json({ error: 'Session ID required' }, { status: 400 });
+	}
+
+	if (!path) {
+		return json({ error: 'Screenshot path required' }, { status: 400 });
+	}
+
+	try {
+		const session = getSession(id);
+		if (!session) {
+			return json({ error: 'Session not found' }, { status: 404 });
+		}
+
+		const removed = removeScreenshot(id, path);
+		if (!removed) {
+			return json({ error: 'Screenshot not found' }, { status: 404 });
+		}
+
+		return json({ ok: true });
+	} catch {
+		return json({ error: 'Failed to remove screenshot' }, { status: 500 });
+	}
+};

package/web/src/routes/api/sessions/[id]/send/+server.ts

@@ -0,0 +1,31 @@
+import { json } from '@sveltejs/kit';
+import type { RequestHandler } from './$types';
+import { execFileSync, execSync } from 'child_process';
+
+export const POST: RequestHandler = async ({ params, request }) => {
+	const target = decodeURIComponent(params.id);
+	const body = await request.json();
+	const keys = body.keys || 'Escape';
+	const text = body.text; // For literal text input
+
+	try {
+		if (text) {
+			// For large text, use tmux buffer to avoid command-line length limits
+			// Load text into a named buffer via stdin, then paste it
+			execSync(`tmux load-buffer -b claude-mux-input -`, {
+				input: text,
+				stdio: ['pipe', 'ignore', 'ignore']
+			});
+			execFileSync('tmux', ['paste-buffer', '-b', 'claude-mux-input', '-t', target], {
+				stdio: 'ignore'
+			});
+			execFileSync('tmux', ['delete-buffer', '-b', 'claude-mux-input'], { stdio: 'ignore' });
+			execFileSync('tmux', ['send-keys', '-t', target, 'Enter'], { stdio: 'ignore' });
+		} else {
+			execFileSync('tmux', ['send-keys', '-t', target, keys], { stdio: 'ignore' });
+		}
+		return json({ ok: true });
+	} catch {
+		return json({ error: 'Failed to send keys' }, { status: 500 });
+	}
+};

package/web/src/routes/api/sessions/[target]/output/+server.ts

@@ -0,0 +1,13 @@
+import { json } from '@sveltejs/kit';
+import type { RequestHandler } from './$types';
+import { execFileSync } from 'child_process';
+
+export const GET: RequestHandler = async ({ params }) => {
+	const target = decodeURIComponent(params.target);
+	try {
+		const output = execFileSync('tmux', ['capture-pane', '-t', target, '-p', '-S', '-100'], { encoding: 'utf-8' });
+		return json({ output, timestamp: Date.now() });
+	} catch {
+		return json({ error: 'Failed to capture pane' }, { status: 500 });
+	}
+};

package/web/src/routes/api/tmux/panes/+server.ts

@@ -0,0 +1,32 @@
+import { json } from '@sveltejs/kit';
+import type { RequestHandler } from './$types';
+import { execSync } from 'child_process';
+
+export interface TmuxPane {
+	target: string;
+	session: string;
+	command: string;
+}
+
+export const GET: RequestHandler = async () => {
+	try {
+		const output = execSync(
+			'tmux list-panes -a -F "#{session_name}:#{window_index}.#{pane_index}\t#{pane_current_command}"',
+			{ encoding: 'utf-8' }
+		);
+
+		const panes: TmuxPane[] = output
+			.trim()
+			.split('\n')
+			.filter(Boolean)
+			.map((line) => {
+				const [target, command] = line.split('\t');
+				const session = target.split(':')[0];
+				return { target, session, command };
+			});
+
+		return json(panes);
+	} catch {
+		return json([]);
+	}
+};

package/web/src/routes/login/+page.server.ts

@@ -0,0 +1,18 @@
+import { redirect } from '@sveltejs/kit';
+import type { PageServerLoad } from './$types';
+import { isAuthEnabled, validateAuthToken, AUTH_COOKIE } from '$lib/server/auth.js';
+
+export const load: PageServerLoad = async ({ cookies }) => {
+	// If auth is not enabled, redirect to home
+	if (!isAuthEnabled()) {
+		throw redirect(302, '/');
+	}
+
+	// If already authenticated, redirect to home
+	const token = cookies.get(AUTH_COOKIE.name);
+	if (validateAuthToken(token)) {
+		throw redirect(302, '/');
+	}
+
+	return {};
+};

package/web/src/routes/login/+page.svelte

@@ -0,0 +1,69 @@
+<script lang="ts">
+	import { Button } from '$lib/components/ui/button';
+	import { goto } from '$app/navigation';
+
+	let password = $state('');
+	let error = $state('');
+	let loading = $state(false);
+
+	async function handleSubmit(e: SubmitEvent) {
+		e.preventDefault();
+		error = '';
+		loading = true;
+
+		try {
+			const response = await fetch('/api/auth/login', {
+				method: 'POST',
+				headers: { 'Content-Type': 'application/json' },
+				body: JSON.stringify({ password })
+			});
+
+			const data = await response.json();
+
+			if (response.ok) {
+				goto('/');
+				return;
+			} else {
+				error = data.error || 'Login failed';
+			}
+		} catch {
+			error = 'Network error';
+		} finally {
+			loading = false;
+		}
+	}
+</script>
+
+<svelte:head>
+	<title>Login - Claude Watch</title>
+</svelte:head>
+
+<div class="flex min-h-screen items-center justify-center bg-stone-950 p-4">
+	<div class="w-full max-w-sm space-y-6">
+		<div class="text-center">
+			<h1 class="text-2xl font-bold text-stone-100">Claude Watch</h1>
+			<p class="mt-2 text-sm text-stone-400">Enter password to continue</p>
+		</div>
+
+		<form onsubmit={handleSubmit} class="space-y-4">
+			<div>
+				<input
+					type="password"
+					bind:value={password}
+					placeholder="Password"
+					required
+					disabled={loading}
+					class="w-full rounded-md border border-stone-700 bg-stone-900 px-4 py-2 text-stone-100 placeholder-stone-500 focus:border-stone-500 focus:outline-none focus:ring-1 focus:ring-stone-500 disabled:opacity-50"
+				/>
+			</div>
+
+			{#if error}
+				<p class="text-sm text-red-400">{error}</p>
+			{/if}
+
+			<Button type="submit" class="w-full" disabled={loading}>
+				{loading ? 'Signing in...' : 'Sign in'}
+			</Button>
+		</form>
+	</div>
+</div>