@myrialabs/clopen 0.2.2 → 0.2.4

package/backend/ws/git/commit-message.ts

@@ -0,0 +1,108 @@
+/**
+ * Git Commit Message Generator Handler
+ *
+ * Uses AI engines to generate structured commit messages from staged diffs.
+ */
+
+import { t } from 'elysia';
+import { createRouter } from '$shared/utils/ws-server';
+import { execGit } from '../../git/git-executor';
+import { projectQueries } from '../../database/queries/project-queries';
+import { initializeEngine } from '../../engine';
+import { parseModelId } from '$shared/constants/engines';
+import type { EngineType } from '$shared/types/engine';
+import type { GeneratedCommitMessage } from '$shared/types/git';
+import { debug } from '$shared/utils/logger';
+
+const COMMIT_MESSAGE_SCHEMA = {
+	type: 'object',
+	properties: {
+		type: {
+			type: 'string',
+			enum: ['feat', 'fix', 'refactor', 'docs', 'test', 'chore', 'style', 'perf', 'ci', 'build'],
+			description: 'The conventional commit type'
+		},
+		scope: {
+			type: 'string',
+			description: 'Optional scope of the change (e.g., component name, module)'
+		},
+		subject: {
+			type: 'string',
+			description: 'Short imperative description, lowercase, no period, max 72 chars'
+		},
+		body: {
+			type: 'string',
+			description: 'Optional longer description explaining the why behind the change'
+		}
+	},
+	required: ['type', 'subject']
+};
+
+export const commitMessageHandler = createRouter()
+	.http('git:generate-commit-message', {
+		data: t.Object({
+			projectId: t.String(),
+			engine: t.String(),
+			model: t.String(),
+			format: t.Union([t.Literal('single-line'), t.Literal('multi-line')])
+		}),
+		response: t.Object({
+			message: t.String()
+		})
+	}, async ({ data }) => {
+		const project = projectQueries.getById(data.projectId);
+		if (!project) throw new Error('Project not found');
+
+		// Get raw staged diff text
+		const diffResult = await execGit(['diff', '--cached'], project.path);
+		const rawDiff = diffResult.stdout;
+
+		if (!rawDiff.trim()) {
+			throw new Error('No staged changes to generate a commit message for');
+		}
+
+		const engineType = data.engine as EngineType;
+		const engine = await initializeEngine(engineType);
+
+		if (!engine.generateStructured) {
+			throw new Error(`Engine "${engineType}" does not support structured generation`);
+		}
+
+		const formatInstruction = data.format === 'multi-line'
+			? 'Generate a multi-line conventional commit message with type, scope, subject, AND body fields. The body should explain WHY the change was made.'
+			: 'Generate a single-line conventional commit message with type, optional scope, and subject. Leave body empty.';
+
+		const prompt = `Analyze the following git diff and generate a conventional commit message.
+
+Rules:
+- type: one of feat, fix, refactor, docs, test, chore, style, perf, ci, build
+- scope: optional, the area of the codebase affected (e.g., git, settings, engine)
+- subject: imperative mood, lowercase, no period at end, max 72 characters
+- ${formatInstruction}
+
+Git diff:
+${rawDiff}`;
+
+		// Parse model ID: "claude-code:haiku" → modelId "haiku", "opencode:anthropic/claude-sonnet" → modelId "anthropic/claude-sonnet"
+		const { modelId } = parseModelId(data.model);
+
+		debug.log('git', `Generating commit message via ${engineType}/${modelId}`);
+
+		const result = await engine.generateStructured<GeneratedCommitMessage>({
+			prompt,
+			model: modelId,
+			schema: COMMIT_MESSAGE_SCHEMA,
+			projectPath: project.path
+		});
+
+		// Format structured output into conventional commit string
+		const scopePart = result.scope ? `(${result.scope})` : '';
+		const subject = `${result.type}${scopePart}: ${result.subject}`;
+
+		let message = subject;
+		if (data.format === 'multi-line' && result.body) {
+			message = `${subject}\n\n${result.body}`;
+		}
+
+		return { message };
+	});

package/backend/ws/git/index.ts

@@ -12,6 +12,7 @@ import { branchHandler } from './branch';
 import { logHandler } from './log';
 import { remoteHandler } from './remote';
 import { conflictHandler } from './conflict';
+import { commitMessageHandler } from './commit-message';
 
 export const gitRouter = createRouter()
 	.merge(statusHandler)
@@ -21,4 +22,5 @@ export const gitRouter = createRouter()
 	.merge(branchHandler)
 	.merge(logHandler)
 	.merge(remoteHandler)
-	.merge(conflictHandler);
+	.merge(conflictHandler)
+	.merge(commitMessageHandler);

package/backend/ws/messages/crud.ts

@@ -12,6 +12,15 @@ import { createRouter } from '$shared/utils/ws-server';
 import { messageQueries } from '../../database/queries';
 import { formatDatabaseMessage } from '$shared/utils/message-formatter';
 
+function extractTextContent(content: unknown): string {
+	if (typeof content === 'string') return content;
+	if (!Array.isArray(content)) return '';
+	return content
+		.filter((c: any) => c.type === 'text')
+		.map((b: any) => b.text || '')
+		.join(' ');
+}
+
 export const crudHandler = createRouter()
 	// List messages
 	.http('messages:list', {
@@ -33,6 +42,49 @@ export const crudHandler = createRouter()
 		}
 	})
 
+	// Bulk session preview — returns title, summary, and message counts for multiple sessions
+	// without loading all messages. Used by the Sessions/History modal.
+	.http('sessions:preview', {
+		data: t.Object({
+			session_ids: t.Array(t.String())
+		}),
+		response: t.Array(t.Any())
+	}, ({ data }) => {
+		return data.session_ids.map(sessionId => {
+			const preview = messageQueries.getSessionPreview(sessionId);
+
+			// Title from first user message
+			let title = 'New Conversation';
+			if (preview.firstUserMessage) {
+				const sdk = JSON.parse(preview.firstUserMessage.sdk_message);
+				const textContent = extractTextContent(sdk.message?.content).trim();
+				if (textContent) {
+					title = textContent.slice(0, 60) + (textContent.length > 60 ? '...' : '');
+				}
+			}
+
+			// Summary from last assistant message
+			let summary = 'No messages yet';
+			if (preview.lastAssistantMessage) {
+				const sdk = JSON.parse(preview.lastAssistantMessage.sdk_message);
+				const rawText = extractTextContent(sdk.message?.content);
+				const cleanText = rawText.replace(/```[\s\S]*?```/g, '').trim();
+				if (cleanText) {
+					summary = cleanText.slice(0, 100) + (cleanText.length > 100 ? '...' : '');
+				}
+			}
+
+			return {
+				session_id: sessionId,
+				title,
+				summary,
+				userCount: preview.userCount,
+				assistantCount: preview.assistantCount,
+				count: preview.userCount + preview.assistantCount
+			};
+		});
+	})
+
 	// Get message by ID
 	.http('messages:get', {
 		data: t.Object({

package/backend/ws/system/index.ts

@@ -8,7 +8,13 @@
  */
 
 import { createRouter } from '$shared/utils/ws-server';
+import { t } from 'elysia';
 import { operationsHandler } from './operations';
 
 export const systemRouter = createRouter()
-	.merge(operationsHandler);
+	.merge(operationsHandler)
+	// Declare system:update-completed event (broadcast after successful package update)
+	.emit('system:update-completed', t.Object({
+		fromVersion: t.String(),
+		toVersion: t.String()
+	}));

package/backend/ws/system/operations.ts

@@ -13,6 +13,10 @@ import { readFileSync } from 'node:fs';
 import { createRouter } from '$shared/utils/ws-server';
 import { initializeDatabase, getDatabase } from '../../database';
 import { debug } from '$shared/utils/logger';
+import { ws } from '$backend/utils/ws';
+
+/** In-memory flag: set after successful update, cleared on server restart */
+let pendingUpdate: { fromVersion: string; toVersion: string } | null = null;
 
 /** Read current version from package.json */
 function getCurrentVersion(): string {
@@ -56,7 +60,12 @@ export const operationsHandler = createRouter()
 		response: t.Object({
 			currentVersion: t.String(),
 			latestVersion: t.String(),
-			updateAvailable: t.Boolean()
+			updateAvailable: t.Boolean(),
+			pendingRestart: t.Boolean(),
+			pendingUpdate: t.Optional(t.Object({
+				fromVersion: t.String(),
+				toVersion: t.String()
+			}))
 		})
 	}, async () => {
 		const currentVersion = getCurrentVersion();
@@ -67,7 +76,13 @@ export const operationsHandler = createRouter()
 
 		debug.log('server', `Latest version: ${latestVersion}, update available: ${updateAvailable}`);
 
-		return { currentVersion, latestVersion, updateAvailable };
+		return {
+			currentVersion,
+			latestVersion,
+			updateAvailable,
+			pendingRestart: pendingUpdate !== null,
+			pendingUpdate: pendingUpdate ?? undefined
+		};
 	})
 
 	// Run package update
@@ -98,9 +113,20 @@ export const operationsHandler = createRouter()
 			throw new Error(`Update failed (exit code ${exitCode}): ${output}`);
 		}
 
+		const fromVersion = getCurrentVersion();
+
 		// Re-fetch to confirm new version
 		const newVersion = await fetchLatestVersion();
 
+		// Set pending restart flag (persists until server restarts)
+		pendingUpdate = { fromVersion, toVersion: newVersion };
+
+		// Broadcast to all connected clients
+		ws.emit.global('system:update-completed', {
+			fromVersion,
+			toVersion: newVersion
+		});
+
 		debug.log('server', `Update completed. New version: ${newVersion}`);
 
 		return { success: true, output, newVersion };

package/bin/clopen.ts

@@ -23,6 +23,7 @@ if (typeof globalThis.Bun === 'undefined') {
 
 import { existsSync, copyFileSync, readFileSync, writeFileSync } from 'fs';
 import { join } from 'path';
+import { loadEnvFile } from '../backend/utils/env';
 
 // CLI Options interface
 interface CLIOptions {
@@ -88,7 +89,7 @@ const MAX_PORT = 65535;
 
 function showHelp() {
 	console.log(`
-Clopen - Modern web UI for Claude Code
+Clopen - All-in-one web workspace for Claude Code & OpenCode
 
 USAGE:
   clopen [OPTIONS]
@@ -106,7 +107,7 @@ OPTIONS:
 
 EXAMPLES:
   clopen                  # Start with default settings (port ${DEFAULT_PORT})
-  clopen --port 9150      # Start on port 9150
+  clopen --port 9145      # Start on port 9145
   clopen --host 0.0.0.0   # Bind to all network interfaces
   clopen update           # Update to the latest version
   clopen reset-pat        # Regenerate admin login token
@@ -262,8 +263,8 @@ async function recoverAdminToken() {
 	console.log(`\x1b[36mClopen\x1b[0m v${version} — Admin Token Recovery\n`);
 
 	// Initialize database (import dynamically to avoid loading full backend)
-	const { initializeDatabase } = await import('../backend/lib/database/index');
-	const { listUsers, regeneratePAT } = await import('../backend/lib/auth/auth-service');
+	const { initializeDatabase } = await import('../backend/database/index');
+	const { listUsers, regeneratePAT } = await import('../backend/auth/auth-service');
 
 	await initializeDatabase();
 
@@ -367,21 +368,20 @@ async function startServer(options: CLIOptions) {
 	updateLoading('Starting server...');
 	await delay();
 
-	// Run server as subprocess to ensure it uses local node_modules
-	const serverPath = join(__dirname, 'backend/index.ts');
+	// Delegate to scripts/start.ts — handles port resolution (IPv4 + IPv6
+	// zombie detection) and starts backend in a single consistent path.
+	const startScript = join(__dirname, 'scripts/start.ts');
 
 	stopLoading();
 
-	// Prepare environment variables
-	const env = { ...process.env };
-	if (options.port) {
-		env.PORT = options.port.toString();
-	}
-	if (options.host) {
-		env.HOST = options.host;
-	}
+	// Overlay clopen's own .env on top of process.env to override any
+	// pollution from a .env file in the directory where `clopen` was invoked.
+	// CLI args take highest priority on top of that.
+	const env = { ...process.env, ...loadEnvFile(ENV_FILE) };
+	if (options.port) env.PORT = options.port.toString();
+	if (options.host) env.HOST = options.host;
 
-	const serverProc = Bun.spawn(['bun', serverPath], {
+	const serverProc = Bun.spawn(['bun', startScript], {
 		cwd: __dirname,
 		stdout: 'inherit',
 		stderr: 'inherit',

package/docker-compose.yml

@@ -0,0 +1,31 @@
+services:
+  clopen:
+    build:
+      context: .
+      dockerfile_inline: |
+        FROM oven/bun:latest
+        USER root
+        RUN apt-get update && apt-get install -y --no-install-recommends \
+            git \
+            curl \
+            chromium \
+            && rm -rf /var/lib/apt/lists/*
+        ENV PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true
+        ENV PUPPETEER_EXECUTABLE_PATH=/usr/bin/chromium
+        RUN curl -fsSL https://claude.ai/install.sh | bash
+        ENV PATH="/root/.claude/local:$PATH"
+        RUN curl -fsSL https://opencode.ai/install | bash
+        RUN bun add -g @myrialabs/clopen
+        EXPOSE 9141
+        CMD ["clopen", "--host", "0.0.0.0"]
+    restart: unless-stopped
+    ports:
+      - "${PORT:-9141}:9141"
+    volumes:
+      - clopen_data:/root/.clopen
+      - ${PROJECTS_DIR:-./projects}:/root/projects
+    environment:
+      - NODE_ENV=production
+
+volumes:
+  clopen_data:

package/frontend/App.svelte

@@ -4,6 +4,7 @@
 	import WorkspaceLayout from '$frontend/components/workspace/WorkspaceLayout.svelte';
 	import ConnectionBanner from '$frontend/components/common/feedback/ConnectionBanner.svelte';
 	import UpdateBanner from '$frontend/components/common/feedback/UpdateBanner.svelte';
+	import RestartRequiredModal from '$frontend/components/common/feedback/RestartRequiredModal.svelte';
 	import LoadingScreen from '$frontend/components/common/feedback/LoadingScreen.svelte';
 	import SetupPage from '$frontend/components/auth/SetupPage.svelte';
 	import LoginPage from '$frontend/components/auth/LoginPage.svelte';
@@ -70,4 +71,6 @@
 			</WorkspaceLayout>
 		</div>
 	</div>
+
+	<RestartRequiredModal />
 {/if}

package/frontend/components/auth/SetupPage.svelte

@@ -87,7 +87,7 @@
 	const stepLabels: Record<WizardStep, { label: string; icon: IconName }> = {
 		'auth-mode': { label: 'Login', icon: 'lucide:shield' },
 		'admin-account': { label: 'Account', icon: 'lucide:user-plus' },
-		'engines': { label: 'Engines', icon: 'lucide:cpu' },
+		'engines': { label: 'Engines', icon: 'lucide:plug' },
 		'preferences': { label: 'Preferences', icon: 'lucide:palette' }
 	};
 
@@ -100,14 +100,41 @@
 		authModeLoading = true;
 
 		try {
-			if (selectedAuthMode === 'none') {
-				await authStore.setupNoAuth();
-				completedSteps.add('auth-mode');
-				completedSteps.add('admin-account');
-				completedSteps = new Set(completedSteps);
-				currentStep = 'engines';
+			if (!isExistingUser) {
+				// Fresh setup — existing behavior
+				if (selectedAuthMode === 'none') {
+					await authStore.setupNoAuth();
+					completedSteps.add('auth-mode');
+					completedSteps.add('admin-account');
+					completedSteps = new Set(completedSteps);
+					currentStep = 'engines';
+				} else {
+					goToNextStep();
+				}
 			} else {
-				goToNextStep();
+				// Returning user (wizard shown again after refresh) — apply selected mode
+				const previousMode = authStore.authMode;
+				if (selectedAuthMode === 'none' && previousMode !== 'none') {
+					// with-auth → no-auth: update mode, skip admin-account
+					await authStore.switchToNoAuth();
+					completedSteps.add('auth-mode');
+					completedSteps.add('admin-account');
+					completedSteps = new Set(completedSteps);
+					currentStep = 'engines';
+				} else if (selectedAuthMode === 'required' && previousMode !== 'required') {
+					// no-auth → with-auth: update mode, regenerate PAT, go to admin-account
+					await authStore.switchToWithAuth();
+					goToNextStep();
+				} else if (selectedAuthMode === 'none') {
+					// Same mode (none) — skip admin-account, go to engines
+					completedSteps.add('auth-mode');
+					completedSteps.add('admin-account');
+					completedSteps = new Set(completedSteps);
+					currentStep = 'engines';
+				} else {
+					// Same mode (required) — advance to admin-account
+					goToNextStep();
+				}
 			}
 		} catch (err) {
 			authModeError = err instanceof Error ? err.message : 'Setup failed';
@@ -133,11 +160,16 @@
 		adminLoading = true;
 		try {
 			if (isExistingUser) {
-				// Existing user — just update name if changed and proceed
+				// Existing user — update name if changed
 				if (adminName.trim() !== existingUserName) {
 					await authStore.updateName(adminName.trim());
 				}
-				goToNextStep();
+				// If a PAT was just generated (e.g. switched from no-auth to with-auth), show it
+				if (authStore.personalAccessToken) {
+					showPAT = true;
+				} else {
+					goToNextStep();
+				}
 			} else {
 				await authStore.setup(adminName.trim());
 				showPAT = true;
@@ -324,8 +356,8 @@
 	});
 
 	// ─── Step 4: Preferences ───
-	const FONT_SIZE_MIN = 10;
-	const FONT_SIZE_MAX = 20;
+	const FONT_SIZE_MIN = 8;
+	const FONT_SIZE_MAX = 24;
 
 	function handleFontSizeChange(e: Event) {
 		const value = Number((e.target as HTMLInputElement).value);
@@ -570,7 +602,7 @@
 			{:else if currentStep === 'engines'}
 				<div class="space-y-4">
 					<div class="text-center">
-						<h2 class="text-base font-semibold text-slate-900 dark:text-slate-100 mb-1">AI Engines</h2>
+						<h2 class="text-base font-semibold text-slate-900 dark:text-slate-100 mb-1">Engines</h2>
 						<p class="text-sm text-slate-500 dark:text-slate-400">
 							Check your AI engine installations.
 						</p>

package/frontend/components/chat/input/ChatInput.svelte

@@ -141,7 +141,7 @@
 
 	const chatPlaceholder = $derived.by(() => {
 		if (chatBlockedReason === 'no-claude-account') {
-			return 'No Claude Code account connected. Configure it in Settings → AI Engine → Claude Code → Accounts.';
+			return 'No Claude Code account connected. Configure it in Settings → Engines → Claude Code → Accounts.';
 		}
 		if (chatBlockedReason === 'no-model') {
 			return 'No model selected. Please select a model to start chatting.';

package/frontend/components/chat/message/ChatMessage.svelte

@@ -24,7 +24,9 @@
 	import TokenUsageModal from '../modal/TokenUsageModal.svelte';
 	import DebugModal from '../modal/DebugModal.svelte';
 	import Dialog from '$frontend/components/common/overlay/Dialog.svelte';
-	import ws from '$frontend/utils/ws';
+	import ConflictResolutionModal from '$frontend/components/checkpoint/ConflictResolutionModal.svelte';
+	import { snapshotService } from '$frontend/services/snapshot/snapshot.service';
+	import type { RestoreConflict, ConflictResolution } from '$frontend/services/snapshot/snapshot.service';
 
 	const {
 		message,
@@ -39,6 +41,11 @@
 	let showTokenUsagePopup = $state(false);
 	let showRestoreConfirm = $state(false);
 
+	// Conflict resolution state
+	let showConflictModal = $state(false);
+	let conflictList = $state<RestoreConflict[]>([]);
+	let processingRestore = $state(false);
+
 	// Format timestamp
 	const formatTime = (timestamp?: string) => {
 		if (!timestamp) return 'Unknown';
@@ -268,15 +275,8 @@
 		showDebugPopup = false;
 	}
 
-	// Handle restore button click
+	// Handle restore button click - check conflicts first
 	async function handleRestore() {
-		showRestoreConfirm = true;
-	}
-
-	// Confirm restore action
-	async function confirmRestore() {
-		showRestoreConfirm = false;
-
 		if (!messageId) {
 			addNotification({
 				type: 'error',
@@ -287,16 +287,41 @@
 			return;
 		}
 
+		const currentSessionId = sessionState.currentSession?.id;
+		if (!currentSessionId) return;
+
 		try {
-			// Send restore request via WebSocket HTTP
-			await ws.http('snapshot:restore', {
+			const conflictCheck = await snapshotService.checkConflicts(messageId, currentSessionId);
+
+			if (conflictCheck.hasConflicts) {
+				// Show conflict resolution modal
+				conflictList = conflictCheck.conflicts;
+				showConflictModal = true;
+			} else {
+				// No conflicts - show simple confirmation
+				showRestoreConfirm = true;
+			}
+		} catch (error) {
+			debug.error('chat', 'Error checking conflicts:', error);
+			// Fallback to simple confirmation
+			showRestoreConfirm = true;
+		}
+	}
+
+	// Execute restore with optional conflict resolutions
+	async function executeRestore(resolutions?: ConflictResolution) {
+		if (!messageId || !sessionState.currentSession?.id) return;
+
+		processingRestore = true;
+
+		try {
+			await snapshotService.restore(
 				messageId,
-				sessionId: sessionState.currentSession?.id || ''
-			});
+				sessionState.currentSession.id,
+				resolutions
+			);
 
-			if (sessionState.currentSession?.id) {
-				await loadMessagesForSession(sessionState.currentSession.id);
-			}
+			await loadMessagesForSession(sessionState.currentSession.id);
 		} catch (error) {
 			debug.error('chat', 'Restore error:', error);
 			addNotification({
@@ -305,9 +330,22 @@
 				message: error instanceof Error ? error.message : 'Unknown error',
 				duration: 5000
 			});
+		} finally {
+			processingRestore = false;
 		}
 	}
 
+	// Confirm simple restore (no conflicts)
+	async function confirmRestore() {
+		showRestoreConfirm = false;
+		await executeRestore();
+	}
+
+	// Confirm restore with conflict resolutions
+	async function confirmConflictRestore(resolutions: ConflictResolution) {
+		await executeRestore(resolutions);
+	}
+
 	// Handle edit button click
 	async function handleEdit() {
 		if (!messageId) {
@@ -473,6 +511,16 @@ This will restore your conversation to this point.`}
 	}}
 />
 
+<!-- Conflict Resolution Modal -->
+<ConflictResolutionModal
+	bind:isOpen={showConflictModal}
+	conflicts={conflictList}
+	onConfirm={confirmConflictRestore}
+	onClose={() => {
+		conflictList = [];
+	}}
+/>
+
 <style>
 	/* Animate chevron icon when details are opened */
 	:global(details[open] summary .iconify) {