chore: add comments explaining host normalization

- Normalize all localhost variants to 'localhost' for consistent proxy
configuration in Vite and server setup.
- use one source of truth for network hosts functions by moving them to
a shared
- log production and development urls

.env.example

@@ -17,7 +17,7 @@
 
 # Backend server port (Express API + WebSocket server)
 #API server
-PORT=3001
+SERVER_PORT=3001
 #Frontend port
 VITE_PORT=5173
 

.gitignore

@@ -135,3 +135,6 @@ tasks/
 !src/i18n/locales/en/tasks.json
 !src/i18n/locales/ja/tasks.json
 !src/i18n/locales/ru/tasks.json
+
+# Git worktrees
+.worktrees/

README.ja.md

@@ -70,7 +70,7 @@
 npx @siteboon/claude-code-ui
 ```
 
-サーバーが起動し、`http://localhost:3001`（または設定した PORT）でアクセスできます。
+サーバーが起動し、`http://localhost:3001`（または設定した SERVER_PORT）でアクセスできます。
 
 **再起動**: サーバーを停止した後、同じ `npx` コマンドを再度実行するだけです
 ### グローバルインストール（定期的に使用する場合）

README.ko.md

@@ -70,7 +70,7 @@
 npx @siteboon/claude-code-ui
 ```
 
-서버가 시작되면 `http://localhost:3001` (또는 설정한 PORT)에서 접근할 수 있습니다.
+서버가 시작되면 `http://localhost:3001` (또는 설정한 SERVER_PORT)에서 접근할 수 있습니다.
 
 **재시작**: 서버를 중지한 후 동일한 `npx` 명령을 다시 실행하면 됩니다
 ### 전역 설치 (정기적 사용 시)

README.zh-CN.md

@@ -70,7 +70,7 @@
 npx @siteboon/claude-code-ui
 ```
 
-服务器将启动并可通过 `http://localhost:3001`(或您配置的 PORT)访问。
+服务器将启动并可通过 `http://localhost:3001`(或您配置的 SERVER_PORT)访问。
 
 **重启**: 停止服务器后只需再次运行相同的 `npx` 命令
 

package.json

@@ -26,7 +26,7 @@
   "scripts": {
     "dev": "concurrently --kill-others \"npm run server\" \"npm run client\"",
     "server": "node server/index.js",
-    "client": "vite --host",
+    "client": "vite",
     "build": "vite build",
     "preview": "vite preview",
     "typecheck": "tsc --noEmit -p tsconfig.json",

server/cli.js

@@ -110,7 +110,7 @@ function showStatus() {
 
     // Environment variables
     console.log(`\n${c.info('[INFO]')} Configuration:`);
-    console.log(`       PORT: ${c.bright(process.env.PORT || '3001')} ${c.dim(process.env.PORT ? '' : '(default)')}`);
+    console.log(`       SERVER_PORT: ${c.bright(process.env.SERVER_PORT || '3001')} ${c.dim(process.env.SERVER_PORT ? '' : '(default)')}`);
     console.log(`       DATABASE_PATH: ${c.dim(process.env.DATABASE_PATH || '(using default location)')}`);
     console.log(`       CLAUDE_CLI_PATH: ${c.dim(process.env.CLAUDE_CLI_PATH || 'claude (default)')}`);
     console.log(`       CONTEXT_WINDOW: ${c.dim(process.env.CONTEXT_WINDOW || '160000 (default)')}`);
@@ -134,7 +134,7 @@ function showStatus() {
     console.log(`      ${c.dim('>')} Use ${c.bright('cloudcli --port 8080')} to run on a custom port`);
     console.log(`      ${c.dim('>')} Use ${c.bright('cloudcli --database-path /path/to/db')} for custom database`);
     console.log(`      ${c.dim('>')} Run ${c.bright('cloudcli help')} for all options`);
-    console.log(`      ${c.dim('>')} Access the UI at http://localhost:${process.env.PORT || '3001'}\n`);
+    console.log(`      ${c.dim('>')} Access the UI at http://localhost:${process.env.SERVER_PORT || '3001'}\n`);
 }
 
 // Show help
@@ -169,7 +169,7 @@ Examples:
   $ cloudcli status                 # Show configuration
 
 Environment Variables:
-  PORT                Set server port (default: 3001)
+  SERVER_PORT         Set server port (default: 3001)
   DATABASE_PATH       Set custom database location
   CLAUDE_CLI_PATH     Set custom Claude CLI path
   CONTEXT_WINDOW      Set context window size (default: 160000)
@@ -260,9 +260,9 @@ function parseArgs(args) {
         const arg = args[i];
 
         if (arg === '--port' || arg === '-p') {
-            parsed.options.port = args[++i];
+            parsed.options.serverPort = args[++i];
         } else if (arg.startsWith('--port=')) {
-            parsed.options.port = arg.split('=')[1];
+            parsed.options.serverPort = arg.split('=')[1];
         } else if (arg === '--database-path') {
             parsed.options.databasePath = args[++i];
         } else if (arg.startsWith('--database-path=')) {
@@ -285,8 +285,8 @@ async function main() {
     const { command, options } = parseArgs(args);
 
     // Apply CLI options to environment variables
-    if (options.port) {
+    if (options.serverPort) {
-        process.env.PORT = options.port;
+        process.env.SERVER_PORT = options.serverPort;
     }
     if (options.databasePath) {
         process.env.DATABASE_PATH = options.databasePath;

server/cursor-cli.js

@@ -1,20 +1,33 @@
 import { spawn } from 'child_process';
 import crossSpawn from 'cross-spawn';
-import { promises as fs } from 'fs';
-import path from 'path';
-import os from 'os';
 
 // Use cross-spawn on Windows for better command execution
 const spawnFunction = process.platform === 'win32' ? crossSpawn : spawn;
 
 let activeCursorProcesses = new Map(); // Track active processes by session ID
 
+const WORKSPACE_TRUST_PATTERNS = [
+  /workspace trust required/i,
+  /do you trust the contents of this directory/i,
+  /working with untrusted contents/i,
+  /pass --trust,\s*--yolo,\s*or -f/i
+];
+
+function isWorkspaceTrustPrompt(text = '') {
+  if (!text || typeof text !== 'string') {
+    return false;
+  }
+
+  return WORKSPACE_TRUST_PATTERNS.some((pattern) => pattern.test(text));
+}
+
 async function spawnCursor(command, options = {}, ws) {
   return new Promise(async (resolve, reject) => {
-    const { sessionId, projectPath, cwd, resume, toolsSettings, skipPermissions, model, images } = options;
+    const { sessionId, projectPath, cwd, resume, toolsSettings, skipPermissions, model } = options;
     let capturedSessionId = sessionId; // Track session ID throughout the process
     let sessionCreatedSent = false; // Track if we've already sent session-created event
-    let messageBuffer = ''; // Buffer for accumulating assistant messages
+    let hasRetriedWithTrust = false;
+    let settled = false;
 
     // Use tools settings passed from frontend, or defaults
     const settings = toolsSettings || {
@@ -23,36 +36,56 @@ async function spawnCursor(command, options = {}, ws) {
     };
 
     // Build Cursor CLI command
-    const args = [];
+    const baseArgs = [];
 
     // Build flags allowing both resume and prompt together (reply in existing session)
     // Treat presence of sessionId as intention to resume, regardless of resume flag
     if (sessionId) {
-      args.push('--resume=' + sessionId);
+      baseArgs.push('--resume=' + sessionId);
     }
 
     if (command && command.trim()) {
       // Provide a prompt (works for both new and resumed sessions)
-      args.push('-p', command);
+      baseArgs.push('-p', command);
 
       // Add model flag if specified (only meaningful for new sessions; harmless on resume)
       if (!sessionId && model) {
-        args.push('--model', model);
+        baseArgs.push('--model', model);
       }
 
       // Request streaming JSON when we are providing a prompt
-      args.push('--output-format', 'stream-json');
+      baseArgs.push('--output-format', 'stream-json');
     }
 
     // Add skip permissions flag if enabled
     if (skipPermissions || settings.skipPermissions) {
-      args.push('-f');
+      baseArgs.push('-f');
-      console.log('⚠️  Using -f flag (skip permissions)');
+      console.log('Using -f flag (skip permissions)');
     }
 
     // Use cwd (actual project directory) instead of projectPath
     const workingDir = cwd || projectPath || process.cwd();
 
+    // Store process reference for potential abort
+    const processKey = capturedSessionId || Date.now().toString();
+
+    const settleOnce = (callback) => {
+      if (settled) {
+        return;
+      }
+      settled = true;
+      callback();
+    };
+
+    const runCursorProcess = (args, runReason = 'initial') => {
+      const isTrustRetry = runReason === 'trust-retry';
+      let runSawWorkspaceTrustPrompt = false;
+      let stdoutLineBuffer = '';
+
+      if (isTrustRetry) {
+        console.log('Retrying Cursor CLI with --trust after workspace trust prompt');
+      }
+
       console.log('Spawning Cursor CLI:', 'cursor-agent', args.join(' '));
       console.log('Working directory:', workingDir);
       console.log('Session info - Input sessionId:', sessionId, 'Resume:', resume);
@@ -63,21 +96,28 @@ async function spawnCursor(command, options = {}, ws) {
         env: { ...process.env } // Inherit all environment variables
       });
 
-    // Store process reference for potential abort
-    const processKey = capturedSessionId || Date.now().toString();
       activeCursorProcesses.set(processKey, cursorProcess);
 
-    // Handle stdout (streaming JSON responses)
+      const shouldSuppressForTrustRetry = (text) => {
-    cursorProcess.stdout.on('data', (data) => {
+        if (hasRetriedWithTrust || args.includes('--trust')) {
-      const rawOutput = data.toString();
+          return false;
-      console.log('📤 Cursor CLI stdout:', rawOutput);
+        }
+        if (!isWorkspaceTrustPrompt(text)) {
+          return false;
+        }
 
-      const lines = rawOutput.split('\n').filter(line => line.trim());
+        runSawWorkspaceTrustPrompt = true;
+        return true;
+      };
+
+      const processCursorOutputLine = (line) => {
+        if (!line || !line.trim()) {
+          return;
+        }
 
-      for (const line of lines) {
         try {
           const response = JSON.parse(line);
-          console.log('📄 Parsed JSON response:', response);
+          console.log('Parsed JSON response:', response);
 
           // Handle different message types
           switch (response.type) {
@@ -86,7 +126,7 @@ async function spawnCursor(command, options = {}, ws) {
                 // Capture session ID
                 if (response.session_id && !capturedSessionId) {
                   capturedSessionId = response.session_id;
-                  console.log('📝 Captured session ID:', capturedSessionId);
+                  console.log('Captured session ID:', capturedSessionId);
 
                   // Update process key with captured session ID
                   if (processKey !== capturedSessionId) {
@@ -133,7 +173,6 @@ async function spawnCursor(command, options = {}, ws) {
               // Accumulate assistant message chunks
               if (response.message && response.message.content && response.message.content.length > 0) {
                 const textContent = response.message.content[0].text;
-                messageBuffer += textContent;
 
                 // Send as Claude-compatible format for frontend
                 ws.send({
@@ -154,18 +193,9 @@ async function spawnCursor(command, options = {}, ws) {
               // Session complete
               console.log('Cursor session result:', response);
 
-              // Send final message if we have buffered content
+              // Do not emit an extra content_block_stop here.
-              if (messageBuffer) {
+              // The UI already finalizes the streaming message in cursor-result handling,
-                ws.send({
+              // and emitting both can produce duplicate assistant messages.
-                  type: 'claude-response',
-                  data: {
-                    type: 'content_block_stop'
-                  },
-                  sessionId: capturedSessionId || sessionId || null
-                });
-              }
-              
-              // Send completion event
               ws.send({
                 type: 'cursor-result',
                 sessionId: capturedSessionId || sessionId,
@@ -183,7 +213,12 @@ async function spawnCursor(command, options = {}, ws) {
               });
           }
         } catch (parseError) {
-          console.log('📄 Non-JSON response:', line);
+          console.log('Non-JSON response:', line);
+
+          if (shouldSuppressForTrustRetry(line)) {
+            return;
+          }
+
           // If not JSON, send as raw text
           ws.send({
             type: 'cursor-output',
@@ -191,15 +226,35 @@ async function spawnCursor(command, options = {}, ws) {
             sessionId: capturedSessionId || sessionId || null
           });
         }
-      }
+      };
+
+      // Handle stdout (streaming JSON responses)
+      cursorProcess.stdout.on('data', (data) => {
+        const rawOutput = data.toString();
+        console.log('Cursor CLI stdout:', rawOutput);
+
+        // Stream chunks can split JSON objects across packets; keep trailing partial line.
+        stdoutLineBuffer += rawOutput;
+        const completeLines = stdoutLineBuffer.split(/\r?\n/);
+        stdoutLineBuffer = completeLines.pop() || '';
+
+        completeLines.forEach((line) => {
+          processCursorOutputLine(line.trim());
+        });
       });
 
       // Handle stderr
       cursorProcess.stderr.on('data', (data) => {
-      console.error('Cursor CLI stderr:', data.toString());
+        const stderrText = data.toString();
+        console.error('Cursor CLI stderr:', stderrText);
+
+        if (shouldSuppressForTrustRetry(stderrText)) {
+          return;
+        }
+
         ws.send({
           type: 'cursor-error',
-        error: data.toString(),
+          error: stderrText,
           sessionId: capturedSessionId || sessionId || null
         });
       });
@@ -208,10 +263,26 @@ async function spawnCursor(command, options = {}, ws) {
       cursorProcess.on('close', async (code) => {
         console.log(`Cursor CLI process exited with code ${code}`);
 
-      // Clean up process reference
         const finalSessionId = capturedSessionId || sessionId || processKey;
         activeCursorProcesses.delete(finalSessionId);
 
+        // Flush any final unterminated stdout line before completion handling.
+        if (stdoutLineBuffer.trim()) {
+          processCursorOutputLine(stdoutLineBuffer.trim());
+          stdoutLineBuffer = '';
+        }
+
+        if (
+          runSawWorkspaceTrustPrompt &&
+          code !== 0 &&
+          !hasRetriedWithTrust &&
+          !args.includes('--trust')
+        ) {
+          hasRetriedWithTrust = true;
+          runCursorProcess([...args, '--trust'], 'trust-retry');
+          return;
+        }
+
         ws.send({
           type: 'claude-complete',
           sessionId: finalSessionId,
@@ -220,9 +291,9 @@ async function spawnCursor(command, options = {}, ws) {
         });
 
         if (code === 0) {
-        resolve();
+          settleOnce(() => resolve());
         } else {
-        reject(new Error(`Cursor CLI exited with code ${code}`));
+          settleOnce(() => reject(new Error(`Cursor CLI exited with code ${code}`)));
         }
       });
 
@@ -240,18 +311,21 @@ async function spawnCursor(command, options = {}, ws) {
           sessionId: capturedSessionId || sessionId || null
         });
 
-      reject(error);
+        settleOnce(() => reject(error));
       });
 
       // Close stdin since Cursor doesn't need interactive input
       cursorProcess.stdin.end();
+    };
+
+    runCursorProcess(baseArgs, 'initial');
   });
 }
 
 function abortCursorSession(sessionId) {
   const process = activeCursorProcesses.get(sessionId);
   if (process) {
-    console.log(`🛑 Aborting Cursor session: ${sessionId}`);
+    console.log(`Aborting Cursor session: ${sessionId}`);
     process.kill('SIGTERM');
     activeCursorProcesses.delete(sessionId);
     return true;

server/index.js

@@ -31,7 +31,7 @@ const c = {
     dim: (text) => `${colors.dim}${text}${colors.reset}`,
 };
 
-console.log('PORT from env:', process.env.PORT);
+console.log('SERVER_PORT from env:', process.env.SERVER_PORT);
 
 import express from 'express';
 import { WebSocketServer, WebSocket } from 'ws';
@@ -69,6 +69,7 @@ import { startEnabledPluginServers, stopAllPlugins } from './utils/plugin-proces
 import { initializeDatabase, sessionNamesDb, applyCustomSessionNames } from './database/db.js';
 import { validateApiKey, authenticateToken, authenticateWebSocket } from './middleware/auth.js';
 import { IS_PLATFORM } from './constants/config.js';
+import { getConnectableHost } from '../shared/networkHosts.js';
 
 const VALID_PROVIDERS = ['claude', 'codex', 'cursor', 'gemini'];
 
@@ -1730,8 +1731,14 @@ function handleShellConnection(ws) {
                             shellCommand = 'cursor-agent';
                         }
                     } else if (provider === 'codex') {
+                        // Use codex command; attempt to resume and fall back to a new session when the resume fails.
                         if (hasSession && sessionId) {
+                            if (os.platform() === 'win32') {
+                                // PowerShell syntax for fallback
+                                shellCommand = `codex resume "${sessionId}"; if ($LASTEXITCODE -ne 0) { codex }`;
+                            } else {
                                 shellCommand = `codex resume "${sessionId}" || codex`;
+                            }
                         } else {
                             shellCommand = 'codex';
                         }
@@ -1765,7 +1772,11 @@ function handleShellConnection(ws) {
                         // Claude (default provider)
                         const command = initialCommand || 'claude';
                         if (hasSession && sessionId) {
+                            if (os.platform() === 'win32') {
+                                shellCommand = `claude --resume "${sessionId}"; if ($LASTEXITCODE -ne 0) { claude }`;
+                            } else {
                                 shellCommand = `claude --resume "${sessionId}" || claude`;
+                            }
                         } else {
                             shellCommand = command;
                         }
@@ -2391,7 +2402,8 @@ app.get('*', (req, res) => {
         res.sendFile(indexPath);
     } else {
         // In development, redirect to Vite dev server only if dist doesn't exist
-        res.redirect(`http://localhost:${process.env.VITE_PORT || 5173}`);
+        const redirectHost = getConnectableHost(req.hostname);
+        res.redirect(`${req.protocol}://${redirectHost}:${VITE_PORT}`);
     }
 });
 
@@ -2479,10 +2491,10 @@ async function getFileTree(dirPath, maxDepth = 3, currentDepth = 0, showHidden =
     });
 }
 
-const PORT = process.env.PORT || 3001;
+const SERVER_PORT = process.env.SERVER_PORT || 3001;
 const HOST = process.env.HOST || '0.0.0.0';
-// Show localhost in URL when binding to all interfaces (0.0.0.0 isn't a connectable address)
+const DISPLAY_HOST = getConnectableHost(HOST);
-const DISPLAY_HOST = HOST === '0.0.0.0' ? 'localhost' : HOST;
+const VITE_PORT = process.env.VITE_PORT || 5173;
 
 // Initialize database and start server
 async function startServer() {
@@ -2496,13 +2508,15 @@ async function startServer() {
 
         // Log Claude implementation mode
         console.log(`${c.info('[INFO]')} Using Claude Agents SDK for Claude integration`);
-        console.log(`${c.info('[INFO]')} Running in ${c.bright(isProduction ? 'PRODUCTION' : 'DEVELOPMENT')} mode`);
+        console.log('');
 
-        if (!isProduction) {
+        if (isProduction) {
-            console.log(`${c.warn('[WARN]')} Note: Requests will be proxied to Vite dev server at ${c.dim('http://localhost:' + (process.env.VITE_PORT || 5173))}`);
+            console.log(`${c.info('[INFO]')} To run in production mode, go to http://${DISPLAY_HOST}:${SERVER_PORT}`);            
         }
 
-        server.listen(PORT, HOST, async () => {
+        console.log(`${c.info('[INFO]')} To run in development mode with hot-module replacement, go to http://${DISPLAY_HOST}:${VITE_PORT}`);
+   
+        server.listen(SERVER_PORT, HOST, async () => {
             const appInstallPath = path.join(__dirname, '..');
 
             console.log('');
@@ -2510,7 +2524,7 @@ async function startServer() {
             console.log(`  ${c.bright('Claude Code UI Server - Ready')}`);
             console.log(c.dim('═'.repeat(63)));
             console.log('');
-            console.log(`${c.info('[INFO]')} Server URL:  ${c.bright('http://' + DISPLAY_HOST + ':' + PORT)}`);
+            console.log(`${c.info('[INFO]')} Server URL:  ${c.bright('http://' + DISPLAY_HOST + ':' + SERVER_PORT)}`);
             console.log(`${c.info('[INFO]')} Installed at: ${c.dim(appInstallPath)}`);
             console.log(`${c.tip('[TIP]')}  Run "cloudcli status" for full configuration details`);
             console.log('');

server/routes/git.js

@@ -7,6 +7,7 @@ import { queryClaudeSDK } from '../claude-sdk.js';
 import { spawnCursor } from '../cursor-cli.js';
 
 const router = express.Router();
+const COMMIT_DIFF_CHARACTER_LIMIT = 500_000;
 
 function spawnAsync(command, args, options = {}) {
   return new Promise((resolve, reject) => {
@@ -107,8 +108,7 @@ async function getActualProjectPath(projectName) {
     projectPath = await extractProjectDirectory(projectName);
   } catch (error) {
     console.error(`Error extracting project directory for ${projectName}:`, error);
-    // Fallback to the old method
+    throw new Error(`Unable to resolve project path for "${projectName}"`);
-    projectPath = projectName.replace(/-/g, '/');
   }
   return validateProjectPath(projectPath);
 }
@@ -166,6 +166,127 @@ async function validateGitRepository(projectPath) {
   }
 }
 
+function getGitErrorDetails(error) {
+  return `${error?.message || ''} ${error?.stderr || ''} ${error?.stdout || ''}`;
+}
+
+function isMissingHeadRevisionError(error) {
+  const errorDetails = getGitErrorDetails(error).toLowerCase();
+  return errorDetails.includes('unknown revision')
+    || errorDetails.includes('ambiguous argument')
+    || errorDetails.includes('needed a single revision')
+    || errorDetails.includes('bad revision');
+}
+
+async function getCurrentBranchName(projectPath) {
+  try {
+    // symbolic-ref works even when the repository has no commits.
+    const { stdout } = await spawnAsync('git', ['symbolic-ref', '--short', 'HEAD'], { cwd: projectPath });
+    const branchName = stdout.trim();
+    if (branchName) {
+      return branchName;
+    }
+  } catch (error) {
+    // Fall back to rev-parse for detached HEAD and older git edge cases.
+  }
+
+  const { stdout } = await spawnAsync('git', ['rev-parse', '--abbrev-ref', 'HEAD'], { cwd: projectPath });
+  return stdout.trim();
+}
+
+async function repositoryHasCommits(projectPath) {
+  try {
+    await spawnAsync('git', ['rev-parse', '--verify', 'HEAD'], { cwd: projectPath });
+    return true;
+  } catch (error) {
+    if (isMissingHeadRevisionError(error)) {
+      return false;
+    }
+    throw error;
+  }
+}
+
+async function getRepositoryRootPath(projectPath) {
+  const { stdout } = await spawnAsync('git', ['rev-parse', '--show-toplevel'], { cwd: projectPath });
+  return stdout.trim();
+}
+
+function normalizeRepositoryRelativeFilePath(filePath) {
+  return String(filePath)
+    .replace(/\\/g, '/')
+    .replace(/^\.\/+/, '')
+    .replace(/^\/+/, '')
+    .trim();
+}
+
+function parseStatusFilePaths(statusOutput) {
+  return statusOutput
+    .split('\n')
+    .map((line) => line.trimEnd())
+    .filter((line) => line.trim())
+    .map((line) => {
+      const statusPath = line.substring(3);
+      const renamedFilePath = statusPath.split(' -> ')[1];
+      return normalizeRepositoryRelativeFilePath(renamedFilePath || statusPath);
+    })
+    .filter(Boolean);
+}
+
+function buildFilePathCandidates(projectPath, repositoryRootPath, filePath) {
+  const normalizedFilePath = normalizeRepositoryRelativeFilePath(filePath);
+  const projectRelativePath = normalizeRepositoryRelativeFilePath(path.relative(repositoryRootPath, projectPath));
+  const candidates = [normalizedFilePath];
+
+  if (
+    projectRelativePath
+    && projectRelativePath !== '.'
+    && !normalizedFilePath.startsWith(`${projectRelativePath}/`)
+  ) {
+    candidates.push(`${projectRelativePath}/${normalizedFilePath}`);
+  }
+
+  return Array.from(new Set(candidates.filter(Boolean)));
+}
+
+async function resolveRepositoryFilePath(projectPath, filePath) {
+  validateFilePath(filePath);
+
+  const repositoryRootPath = await getRepositoryRootPath(projectPath);
+  const candidateFilePaths = buildFilePathCandidates(projectPath, repositoryRootPath, filePath);
+
+  for (const candidateFilePath of candidateFilePaths) {
+    const { stdout } = await spawnAsync('git', ['status', '--porcelain', '--', candidateFilePath], { cwd: repositoryRootPath });
+    if (stdout.trim()) {
+      return {
+        repositoryRootPath,
+        repositoryRelativeFilePath: candidateFilePath,
+      };
+    }
+  }
+
+  // If the caller sent a bare filename (e.g. "hello.ts"), recover it from changed files.
+  const normalizedFilePath = normalizeRepositoryRelativeFilePath(filePath);
+  if (!normalizedFilePath.includes('/')) {
+    const { stdout: repositoryStatusOutput } = await spawnAsync('git', ['status', '--porcelain'], { cwd: repositoryRootPath });
+    const changedFilePaths = parseStatusFilePaths(repositoryStatusOutput);
+    const suffixMatches = changedFilePaths.filter(
+      (changedFilePath) => changedFilePath === normalizedFilePath || changedFilePath.endsWith(`/${normalizedFilePath}`),
+    );
+
+    if (suffixMatches.length === 1) {
+      return {
+        repositoryRootPath,
+        repositoryRelativeFilePath: suffixMatches[0],
+      };
+    }
+  }
+
+  return {
+    repositoryRootPath,
+    repositoryRelativeFilePath: candidateFilePaths[0],
+  };
+}
+
 // Get git status for a project
 router.get('/status', async (req, res) => {
   const { project } = req.query;
@@ -180,21 +301,8 @@ router.get('/status', async (req, res) => {
     // Validate git repository
     await validateGitRepository(projectPath);
 
-    // Get current branch - handle case where there are no commits yet
+    const branch = await getCurrentBranchName(projectPath);
-    let branch = 'main';
+    const hasCommits = await repositoryHasCommits(projectPath);
-    let hasCommits = true;
-    try {
-      const { stdout: branchOutput } = await spawnAsync('git', ['rev-parse', '--abbrev-ref', 'HEAD'], { cwd: projectPath });
-      branch = branchOutput.trim();
-    } catch (error) {
-      // No HEAD exists - repository has no commits yet
-      if (error.message.includes('unknown revision') || error.message.includes('ambiguous argument')) {
-        hasCommits = false;
-        branch = 'main';
-      } else {
-        throw error;
-      }
-    }
 
     // Get git status
     const { stdout: statusOutput } = await spawnAsync('git', ['status', '--porcelain'], { cwd: projectPath });
@@ -256,46 +364,64 @@ router.get('/diff', async (req, res) => {
     // Validate git repository
     await validateGitRepository(projectPath);
 
-    // Validate file path
+    const {
-    validateFilePath(file, projectPath);
+      repositoryRootPath,
+      repositoryRelativeFilePath,
+    } = await resolveRepositoryFilePath(projectPath, file);
 
     // Check if file is untracked or deleted
-    const { stdout: statusOutput } = await spawnAsync('git', ['status', '--porcelain', file], { cwd: projectPath });
+    const { stdout: statusOutput } = await spawnAsync(
+      'git',
+      ['status', '--porcelain', '--', repositoryRelativeFilePath],
+      { cwd: repositoryRootPath },
+    );
     const isUntracked = statusOutput.startsWith('??');
     const isDeleted = statusOutput.trim().startsWith('D ') || statusOutput.trim().startsWith(' D');
 
     let diff;
     if (isUntracked) {
       // For untracked files, show the entire file content as additions
-      const filePath = path.join(projectPath, file);
+      const filePath = path.join(repositoryRootPath, repositoryRelativeFilePath);
       const stats = await fs.stat(filePath);
 
       if (stats.isDirectory()) {
         // For directories, show a simple message
-        diff = `Directory: ${file}\n(Cannot show diff for directories)`;
+        diff = `Directory: ${repositoryRelativeFilePath}\n(Cannot show diff for directories)`;
       } else {
         const fileContent = await fs.readFile(filePath, 'utf-8');
         const lines = fileContent.split('\n');
-        diff = `--- /dev/null\n+++ b/${file}\n@@ -0,0 +1,${lines.length} @@\n` +
+        diff = `--- /dev/null\n+++ b/${repositoryRelativeFilePath}\n@@ -0,0 +1,${lines.length} @@\n` +
                lines.map(line => `+${line}`).join('\n');
       }
     } else if (isDeleted) {
       // For deleted files, show the entire file content from HEAD as deletions
-      const { stdout: fileContent } = await spawnAsync('git', ['show', `HEAD:${file}`], { cwd: projectPath });
+      const { stdout: fileContent } = await spawnAsync(
+        'git',
+        ['show', `HEAD:${repositoryRelativeFilePath}`],
+        { cwd: repositoryRootPath },
+      );
       const lines = fileContent.split('\n');
-      diff = `--- a/${file}\n+++ /dev/null\n@@ -1,${lines.length} +0,0 @@\n` +
+      diff = `--- a/${repositoryRelativeFilePath}\n+++ /dev/null\n@@ -1,${lines.length} +0,0 @@\n` +
              lines.map(line => `-${line}`).join('\n');
     } else {
       // Get diff for tracked files
       // First check for unstaged changes (working tree vs index)
-      const { stdout: unstagedDiff } = await spawnAsync('git', ['diff', '--', file], { cwd: projectPath });
+      const { stdout: unstagedDiff } = await spawnAsync(
+        'git',
+        ['diff', '--', repositoryRelativeFilePath],
+        { cwd: repositoryRootPath },
+      );
 
       if (unstagedDiff) {
         // Show unstaged changes if they exist
         diff = stripDiffHeaders(unstagedDiff);
       } else {
         // If no unstaged changes, check for staged changes (index vs HEAD)
-        const { stdout: stagedDiff } = await spawnAsync('git', ['diff', '--cached', '--', file], { cwd: projectPath });
+        const { stdout: stagedDiff } = await spawnAsync(
+          'git',
+          ['diff', '--cached', '--', repositoryRelativeFilePath],
+          { cwd: repositoryRootPath },
+        );
         diff = stripDiffHeaders(stagedDiff) || '';
       }
     }
@@ -321,11 +447,17 @@ router.get('/file-with-diff', async (req, res) => {
     // Validate git repository
     await validateGitRepository(projectPath);
 
-    // Validate file path
+    const {
-    validateFilePath(file, projectPath);
+      repositoryRootPath,
+      repositoryRelativeFilePath,
+    } = await resolveRepositoryFilePath(projectPath, file);
 
     // Check file status
-    const { stdout: statusOutput } = await spawnAsync('git', ['status', '--porcelain', file], { cwd: projectPath });
+    const { stdout: statusOutput } = await spawnAsync(
+      'git',
+      ['status', '--porcelain', '--', repositoryRelativeFilePath],
+      { cwd: repositoryRootPath },
+    );
     const isUntracked = statusOutput.startsWith('??');
     const isDeleted = statusOutput.trim().startsWith('D ') || statusOutput.trim().startsWith(' D');
 
@@ -334,12 +466,16 @@ router.get('/file-with-diff', async (req, res) => {
 
     if (isDeleted) {
       // For deleted files, get content from HEAD
-      const { stdout: headContent } = await spawnAsync('git', ['show', `HEAD:${file}`], { cwd: projectPath });
+      const { stdout: headContent } = await spawnAsync(
+        'git',
+        ['show', `HEAD:${repositoryRelativeFilePath}`],
+        { cwd: repositoryRootPath },
+      );
       oldContent = headContent;
       currentContent = headContent; // Show the deleted content in editor
     } else {
       // Get current file content
-      const filePath = path.join(projectPath, file);
+      const filePath = path.join(repositoryRootPath, repositoryRelativeFilePath);
       const stats = await fs.stat(filePath);
 
       if (stats.isDirectory()) {
@@ -352,7 +488,11 @@ router.get('/file-with-diff', async (req, res) => {
       if (!isUntracked) {
         // Get the old content from HEAD for tracked files
         try {
-          const { stdout: headContent } = await spawnAsync('git', ['show', `HEAD:${file}`], { cwd: projectPath });
+          const { stdout: headContent } = await spawnAsync(
+            'git',
+            ['show', `HEAD:${repositoryRelativeFilePath}`],
+            { cwd: repositoryRootPath },
+          );
           oldContent = headContent;
         } catch (error) {
           // File might be newly added to git (staged but not committed)
@@ -430,15 +570,16 @@ router.post('/commit', async (req, res) => {
     
     // Validate git repository
     await validateGitRepository(projectPath);
+    const repositoryRootPath = await getRepositoryRootPath(projectPath);
     
     // Stage selected files
     for (const file of files) {
-      validateFilePath(file, projectPath);
+      const { repositoryRelativeFilePath } = await resolveRepositoryFilePath(projectPath, file);
-      await spawnAsync('git', ['add', file], { cwd: projectPath });
+      await spawnAsync('git', ['add', '--', repositoryRelativeFilePath], { cwd: repositoryRootPath });
     }
 
     // Commit with message
-    const { stdout } = await spawnAsync('git', ['commit', '-m', message], { cwd: projectPath });
+    const { stdout } = await spawnAsync('git', ['commit', '-m', message], { cwd: repositoryRootPath });
     
     res.json({ success: true, output: stdout });
   } catch (error) {
@@ -447,6 +588,53 @@ router.post('/commit', async (req, res) => {
   }
 });
 
+// Revert latest local commit (keeps changes staged)
+router.post('/revert-local-commit', async (req, res) => {
+  const { project } = req.body;
+
+  if (!project) {
+    return res.status(400).json({ error: 'Project name is required' });
+  }
+
+  try {
+    const projectPath = await getActualProjectPath(project);
+    await validateGitRepository(projectPath);
+
+    try {
+      await spawnAsync('git', ['rev-parse', '--verify', 'HEAD'], { cwd: projectPath });
+    } catch (error) {
+      return res.status(400).json({
+        error: 'No local commit to revert',
+        details: 'This repository has no commit yet.',
+      });
+    }
+
+    try {
+      // Soft reset rewinds one commit while preserving all file changes in the index.
+      await spawnAsync('git', ['reset', '--soft', 'HEAD~1'], { cwd: projectPath });
+    } catch (error) {
+      const errorDetails = `${error.stderr || ''} ${error.message || ''}`;
+      const isInitialCommit = errorDetails.includes('HEAD~1') &&
+        (errorDetails.includes('unknown revision') || errorDetails.includes('ambiguous argument'));
+
+      if (!isInitialCommit) {
+        throw error;
+      }
+
+      // Initial commit has no parent; deleting HEAD uncommits it and keeps files staged.
+      await spawnAsync('git', ['update-ref', '-d', 'HEAD'], { cwd: projectPath });
+    }
+
+    res.json({
+      success: true,
+      output: 'Latest local commit reverted successfully. Changes were kept staged.',
+    });
+  } catch (error) {
+    console.error('Git revert local commit error:', error);
+    res.status(500).json({ error: error.message });
+  }
+});
+
 // Get list of branches
 router.get('/branches', async (req, res) => {
   const { project } = req.query;
@@ -610,7 +798,12 @@ router.get('/commit-diff', async (req, res) => {
       { cwd: projectPath }
     );
 
-    res.json({ diff: stdout });
+    const isTruncated = stdout.length > COMMIT_DIFF_CHARACTER_LIMIT;
+    const diff = isTruncated
+      ? `${stdout.slice(0, COMMIT_DIFF_CHARACTER_LIMIT)}\n\n... Diff truncated to keep the UI responsive ...`
+      : stdout;
+
+    res.json({ diff, isTruncated });
   } catch (error) {
     console.error('Git commit diff error:', error);
     res.json({ error: error.message });
@@ -632,18 +825,20 @@ router.post('/generate-commit-message', async (req, res) => {
 
   try {
     const projectPath = await getActualProjectPath(project);
+    await validateGitRepository(projectPath);
+    const repositoryRootPath = await getRepositoryRootPath(projectPath);
 
     // Get diff for selected files
     let diffContext = '';
     for (const file of files) {
       try {
-        validateFilePath(file, projectPath);
+        const { repositoryRelativeFilePath } = await resolveRepositoryFilePath(projectPath, file);
         const { stdout } = await spawnAsync(
-          'git', ['diff', 'HEAD', '--', file],
+          'git', ['diff', 'HEAD', '--', repositoryRelativeFilePath],
-          { cwd: projectPath }
+          { cwd: repositoryRootPath }
         );
         if (stdout) {
-          diffContext += `\n--- ${file} ---\n${stdout}`;
+          diffContext += `\n--- ${repositoryRelativeFilePath} ---\n${stdout}`;
         }
       } catch (error) {
         console.error(`Error getting diff for ${file}:`, error);
@@ -655,14 +850,15 @@ router.post('/generate-commit-message', async (req, res) => {
       // Try to get content of untracked files
       for (const file of files) {
         try {
-          const filePath = path.join(projectPath, file);
+          const { repositoryRelativeFilePath } = await resolveRepositoryFilePath(projectPath, file);
+          const filePath = path.join(repositoryRootPath, repositoryRelativeFilePath);
           const stats = await fs.stat(filePath);
 
           if (!stats.isDirectory()) {
             const content = await fs.readFile(filePath, 'utf-8');
-            diffContext += `\n--- ${file} (new file) ---\n${content.substring(0, 1000)}\n`;
+            diffContext += `\n--- ${repositoryRelativeFilePath} (new file) ---\n${content.substring(0, 1000)}\n`;
           } else {
-            diffContext += `\n--- ${file} (new directory) ---\n`;
+            diffContext += `\n--- ${repositoryRelativeFilePath} (new directory) ---\n`;
           }
         } catch (error) {
           console.error(`Error reading file ${file}:`, error);
@@ -831,9 +1027,30 @@ router.get('/remote-status', async (req, res) => {
     const projectPath = await getActualProjectPath(project);
     await validateGitRepository(projectPath);
 
-    // Get current branch
+    const branch = await getCurrentBranchName(projectPath);
-    const { stdout: currentBranch } = await spawnAsync('git', ['rev-parse', '--abbrev-ref', 'HEAD'], { cwd: projectPath });
+    const hasCommits = await repositoryHasCommits(projectPath);
-    const branch = currentBranch.trim();
+
+    const { stdout: remoteOutput } = await spawnAsync('git', ['remote'], { cwd: projectPath });
+    const remotes = remoteOutput.trim().split('\n').filter(r => r.trim());
+    const hasRemote = remotes.length > 0;
+    const fallbackRemoteName = hasRemote
+      ? (remotes.includes('origin') ? 'origin' : remotes[0])
+      : null;
+
+    // Repositories initialized with `git init` can have a branch but no commits.
+    // Return a non-error state so the UI can show the initial-commit workflow.
+    if (!hasCommits) {
+      return res.json({
+        hasRemote,
+        hasUpstream: false,
+        branch,
+        remoteName: fallbackRemoteName,
+        ahead: 0,
+        behind: 0,
+        isUpToDate: false,
+        message: 'Repository has no commits yet'
+      });
+    }
 
     // Check if there's a remote tracking branch (smart detection)
     let trackingBranch;
@@ -843,25 +1060,11 @@ router.get('/remote-status', async (req, res) => {
       trackingBranch = stdout.trim();
       remoteName = trackingBranch.split('/')[0]; // Extract remote name (e.g., "origin/main" -> "origin")
     } catch (error) {
-      // No upstream branch configured - but check if we have remotes
-      let hasRemote = false;
-      let remoteName = null;
-      try {
-        const { stdout } = await spawnAsync('git', ['remote'], { cwd: projectPath });
-        const remotes = stdout.trim().split('\n').filter(r => r.trim());
-        if (remotes.length > 0) {
-          hasRemote = true;
-          remoteName = remotes.includes('origin') ? 'origin' : remotes[0];
-        }
-      } catch (remoteError) {
-        // No remotes configured
-      }
-
       return res.json({
         hasRemote,
         hasUpstream: false,
         branch,
-        remoteName,
+        remoteName: fallbackRemoteName,
         message: 'No remote tracking branch configured'
       });
     }
@@ -903,8 +1106,7 @@ router.post('/fetch', async (req, res) => {
     await validateGitRepository(projectPath);
 
     // Get current branch and its upstream remote
-    const { stdout: currentBranch } = await spawnAsync('git', ['rev-parse', '--abbrev-ref', 'HEAD'], { cwd: projectPath });
+    const branch = await getCurrentBranchName(projectPath);
-    const branch = currentBranch.trim();
 
     let remoteName = 'origin'; // fallback
     try {
@@ -945,8 +1147,7 @@ router.post('/pull', async (req, res) => {
     await validateGitRepository(projectPath);
 
     // Get current branch and its upstream remote
-    const { stdout: currentBranch } = await spawnAsync('git', ['rev-parse', '--abbrev-ref', 'HEAD'], { cwd: projectPath });
+    const branch = await getCurrentBranchName(projectPath);
-    const branch = currentBranch.trim();
 
     let remoteName = 'origin'; // fallback
     let remoteBranch = branch; // fallback
@@ -1014,8 +1215,7 @@ router.post('/push', async (req, res) => {
     await validateGitRepository(projectPath);
 
     // Get current branch and its upstream remote
-    const { stdout: currentBranch } = await spawnAsync('git', ['rev-parse', '--abbrev-ref', 'HEAD'], { cwd: projectPath });
+    const branch = await getCurrentBranchName(projectPath);
-    const branch = currentBranch.trim();
 
     let remoteName = 'origin'; // fallback
     let remoteBranch = branch; // fallback
@@ -1089,8 +1289,7 @@ router.post('/publish', async (req, res) => {
     validateBranchName(branch);
 
     // Get current branch to verify it matches the requested branch
-    const { stdout: currentBranch } = await spawnAsync('git', ['rev-parse', '--abbrev-ref', 'HEAD'], { cwd: projectPath });
+    const currentBranchName = await getCurrentBranchName(projectPath);
-    const currentBranchName = currentBranch.trim();
 
     if (currentBranchName !== branch) {
       return res.status(400).json({
@@ -1164,12 +1363,17 @@ router.post('/discard', async (req, res) => {
   try {
     const projectPath = await getActualProjectPath(project);
     await validateGitRepository(projectPath);
-
+    const {
-    // Validate file path
+      repositoryRootPath,
-    validateFilePath(file, projectPath);
+      repositoryRelativeFilePath,
+    } = await resolveRepositoryFilePath(projectPath, file);
 
     // Check file status to determine correct discard command
-    const { stdout: statusOutput } = await spawnAsync('git', ['status', '--porcelain', file], { cwd: projectPath });
+    const { stdout: statusOutput } = await spawnAsync(
+      'git',
+      ['status', '--porcelain', '--', repositoryRelativeFilePath],
+      { cwd: repositoryRootPath },
+    );
 
     if (!statusOutput.trim()) {
       return res.status(400).json({ error: 'No changes to discard for this file' });
@@ -1179,7 +1383,7 @@ router.post('/discard', async (req, res) => {
 
     if (status === '??') {
       // Untracked file or directory - delete it
-      const filePath = path.join(projectPath, file);
+      const filePath = path.join(repositoryRootPath, repositoryRelativeFilePath);
       const stats = await fs.stat(filePath);
 
       if (stats.isDirectory()) {
@@ -1189,13 +1393,13 @@ router.post('/discard', async (req, res) => {
       }
     } else if (status.includes('M') || status.includes('D')) {
       // Modified or deleted file - restore from HEAD
-      await spawnAsync('git', ['restore', file], { cwd: projectPath });
+      await spawnAsync('git', ['restore', '--', repositoryRelativeFilePath], { cwd: repositoryRootPath });
     } else if (status.includes('A')) {
       // Added file - unstage it
-      await spawnAsync('git', ['reset', 'HEAD', file], { cwd: projectPath });
+      await spawnAsync('git', ['reset', 'HEAD', '--', repositoryRelativeFilePath], { cwd: repositoryRootPath });
     }
     
-    res.json({ success: true, message: `Changes discarded for ${file}` });
+    res.json({ success: true, message: `Changes discarded for ${repositoryRelativeFilePath}` });
   } catch (error) {
     console.error('Git discard error:', error);
     res.status(500).json({ error: error.message });
@@ -1213,12 +1417,17 @@ router.post('/delete-untracked', async (req, res) => {
   try {
     const projectPath = await getActualProjectPath(project);
     await validateGitRepository(projectPath);
-
+    const {
-    // Validate file path
+      repositoryRootPath,
-    validateFilePath(file, projectPath);
+      repositoryRelativeFilePath,
+    } = await resolveRepositoryFilePath(projectPath, file);
 
     // Check if file is actually untracked
-    const { stdout: statusOutput } = await spawnAsync('git', ['status', '--porcelain', file], { cwd: projectPath });
+    const { stdout: statusOutput } = await spawnAsync(
+      'git',
+      ['status', '--porcelain', '--', repositoryRelativeFilePath],
+      { cwd: repositoryRootPath },
+    );
     
     if (!statusOutput.trim()) {
       return res.status(400).json({ error: 'File is not untracked or does not exist' });
@@ -1231,16 +1440,16 @@ router.post('/delete-untracked', async (req, res) => {
     }
 
     // Delete the untracked file or directory
-    const filePath = path.join(projectPath, file);
+    const filePath = path.join(repositoryRootPath, repositoryRelativeFilePath);
     const stats = await fs.stat(filePath);
 
     if (stats.isDirectory()) {
       // Use rm with recursive option for directories
       await fs.rm(filePath, { recursive: true, force: true });
-      res.json({ success: true, message: `Untracked directory ${file} deleted successfully` });
+      res.json({ success: true, message: `Untracked directory ${repositoryRelativeFilePath} deleted successfully` });
     } else {
       await fs.unlink(filePath);
-      res.json({ success: true, message: `Untracked file ${file} deleted successfully` });
+      res.json({ success: true, message: `Untracked file ${repositoryRelativeFilePath} deleted successfully` });
     }
   } catch (error) {
     console.error('Git delete untracked error:', error);

server/routes/taskmaster.js

@@ -529,7 +529,7 @@ router.get('/next/:projectName', async (req, res) => {
             
             // Fallback to loading tasks and finding next one locally
             // Use localhost to bypass proxy for internal server-to-server calls
-            const tasksResponse = await fetch(`http://localhost:${process.env.PORT || 3001}/api/taskmaster/tasks/${encodeURIComponent(projectName)}`, {
+            const tasksResponse = await fetch(`http://localhost:${process.env.SERVER_PORT || 3001}/api/taskmaster/tasks/${encodeURIComponent(projectName)}`, {
                 headers: {
                     'Authorization': req.headers.authorization
                 }

shared/networkHosts.js

@@ -0,0 +1,22 @@
+export function isWildcardHost(host) {
+  return host === '0.0.0.0' || host === '::';
+}
+
+export function isLoopbackHost(host) {
+  return host === 'localhost' || host === '127.0.0.1' || host === '::1' || host === '[::1]';
+}
+
+export function normalizeLoopbackHost(host) {
+  if (!host) {
+    return host;
+  }
+  return isLoopbackHost(host) ? 'localhost' : host;
+}
+
+// Use localhost for connectable loopback and wildcard addresses in browser-facing URLs.
+export function getConnectableHost(host) {
+  if (!host) {
+    return 'localhost';
+  }
+  return isWildcardHost(host) || isLoopbackHost(host) ? 'localhost' : host;
+}

src/components/app/AppContent.tsx

@@ -40,7 +40,7 @@ export default function AppContent() {
     setIsInputFocused,
     setShowSettings,
     openSettings,
-    fetchProjects,
+    refreshProjectsSilently,
     sidebarSharedProps,
   } = useProjectsState({
     sessionId,
@@ -51,14 +51,16 @@ export default function AppContent() {
   });
 
   useEffect(() => {
-    window.refreshProjects = fetchProjects;
+    // Expose a non-blocking refresh for chat/session flows.
+    // Full loading refreshes are still available through direct fetchProjects calls.
+    window.refreshProjects = refreshProjectsSilently;
 
     return () => {
-      if (window.refreshProjects === fetchProjects) {
+      if (window.refreshProjects === refreshProjectsSilently) {
         delete window.refreshProjects;
       }
     };
-  }, [fetchProjects]);
+  }, [refreshProjectsSilently]);
 
   useEffect(() => {
     window.openSettings = openSettings;

src/components/app/MobileNav.tsx

@@ -1,4 +1,5 @@
 import { useState, useRef, useEffect, type Dispatch, type SetStateAction } from 'react';
+import { useTranslation } from 'react-i18next';
 import {
   MessageSquare,
   Folder,
@@ -37,6 +38,7 @@ type MobileNavProps = {
 };
 
 export default function MobileNav({ activeTab, setActiveTab, isInputFocused }: MobileNavProps) {
+  const { t } = useTranslation(['common', 'settings']);
   const { tasksEnabled, isTaskMasterInstalled } = useTasksSettings();
   const shouldShowTasksTab = Boolean(tasksEnabled && isTaskMasterInstalled);
   const { plugins } = usePlugins();
@@ -126,8 +128,7 @@ export default function MobileNav({ activeTab, setActiveTab, isInputFocused }: M
                   e.preventDefault();
                   setMoreOpen((v) => !v);
                 }}
-                className={`relative flex w-full touch-manipulation flex-col items-center justify-center gap-0.5 rounded-xl px-3 py-2 transition-all duration-200 active:scale-95 ${
+                className={`relative flex w-full touch-manipulation flex-col items-center justify-center gap-0.5 rounded-xl px-3 py-2 transition-all duration-200 active:scale-95 ${isPluginActive || moreOpen
-                  isPluginActive || moreOpen
                     ? 'text-primary'
                     : 'text-muted-foreground hover:text-foreground'
                   }`}
@@ -142,7 +143,7 @@ export default function MobileNav({ activeTab, setActiveTab, isInputFocused }: M
                   strokeWidth={isPluginActive ? 2.4 : 1.8}
                 />
                 <span className={`relative z-10 text-[10px] font-medium transition-all duration-200 ${isPluginActive || moreOpen ? 'opacity-100' : 'opacity-60'}`}>
-                  More
+                  {t('settings:pluginSettings.morePlugins')}
                 </span>
               </button>
 
@@ -157,8 +158,7 @@ export default function MobileNav({ activeTab, setActiveTab, isInputFocused }: M
                       <button
                         key={p.name}
                         onClick={() => selectPlugin(p.name)}
-                        className={`flex w-full items-center gap-2.5 px-3.5 py-2.5 text-sm transition-colors ${
+                        className={`flex w-full items-center gap-2.5 px-3.5 py-2.5 text-sm transition-colors ${isActive
-                          isActive
                             ? 'bg-primary/8 text-primary'
                             : 'text-foreground hover:bg-muted/60'
                           }`}

src/components/chat/hooks/useChatRealtimeHandlers.ts

@@ -48,6 +48,7 @@ interface UseChatRealtimeHandlersArgs {
   onSessionNotProcessing?: (sessionId?: string | null) => void;
   onReplaceTemporarySession?: (sessionId?: string | null) => void;
   onNavigateToSession?: (sessionId: string) => void;
+  onWebSocketReconnect?: () => void;
 }
 
 const appendStreamingChunk = (
@@ -113,6 +114,7 @@ export function useChatRealtimeHandlers({
   onSessionNotProcessing,
   onReplaceTemporarySession,
   onNavigateToSession,
+  onWebSocketReconnect,
 }: UseChatRealtimeHandlersArgs) {
   const lastProcessedMessageRef = useRef<LatestChatMessage | null>(null);
 
@@ -136,7 +138,7 @@ export function useChatRealtimeHandlers({
         : null;
     const messageType = String(latestMessage.type);
 
-    const globalMessageTypes = ['projects_updated', 'taskmaster-project-updated', 'session-created'];
+    const globalMessageTypes = ['projects_updated', 'taskmaster-project-updated', 'session-created', 'websocket-reconnected'];
     const isGlobalMessage = globalMessageTypes.includes(messageType);
     const lifecycleMessageTypes = new Set([
       'claude-complete',
@@ -300,6 +302,11 @@ export function useChatRealtimeHandlers({
         }
         break;
 
+      case 'websocket-reconnected':
+        // WebSocket dropped and reconnected — re-fetch session history to catch up on missed messages
+        onWebSocketReconnect?.();
+        break;
+
       case 'token-budget':
         if (latestMessage.data) {
           setTokenBudget(latestMessage.data);
@@ -692,14 +699,28 @@ export function useChatRealtimeHandlers({
             const updated = [...previous];
             const lastIndex = updated.length - 1;
             const last = updated[lastIndex];
+            const normalizedTextResult = textResult.trim();
+
             if (last && last.type === 'assistant' && !last.isToolUse && last.isStreaming) {
               const finalContent =
-                textResult && textResult.trim()
+                normalizedTextResult
                   ? textResult
                   : `${last.content || ''}${pendingChunk || ''}`;
               // Clone the message instead of mutating in place so React can reliably detect state updates.
               updated[lastIndex] = { ...last, content: finalContent, isStreaming: false };
-            } else if (textResult && textResult.trim()) {
+            } else if (normalizedTextResult) {
+              const lastAssistantText =
+                last && last.type === 'assistant' && !last.isToolUse
+                  ? String(last.content || '').trim()
+                  : '';
+
+              // Cursor can emit the same final text through both streaming and result payloads.
+              // Skip adding a second assistant bubble when the final text is unchanged.
+              const isDuplicateFinalText = lastAssistantText === normalizedTextResult;
+              if (isDuplicateFinalText) {
+                return updated;
+              }
+
               updated.push({
                 type: resultData.is_error ? 'error' : 'assistant',
                 content: textResult,

src/components/chat/utils/messageTransforms.ts

@@ -34,6 +34,48 @@ const normalizeToolInput = (value: unknown): string => {
   }
 };
 
+const CURSOR_INTERNAL_USER_BLOCK_PATTERNS = [
+  /<user_info>[\s\S]*?<\/user_info>/gi,
+  /<agent_skills>[\s\S]*?<\/agent_skills>/gi,
+  /<available_skills>[\s\S]*?<\/available_skills>/gi,
+  /<environment_context>[\s\S]*?<\/environment_context>/gi,
+  /<environment_info>[\s\S]*?<\/environment_info>/gi,
+];
+
+const extractCursorUserQuery = (rawText: string): string => {
+  const userQueryMatches = [...rawText.matchAll(/<user_query>([\s\S]*?)<\/user_query>/gi)];
+  if (userQueryMatches.length === 0) {
+    return '';
+  }
+
+  return userQueryMatches
+    .map((match) => (match[1] || '').trim())
+    .filter(Boolean)
+    .join('\n')
+    .trim();
+};
+
+const sanitizeCursorUserMessageText = (rawText: string): string => {
+  const decodedText = decodeHtmlEntities(rawText || '').trim();
+  if (!decodedText) {
+    return '';
+  }
+
+  // Cursor stores user-visible text inside <user_query> and prepends hidden context blocks
+  // (<user_info>, <agent_skills>, etc). We only render the actual query in chat history.
+  const extractedUserQuery = extractCursorUserQuery(decodedText);
+  if (extractedUserQuery) {
+    return extractedUserQuery;
+  }
+
+  let sanitizedText = decodedText;
+  CURSOR_INTERNAL_USER_BLOCK_PATTERNS.forEach((pattern) => {
+    sanitizedText = sanitizedText.replace(pattern, '');
+  });
+
+  return sanitizedText.trim();
+};
+
 const toAbsolutePath = (projectPath: string, filePath?: string) => {
   if (!filePath) {
     return filePath;
@@ -321,6 +363,10 @@ export const convertCursorSessionMessages = (blobs: CursorBlob[], projectPath: s
       console.log('Error parsing blob content:', error);
     }
 
+    if (role === 'user') {
+      text = sanitizeCursorUserMessageText(text);
+    }
+
     if (text && text.trim()) {
       const message: ChatMessage = {
         type: role,

src/components/chat/view/ChatInterface.tsx

@@ -109,6 +109,7 @@ function ChatInterface({
     scrollToBottom,
     scrollToBottomAndReset,
     handleScroll,
+    loadSessionMessages,
   } = useChatSessionState({
     selectedProject,
     selectedSession,
@@ -197,6 +198,23 @@ function ChatInterface({
     setPendingPermissionRequests,
   });
 
+  // On WebSocket reconnect, re-fetch the current session's messages from JSONL so missed
+  // streaming events (e.g. from long tool calls while iOS had the tab backgrounded) are shown.
+  // Also reset isLoading — if the server restarted or the session died mid-stream, the client
+  // would be stuck in "Processing..." forever without this reset.
+  const handleWebSocketReconnect = useCallback(async () => {
+    if (!selectedProject || !selectedSession) return;
+    const provider = (localStorage.getItem('selected-provider') as any) || 'claude';
+    const messages = await loadSessionMessages(selectedProject.name, selectedSession.id, false, provider);
+    if (messages && messages.length > 0) {
+      setChatMessages(messages);
+    }
+    // Reset loading state — if the session is still active, new WebSocket messages will
+    // set it back to true. If it died, this clears the permanent frozen state.
+    setIsLoading(false);
+    setCanAbortSession(false);
+  }, [selectedProject, selectedSession, loadSessionMessages, setChatMessages, setIsLoading, setCanAbortSession]);
+
   useChatRealtimeHandlers({
     latestMessage,
     provider,
@@ -219,6 +237,7 @@ function ChatInterface({
     onSessionNotProcessing,
     onReplaceTemporarySession,
     onNavigateToSession,
+    onWebSocketReconnect: handleWebSocketReconnect,
   });
 
   useEffect(() => {

src/components/chat/view/subcomponents/ChatComposer.tsx

@@ -301,8 +301,7 @@ export default function ChatComposer({
               onBlur={() => onInputFocusChange?.(false)}
               onInput={onTextareaInput}
               placeholder={placeholder}
-              disabled={isLoading}
+              className="chat-input-placeholder block max-h-[40vh] min-h-[50px] w-full resize-none overflow-y-auto rounded-2xl bg-transparent py-1.5 pl-12 pr-20 text-base leading-6 text-foreground placeholder-muted-foreground/50 transition-all duration-200 focus:outline-none sm:max-h-[300px] sm:min-h-[80px] sm:py-4 sm:pr-40"
-              className="chat-input-placeholder block max-h-[40vh] min-h-[50px] w-full resize-none overflow-y-auto rounded-2xl bg-transparent py-1.5 pl-12 pr-20 text-base leading-6 text-foreground placeholder-muted-foreground/50 transition-all duration-200 focus:outline-none disabled:opacity-50 sm:max-h-[300px] sm:min-h-[80px] sm:py-4 sm:pr-40"
               style={{ height: '50px' }}
             />
 

src/components/git-panel/constants/constants.ts

@@ -31,6 +31,7 @@ export const CONFIRMATION_TITLES: Record<ConfirmActionType, string> = {
   pull: 'Confirm Pull',
   push: 'Confirm Push',
   publish: 'Publish Branch',
+  revertLocalCommit: 'Revert Local Commit',
 };
 
 export const CONFIRMATION_ACTION_LABELS: Record<ConfirmActionType, string> = {
@@ -40,6 +41,7 @@ export const CONFIRMATION_ACTION_LABELS: Record<ConfirmActionType, string> = {
   pull: 'Pull',
   push: 'Push',
   publish: 'Publish',
+  revertLocalCommit: 'Revert Commit',
 };
 
 export const CONFIRMATION_BUTTON_CLASSES: Record<ConfirmActionType, string> = {
@@ -49,6 +51,7 @@ export const CONFIRMATION_BUTTON_CLASSES: Record<ConfirmActionType, string> = {
   pull: 'bg-green-600 hover:bg-green-700',
   push: 'bg-orange-600 hover:bg-orange-700',
   publish: 'bg-purple-600 hover:bg-purple-700',
+  revertLocalCommit: 'bg-yellow-600 hover:bg-yellow-700',
 };
 
 export const CONFIRMATION_ICON_CONTAINER_CLASSES: Record<ConfirmActionType, string> = {
@@ -58,6 +61,7 @@ export const CONFIRMATION_ICON_CONTAINER_CLASSES: Record<ConfirmActionType, stri
   pull: 'bg-yellow-100 dark:bg-yellow-900/30',
   push: 'bg-yellow-100 dark:bg-yellow-900/30',
   publish: 'bg-yellow-100 dark:bg-yellow-900/30',
+  revertLocalCommit: 'bg-yellow-100 dark:bg-yellow-900/30',
 };
 
 export const CONFIRMATION_ICON_CLASSES: Record<ConfirmActionType, string> = {
@@ -67,4 +71,5 @@ export const CONFIRMATION_ICON_CLASSES: Record<ConfirmActionType, string> = {
   pull: 'text-yellow-600 dark:text-yellow-400',
   push: 'text-yellow-600 dark:text-yellow-400',
   publish: 'text-yellow-600 dark:text-yellow-400',
+  revertLocalCommit: 'text-yellow-600 dark:text-yellow-400',
 };

src/components/git-panel/hooks/useRevertLocalCommit.ts

@@ -0,0 +1,48 @@
+import { useCallback, useState } from 'react';
+import { authenticatedFetch } from '../../../utils/api';
+import type { GitOperationResponse } from '../types/types';
+
+type UseRevertLocalCommitOptions = {
+  projectName: string | null;
+  onSuccess?: () => void;
+};
+
+async function readJson<T>(response: Response): Promise<T> {
+  return (await response.json()) as T;
+}
+
+export function useRevertLocalCommit({ projectName, onSuccess }: UseRevertLocalCommitOptions) {
+  const [isRevertingLocalCommit, setIsRevertingLocalCommit] = useState(false);
+
+  const revertLatestLocalCommit = useCallback(async () => {
+    if (!projectName) {
+      return;
+    }
+
+    setIsRevertingLocalCommit(true);
+    try {
+      const response = await authenticatedFetch('/api/git/revert-local-commit', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ project: projectName }),
+      });
+      const data = await readJson<GitOperationResponse>(response);
+
+      if (!data.success) {
+        console.error('Revert local commit failed:', data.error || data.details || 'Unknown error');
+        return;
+      }
+
+      onSuccess?.();
+    } catch (error) {
+      console.error('Error reverting local commit:', error);
+    } finally {
+      setIsRevertingLocalCommit(false);
+    }
+  }, [onSuccess, projectName]);
+
+  return {
+    isRevertingLocalCommit,
+    revertLatestLocalCommit,
+  };
+}

src/components/git-panel/types/types.ts

@@ -3,7 +3,7 @@ import type { Project } from '../../../types/app';
 export type GitPanelView = 'changes' | 'history';
 export type FileStatusCode = 'M' | 'A' | 'D' | 'U';
 export type GitStatusFileGroup = 'modified' | 'added' | 'deleted' | 'untracked';
-export type ConfirmActionType = 'discard' | 'delete' | 'commit' | 'pull' | 'push' | 'publish';
+export type ConfirmActionType = 'discard' | 'delete' | 'commit' | 'pull' | 'push' | 'publish' | 'revertLocalCommit';
 
 export type FileDiffInfo = {
   old_string: string;

src/components/git-panel/view/GitPanel.tsx

@@ -1,5 +1,6 @@
 import { useCallback, useState } from 'react';
 import { useGitPanelController } from '../hooks/useGitPanelController';
+import { useRevertLocalCommit } from '../hooks/useRevertLocalCommit';
 import type { ConfirmationRequest, GitPanelProps, GitPanelView } from '../types/types';
 import ChangesView from '../view/changes/ChangesView';
 import HistoryView from '../view/history/HistoryView';
@@ -49,6 +50,11 @@ export default function GitPanel({ selectedProject, isMobile = false, onFileOpen
     onFileOpen,
   });
 
+  const { isRevertingLocalCommit, revertLatestLocalCommit } = useRevertLocalCommit({
+    projectName: selectedProject?.name ?? null,
+    onSuccess: refreshAll,
+  });
+
   const executeConfirmedAction = useCallback(async () => {
     if (!confirmAction) {
       return;
@@ -85,7 +91,9 @@ export default function GitPanel({ selectedProject, isMobile = false, onFileOpen
         isPulling={isPulling}
         isPushing={isPushing}
         isPublishing={isPublishing}
+        isRevertingLocalCommit={isRevertingLocalCommit}
         onRefresh={refreshAll}
+        onRevertLocalCommit={revertLatestLocalCommit}
         onSwitchBranch={switchBranch}
         onCreateBranch={createBranch}
         onFetch={handleFetch}

src/components/git-panel/view/GitPanelHeader.tsx

@@ -1,4 +1,4 @@
-import { Check, ChevronDown, Download, GitBranch, Plus, RefreshCw, Upload } from 'lucide-react';
+import { Check, ChevronDown, Download, GitBranch, Plus, RefreshCw, RotateCcw, Upload } from 'lucide-react';
 import { useEffect, useRef, useState } from 'react';
 import type { ConfirmationRequest, GitRemoteStatus } from '../types/types';
 import NewBranchModal from './modals/NewBranchModal';
@@ -14,7 +14,9 @@ type GitPanelHeaderProps = {
   isPulling: boolean;
   isPushing: boolean;
   isPublishing: boolean;
+  isRevertingLocalCommit: boolean;
   onRefresh: () => void;
+  onRevertLocalCommit: () => Promise<void>;
   onSwitchBranch: (branchName: string) => Promise<boolean>;
   onCreateBranch: (branchName: string) => Promise<boolean>;
   onFetch: () => Promise<void>;
@@ -35,7 +37,9 @@ export default function GitPanelHeader({
   isPulling,
   isPushing,
   isPublishing,
+  isRevertingLocalCommit,
   onRefresh,
+  onRevertLocalCommit,
   onSwitchBranch,
   onCreateBranch,
   onFetch,
@@ -88,6 +92,14 @@ export default function GitPanelHeader({
     });
   };
 
+  const requestRevertLocalCommitConfirmation = () => {
+    onRequestConfirmation({
+      type: 'revertLocalCommit',
+      message: 'Revert the latest local commit? This removes the commit but keeps its changes staged.',
+      onConfirm: onRevertLocalCommit,
+    });
+  };
+
   const handleSwitchBranch = async (branchName: string) => {
     try {
       const success = await onSwitchBranch(branchName);
@@ -240,6 +252,17 @@ export default function GitPanelHeader({
             </>
           )}
 
+          <button
+            onClick={requestRevertLocalCommitConfirmation}
+            disabled={isRevertingLocalCommit}
+            className={`rounded-lg transition-colors hover:bg-accent disabled:opacity-50 ${isMobile ? 'p-1' : 'p-1.5'}`}
+            title="Revert latest local commit"
+          >
+            <RotateCcw
+              className={`text-muted-foreground ${isRevertingLocalCommit ? 'animate-pulse' : ''} ${isMobile ? 'h-3 w-3' : 'h-4 w-4'}`}
+            />
+          </button>
+
           <button
             onClick={onRefresh}
             disabled={isLoading}

src/components/git-panel/view/modals/ConfirmActionModal.tsx

@@ -1,5 +1,5 @@
 import { useEffect } from 'react';
-import { Check, Download, Trash2, Upload } from 'lucide-react';
+import { Check, Download, RotateCcw, Trash2, Upload } from 'lucide-react';
 import {
   CONFIRMATION_ACTION_LABELS,
   CONFIRMATION_BUTTON_CLASSES,
@@ -27,6 +27,10 @@ function renderConfirmActionIcon(actionType: ConfirmationRequest['type']) {
     return <Download className="h-4 w-4" />;
   }
 
+  if (actionType === 'revertLocalCommit') {
+    return <RotateCcw className="h-4 w-4" />;
+  }
+
   return <Upload className="h-4 w-4" />;
 }
 

src/components/git-panel/view/shared/GitDiffViewer.tsx

@@ -1,10 +1,38 @@
+import { useMemo } from 'react';
+
 type GitDiffViewerProps = {
   diff: string | null;
   isMobile: boolean;
   wrapText: boolean;
 };
 
+const PREVIEW_CHARACTER_LIMIT = 200_000;
+const PREVIEW_LINE_LIMIT = 1_500;
+
+type DiffPreview = {
+  lines: string[];
+  isCharacterTruncated: boolean;
+  isLineTruncated: boolean;
+};
+
+function buildDiffPreview(diff: string): DiffPreview {
+  const isCharacterTruncated = diff.length > PREVIEW_CHARACTER_LIMIT;
+  const previewText = isCharacterTruncated ? diff.slice(0, PREVIEW_CHARACTER_LIMIT) : diff;
+  const previewLines = previewText.split('\n');
+  const isLineTruncated = previewLines.length > PREVIEW_LINE_LIMIT;
+
+  return {
+    lines: isLineTruncated ? previewLines.slice(0, PREVIEW_LINE_LIMIT) : previewLines,
+    isCharacterTruncated,
+    isLineTruncated,
+  };
+}
+
 export default function GitDiffViewer({ diff, isMobile, wrapText }: GitDiffViewerProps) {
+  // Render a bounded preview to keep huge commit diffs from freezing the UI thread.
+  const preview = useMemo(() => buildDiffPreview(diff || ''), [diff]);
+  const isPreviewTruncated = preview.isCharacterTruncated || preview.isLineTruncated;
+
   if (!diff) {
     return (
       <div className="p-4 text-center text-sm text-muted-foreground">
@@ -35,7 +63,12 @@ export default function GitDiffViewer({ diff, isMobile, wrapText }: GitDiffViewe
 
   return (
     <div className="diff-viewer">
-      {diff.split('\n').map((line, index) => renderDiffLine(line, index))}
+      {isPreviewTruncated && (
+        <div className="mb-2 rounded-md border border-border bg-card px-3 py-2 text-xs text-muted-foreground">
+          Large diff preview: rendering is limited to keep the tab responsive.
+        </div>
+      )}
+      {preview.lines.map((line, index) => renderDiffLine(line, index))}
     </div>
   );
 }

src/components/main-content/view/MainContent.tsx

@@ -146,7 +146,12 @@ function MainContent({
 
           {activeTab === 'shell' && (
             <div className="h-full w-full overflow-hidden">
-              <StandaloneShell project={selectedProject} session={selectedSession} showHeader={false} />
+              <StandaloneShell
+                project={selectedProject}
+                session={selectedSession}
+                showHeader={false}
+                isActive={activeTab === 'shell'}
+              />
             </div>
           )}
 

src/components/plugins/view/PluginSettingsTab.tsx

@@ -1,4 +1,5 @@
 import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { Trash2, RefreshCw, GitBranch, Loader2, ServerCrash, ShieldAlert, ExternalLink, BookOpen, Download, BarChart3 } from 'lucide-react';
 import { usePlugins } from '../../../contexts/PluginsContext';
 import type { Plugin } from '../../../contexts/PluginsContext';
@@ -32,7 +33,7 @@ function ToggleSwitch({ checked, onChange, ariaLabel }: { checked: boolean; onCh
 }
 
 /* ─── Server Dot ────────────────────────────────────────────────────────── */
-function ServerDot({ running }: { running: boolean }) {
+function ServerDot({ running, t }: { running: boolean; t: any }) {
   if (!running) return null;
   return (
     <span className="relative flex items-center gap-1.5">
@@ -41,7 +42,7 @@ function ServerDot({ running }: { running: boolean }) {
         <span className="relative inline-flex h-1.5 w-1.5 rounded-full bg-emerald-500" />
       </span>
       <span className="font-mono text-[10px] uppercase tracking-wide text-emerald-600 dark:text-emerald-400">
-        running
+        {t('pluginSettings.runningStatus')}
       </span>
     </span>
   );
@@ -71,6 +72,7 @@ function PluginCard({
   onCancelUninstall,
   updateError,
 }: PluginCardProps) {
+  const { t } = useTranslation('settings');
   const accentColor = plugin.enabled
     ? 'bg-emerald-500'
     : 'bg-muted-foreground/20';
@@ -108,7 +110,7 @@ function PluginCard({
                 <span className="rounded bg-muted px-1.5 py-0.5 text-[10px] text-muted-foreground">
                   {plugin.slot}
                 </span>
-                <ServerDot running={!!plugin.serverRunning} />
+                <ServerDot running={!!plugin.serverRunning} t={t} />
               </div>
               {plugin.description && (
                 <p className="mt-1 text-sm leading-snug text-muted-foreground">
@@ -143,8 +145,8 @@ function PluginCard({
             <button
               onClick={onUpdate}
               disabled={updating || !plugin.repoUrl}
-              title={plugin.repoUrl ? 'Pull latest from git' : 'No git remote — update not available'}
+              title={plugin.repoUrl ? t('pluginSettings.pullLatest') : t('pluginSettings.noGitRemote')}
-              aria-label={`Update ${plugin.displayName}`}
+              aria-label={t('pluginSettings.pullLatest')}
               className="rounded p-1.5 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40"
             >
               {updating ? (
@@ -156,10 +158,9 @@ function PluginCard({
 
             <button
               onClick={onUninstall}
-              title={confirmingUninstall ? 'Click again to confirm' : 'Uninstall plugin'}
+              title={confirmingUninstall ? t('pluginSettings.confirmUninstall') : t('pluginSettings.uninstallPlugin')}
-              aria-label={`Uninstall ${plugin.displayName}`}
+              aria-label={t('pluginSettings.uninstallPlugin')}
-              className={`rounded p-1.5 transition-colors ${
+              className={`rounded p-1.5 transition-colors ${confirmingUninstall
-                confirmingUninstall
                 ? 'bg-red-50 text-red-500 hover:bg-red-100 dark:bg-red-900/20 dark:hover:bg-red-900/30'
                 : 'text-muted-foreground hover:bg-muted hover:text-red-500'
                 }`}
@@ -167,7 +168,7 @@ function PluginCard({
               <Trash2 className="h-3.5 w-3.5" />
             </button>
 
-            <ToggleSwitch checked={plugin.enabled} onChange={onToggle} ariaLabel={`${plugin.enabled ? 'Disable' : 'Enable'} ${plugin.displayName}`} />
+            <ToggleSwitch checked={plugin.enabled} onChange={onToggle} ariaLabel={`${plugin.enabled ? t('pluginSettings.disable') : t('pluginSettings.enable')} ${plugin.displayName}`} />
           </div>
         </div>
 
@@ -175,20 +176,20 @@ function PluginCard({
         {confirmingUninstall && (
           <div className="mt-3 flex items-center justify-between gap-3 rounded border border-red-200 bg-red-50 px-3 py-2 dark:border-red-800/50 dark:bg-red-950/30">
             <span className="text-sm text-red-600 dark:text-red-400">
-              Remove <span className="font-semibold">{plugin.displayName}</span>? This cannot be undone.
+              {t('pluginSettings.confirmUninstallMessage', { name: plugin.displayName })}
             </span>
             <div className="flex gap-1.5">
               <button
                 onClick={onCancelUninstall}
                 className="rounded border border-border px-2.5 py-1 text-sm text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
               >
-                Cancel
+                {t('pluginSettings.cancel')}
               </button>
               <button
                 onClick={onUninstall}
                 className="rounded border border-red-300 px-2.5 py-1 text-sm font-medium text-red-600 transition-colors hover:bg-red-100 dark:border-red-700 dark:text-red-400 dark:hover:bg-red-900/30"
               >
-                Remove
+                {t('pluginSettings.remove')}
               </button>
             </div>
           </div>
@@ -208,6 +209,8 @@ function PluginCard({
 
 /* ─── Starter Plugin Card ───────────────────────────────────────────────── */
 function StarterPluginCard({ onInstall, installing }: { onInstall: () => void; installing: boolean }) {
+  const { t } = useTranslation('settings');
+
   return (
     <div className="relative flex overflow-hidden rounded-lg border border-dashed border-border bg-card transition-all duration-200 hover:border-blue-400 dark:hover:border-blue-500">
       <div className="w-[3px] flex-shrink-0 bg-blue-500/30" />
@@ -220,17 +223,17 @@ function StarterPluginCard({ onInstall, installing }: { onInstall: () => void; i
             <div className="min-w-0">
               <div className="flex flex-wrap items-center gap-2">
                 <span className="text-sm font-semibold leading-none text-foreground">
-                  Project Stats
+                  {t('pluginSettings.starterPlugin.name')}
                 </span>
                 <span className="rounded bg-blue-50 px-1.5 py-0.5 text-[10px] font-medium text-blue-600 dark:bg-blue-950/50 dark:text-blue-400">
-                  starter
+                  {t('pluginSettings.starterPlugin.badge')}
                 </span>
                 <span className="rounded bg-muted px-1.5 py-0.5 text-[10px] text-muted-foreground">
-                  tab
+                  {t('pluginSettings.tab')}
                 </span>
               </div>
               <p className="mt-1 text-sm leading-snug text-muted-foreground">
-                File counts, lines of code, file-type breakdown, and recent activity for your project.
+                {t('pluginSettings.starterPlugin.description')}
               </p>
               <a
                 href={STARTER_PLUGIN_URL}
@@ -253,7 +256,7 @@ function StarterPluginCard({ onInstall, installing }: { onInstall: () => void; i
             ) : (
               <Download className="h-3.5 w-3.5" />
             )}
-            {installing ? 'Installing…' : 'Install'}
+            {installing ? t('pluginSettings.installing') : t('pluginSettings.starterPlugin.install')}
           </button>
         </div>
       </div>
@@ -263,6 +266,7 @@ function StarterPluginCard({ onInstall, installing }: { onInstall: () => void; i
 
 /* ─── Main Component ────────────────────────────────────────────────────── */
 export default function PluginSettingsTab() {
+  const { t } = useTranslation('settings');
   const { plugins, loading, installPlugin, uninstallPlugin, updatePlugin, togglePlugin } =
     usePlugins();
 
@@ -279,7 +283,7 @@ export default function PluginSettingsTab() {
     setUpdateErrors((prev) => { const next = { ...prev }; delete next[name]; return next; });
     const result = await updatePlugin(name);
     if (!result.success) {
-      setUpdateErrors((prev) => ({ ...prev, [name]: result.error || 'Update failed' }));
+      setUpdateErrors((prev) => ({ ...prev, [name]: result.error || t('pluginSettings.updateFailed') }));
     }
     setUpdatingPlugins((prev) => { const next = new Set(prev); next.delete(name); return next; });
   };
@@ -292,7 +296,7 @@ export default function PluginSettingsTab() {
     if (result.success) {
       setGitUrl('');
     } else {
-      setInstallError(result.error || 'Installation failed');
+      setInstallError(result.error || t('pluginSettings.installFailed'));
     }
     setInstalling(false);
   };
@@ -302,7 +306,7 @@ export default function PluginSettingsTab() {
     setInstallError(null);
     const result = await installPlugin(STARTER_PLUGIN_URL);
     if (!result.success) {
-      setInstallError(result.error || 'Installation failed');
+      setInstallError(result.error || t('pluginSettings.installFailed'));
     }
     setInstallingStarter(false);
   };
@@ -316,7 +320,7 @@ export default function PluginSettingsTab() {
     if (result.success) {
       setConfirmUninstall(null);
     } else {
-      setInstallError(result.error || 'Uninstall failed');
+      setInstallError(result.error || t('pluginSettings.uninstallFailed'));
       setConfirmUninstall(null);
     }
   };
@@ -328,17 +332,10 @@ export default function PluginSettingsTab() {
       {/* Header */}
       <div>
         <h3 className="mb-1 text-base font-semibold text-foreground">
-          Plugins
+          {t('pluginSettings.title')}
         </h3>
         <p className="text-sm text-muted-foreground">
-          Extend the interface with custom plugins. Install from{' '}
+          {t('pluginSettings.description')}
-          <code className="rounded bg-muted px-1.5 py-0.5 text-xs font-semibold">
-            git
-          </code>{' '}
-          or drop a folder in{' '}
-          <code className="rounded bg-muted px-1.5 py-0.5 text-xs font-semibold">
-            ~/.claude-code-ui/plugins/
-          </code>
         </p>
       </div>
 
@@ -354,8 +351,8 @@ export default function PluginSettingsTab() {
             setGitUrl(e.target.value);
             setInstallError(null);
           }}
-          placeholder="https://github.com/user/my-plugin"
+          placeholder={t('pluginSettings.installPlaceholder')}
-          aria-label="Plugin git repository URL"
+          aria-label={t('pluginSettings.installAriaLabel')}
           className="flex-1 bg-transparent px-2 py-2.5 text-sm text-foreground placeholder:text-muted-foreground/40 focus:outline-none"
           onKeyDown={(e) => {
             if (e.key === 'Enter') void handleInstall();
@@ -369,7 +366,7 @@ export default function PluginSettingsTab() {
           {installing ? (
             <Loader2 className="h-4 w-4 animate-spin" />
           ) : (
-            'Install'
+            t('pluginSettings.installButton')
           )}
         </button>
       </div>
@@ -381,7 +378,7 @@ export default function PluginSettingsTab() {
       <p className="-mt-4 flex items-start gap-1.5 text-xs leading-snug text-muted-foreground/50">
         <ShieldAlert className="mt-px h-3 w-3 flex-shrink-0" />
         <span>
-          Only install plugins whose source code you have reviewed or from authors you trust.
+          {t('pluginSettings.securityWarning')}
         </span>
       </p>
 
@@ -394,18 +391,26 @@ export default function PluginSettingsTab() {
       {loading ? (
         <div className="flex items-center justify-center gap-2 py-10 text-sm text-muted-foreground">
           <Loader2 className="h-4 w-4 animate-spin" />
-          Scanning plugins…
+          {t('pluginSettings.scanningPlugins')}
         </div>
       ) : plugins.length === 0 ? (
-        <p className="py-8 text-center text-sm text-muted-foreground">No plugins installed</p>
+        <p className="py-8 text-center text-sm text-muted-foreground">{t('pluginSettings.noPluginsInstalled')}</p>
       ) : (
         <div className="space-y-2">
-          {plugins.map((plugin, index) => (
+          {plugins.map((plugin, index) => {
+            const handleToggle = async (enabled: boolean) => {
+              const r = await togglePlugin(plugin.name, enabled);
+              if (!r.success) {
+                setInstallError(r.error || t('pluginSettings.toggleFailed'));
+              }
+            };
+
+            return (
               <PluginCard
                 key={plugin.name}
                 plugin={plugin}
                 index={index}
-              onToggle={(enabled) => void togglePlugin(plugin.name, enabled).then(r => { if (!r.success) setInstallError(r.error || 'Toggle failed'); })}
+                onToggle={(enabled) => void handleToggle(enabled)}
                 onUpdate={() => void handleUpdate(plugin.name)}
                 onUninstall={() => void handleUninstall(plugin.name)}
                 updating={updatingPlugins.has(plugin.name)}
@@ -413,7 +418,8 @@ export default function PluginSettingsTab() {
                 onCancelUninstall={() => setConfirmUninstall(null)}
                 updateError={updateErrors[plugin.name] ?? null}
               />
-          ))}
+            );
+          })}
         </div>
       )}
 
@@ -422,7 +428,7 @@ export default function PluginSettingsTab() {
         <div className="flex min-w-0 items-center gap-2">
           <BookOpen className="h-3.5 w-3.5 flex-shrink-0 text-muted-foreground/40" />
           <span className="text-xs text-muted-foreground/60">
-            Build your own plugin
+            {t('pluginSettings.buildYourOwn')}
           </span>
         </div>
         <div className="flex flex-shrink-0 items-center gap-3">
@@ -432,7 +438,7 @@ export default function PluginSettingsTab() {
             rel="noopener noreferrer"
             className="inline-flex items-center gap-1 text-xs text-muted-foreground/60 transition-colors hover:text-foreground"
           >
-            Starter <ExternalLink className="h-2.5 w-2.5" />
+            {t('pluginSettings.starter')} <ExternalLink className="h-2.5 w-2.5" />
           </a>
           <span className="text-muted-foreground/20">·</span>
           <a
@@ -441,7 +447,7 @@ export default function PluginSettingsTab() {
             rel="noopener noreferrer"
             className="inline-flex items-center gap-1 text-xs text-muted-foreground/60 transition-colors hover:text-foreground"
           >
-            Docs <ExternalLink className="h-2.5 w-2.5" />
+            {t('pluginSettings.docs')} <ExternalLink className="h-2.5 w-2.5" />
           </a>
         </div>
       </div>

src/components/shell/hooks/useShellTerminal.ts

@@ -11,6 +11,7 @@ import {
   TERMINAL_OPTIONS,
   TERMINAL_RESIZE_DELAY_MS,
 } from '../constants/constants';
+import { copyTextToClipboard } from '../../../utils/clipboard';
 import { isCodexLoginCommand } from '../utils/auth';
 import { sendSocketMessage } from '../utils/socket';
 import { ensureXtermFocusStyles } from '../utils/terminalStyles';
@@ -103,6 +104,37 @@ export function useShellTerminal({
 
     nextTerminal.open(terminalContainerRef.current);
 
+    const copyTerminalSelection = async () => {
+      const selection = nextTerminal.getSelection();
+      if (!selection) {
+        return false;
+      }
+
+      return copyTextToClipboard(selection);
+    };
+
+    const handleTerminalCopy = (event: ClipboardEvent) => {
+      if (!nextTerminal.hasSelection()) {
+        return;
+      }
+
+      const selection = nextTerminal.getSelection();
+      if (!selection) {
+        return;
+      }
+
+      event.preventDefault();
+
+      if (event.clipboardData) {
+        event.clipboardData.setData('text/plain', selection);
+        return;
+      }
+
+      void copyTextToClipboard(selection);
+    };
+
+    terminalContainerRef.current.addEventListener('copy', handleTerminalCopy);
+
     nextTerminal.attachCustomKeyEventHandler((event) => {
       const activeAuthUrl = isCodexLoginCommand(initialCommandRef.current)
         ? CODEX_DEVICE_AUTH_URL
@@ -132,7 +164,7 @@ export function useShellTerminal({
       ) {
         event.preventDefault();
         event.stopPropagation();
-        document.execCommand('copy');
+        void copyTerminalSelection();
         return false;
       }
 
@@ -211,6 +243,7 @@ export function useShellTerminal({
     resizeObserver.observe(terminalContainerRef.current);
 
     return () => {
+      terminalContainerRef.current?.removeEventListener('copy', handleTerminalCopy);
       resizeObserver.disconnect();
       if (resizeTimeoutRef.current !== null) {
         window.clearTimeout(resizeTimeoutRef.current);

src/components/shell/view/Shell.tsx

@@ -40,7 +40,7 @@ export default function Shell({
   onProcessComplete = null,
   minimal = false,
   autoConnect = false,
-  isActive,
+  isActive = true,
 }: ShellProps) {
   const { t } = useTranslation('chat');
   const [isRestarting, setIsRestarting] = useState(false);
@@ -48,9 +48,6 @@ export default function Shell({
   const promptCheckTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
   const onOutputRef = useRef<(() => void) | null>(null);
 
-  // Keep the public API stable for existing callers that still pass `isActive`.
-  void isActive;
-
   const {
     terminalContainerRef,
     terminalRef,
@@ -157,6 +154,24 @@ export default function Shell({
     }
   }, [isConnected]);
 
+  useEffect(() => {
+    if (!isActive || !isInitialized || !isConnected) {
+      return;
+    }
+
+    const focusTerminal = () => {
+      terminalRef.current?.focus();
+    };
+
+    const animationFrameId = window.requestAnimationFrame(focusTerminal);
+    const timeoutId = window.setTimeout(focusTerminal, 0);
+
+    return () => {
+      window.cancelAnimationFrame(animationFrameId);
+      window.clearTimeout(timeoutId);
+    };
+  }, [isActive, isConnected, isInitialized, terminalRef]);
+
   const sendInput = useCallback(
     (data: string) => {
       sendSocketMessage(wsRef.current, { type: 'input', data });

src/components/standalone-shell/view/StandaloneShell.tsx

@@ -9,6 +9,7 @@ type StandaloneShellProps = {
   session?: ProjectSession | null;
   command?: string | null;
   isPlainShell?: boolean | null;
+  isActive?: boolean;
   autoConnect?: boolean;
   onComplete?: ((exitCode: number) => void) | null;
   onClose?: (() => void) | null;
@@ -24,6 +25,7 @@ export default function StandaloneShell({
   session = null,
   command = null,
   isPlainShell = null,
+  isActive = true,
   autoConnect = true,
   onComplete = null,
   onClose = null,
@@ -64,6 +66,7 @@ export default function StandaloneShell({
           selectedSession={session}
           initialCommand={command}
           isPlainShell={shouldUsePlainShell}
+          isActive={isActive}
           onProcessComplete={handleProcessComplete}
           minimal={minimal}
           autoConnect={minimal ? true : autoConnect}

src/contexts/WebSocketContext.tsx

@@ -29,6 +29,7 @@ const buildWebSocketUrl = (token: string | null) => {
 const useWebSocketProviderState = (): WebSocketContextType => {
   const wsRef = useRef<WebSocket | null>(null);
   const unmountedRef = useRef(false); // Track if component is unmounted
+  const hasConnectedRef = useRef(false); // Track if we've ever connected (to detect reconnects)
   const [latestMessage, setLatestMessage] = useState<any>(null);
   const [isConnected, setIsConnected] = useState(false);
   const reconnectTimeoutRef = useRef<NodeJS.Timeout | null>(null);
@@ -61,6 +62,11 @@ const useWebSocketProviderState = (): WebSocketContextType => {
       websocket.onopen = () => {
         setIsConnected(true);
         wsRef.current = websocket;
+        if (hasConnectedRef.current) {
+          // This is a reconnect — signal so components can catch up on missed messages
+          setLatestMessage({ type: 'websocket-reconnected', timestamp: Date.now() });
+        }
+        hasConnectedRef.current = true;
       };
 
       websocket.onmessage = (event) => {

src/hooks/useProjectsState.ts

@@ -18,6 +18,10 @@ type UseProjectsStateArgs = {
   activeSessions: Set<string>;
 };
 
+type FetchProjectsOptions = {
+  showLoadingState?: boolean;
+};
+
 const serialize = (value: unknown) => JSON.stringify(value ?? null);
 
 const projectsHaveChanges = (
@@ -152,9 +156,11 @@ export function useProjectsState({
 
   const loadingProgressTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
-  const fetchProjects = useCallback(async () => {
+  const fetchProjects = useCallback(async ({ showLoadingState = true }: FetchProjectsOptions = {}) => {
     try {
+      if (showLoadingState) {
         setIsLoadingProjects(true);
+      }
       const response = await api.projects();
       const projectData = (await response.json()) as Project[];
 
@@ -170,10 +176,17 @@ export function useProjectsState({
     } catch (error) {
       console.error('Error fetching projects:', error);
     } finally {
+      if (showLoadingState) {
         setIsLoadingProjects(false);
       }
+    }
   }, []);
 
+  const refreshProjectsSilently = useCallback(async () => {
+    // Keep chat view stable while still syncing sidebar/session metadata in background.
+    await fetchProjects({ showLoadingState: false });
+  }, [fetchProjects]);
+
   const openSettings = useCallback((tab = 'tools') => {
     setSettingsInitialTab(tab);
     setShowSettings(true);
@@ -547,6 +560,7 @@ export function useProjectsState({
     setShowSettings,
     openSettings,
     fetchProjects,
+    refreshProjectsSilently,
     sidebarSharedProps,
     handleProjectSelect,
     handleSessionSelect,

src/i18n/locales/en/settings.json

@@ -434,5 +434,41 @@
       "title": "About Codex MCP",
       "description": "Codex supports stdio-based MCP servers. You can add servers that extend Codex's capabilities with additional tools and resources."
     }
+  },
+  "pluginSettings": {
+    "title": "Plugins",
+    "description": "Extend the interface with custom plugins. Install from git or drop a folder in ~/.claude-code-ui/plugins/",
+    "installPlaceholder": "https://github.com/user/my-plugin",
+    "installButton": "Install",
+    "installing": "Installing…",
+    "securityWarning": "Only install plugins whose source code you have reviewed or from authors you trust.",
+    "scanningPlugins": "Scanning plugins…",
+    "noPluginsInstalled": "No plugins installed",
+    "pullLatest": "Pull latest from git",
+    "noGitRemote": "No git remote — update not available",
+    "uninstallPlugin": "Uninstall plugin",
+    "confirmUninstall": "Click again to confirm",
+    "confirmUninstallMessage": "Remove {{name}}? This cannot be undone.",
+    "cancel": "Cancel",
+    "remove": "Remove",
+    "updateFailed": "Update failed",
+    "installFailed": "Installation failed",
+    "uninstallFailed": "Uninstall failed",
+    "toggleFailed": "Toggle failed",
+    "buildYourOwn": "Build your own plugin",
+    "starter": "Starter",
+    "docs": "Docs",
+    "starterPlugin": {
+      "name": "Project Stats",
+      "badge": "starter",
+      "description": "File counts, lines of code, file-type breakdown, and recent activity for your project.",
+      "install": "Install"
+    },
+    "morePlugins": "More",
+    "enable": "Enable",
+    "disable": "Disable",
+    "installAriaLabel": "Plugin git repository URL",
+    "tab": "tab",
+    "runningStatus": "running"
   }
 }

src/i18n/locales/ja/settings.json

@@ -434,5 +434,41 @@
       "title": "Codex MCPについて",
       "description": "Codexはstdioベースのツールサーバーをサポートしています。追加のツールやリソースでCodexの機能を拡張するサーバーを追加できます。"
     }
+  },
+  "pluginSettings": {
+    "title": "プラグイン",
+    "description": "カスタムプラグインでインターフェースを拡張します。gitからインストールするか、~/.claude-code-ui/plugins/ にフォルダを配置してください。",
+    "installPlaceholder": "https://github.com/user/my-plugin",
+    "installButton": "インストール",
+    "installing": "インストール中…",
+    "securityWarning": "信頼できる作成者のプラグイン、またはソースコードを確認済みのプラグインのみをインストールしてください。",
+    "scanningPlugins": "プラグインをスキャン中…",
+    "noPluginsInstalled": "プラグインがインストールされていません",
+    "pullLatest": "gitから最新を取得",
+    "noGitRemote": "リモートgitリポジトリがありません — アップデート不可",
+    "uninstallPlugin": "プラグインを削除",
+    "confirmUninstall": "クリックして確定",
+    "confirmUninstallMessage": "{{name}} を削除しますか？この操作は取り消せません。",
+    "cancel": "キャンセル",
+    "remove": "削除",
+    "updateFailed": "アップデートに失敗しました",
+    "installFailed": "インストールに失敗しました",
+    "uninstallFailed": "削除に失敗しました",
+    "toggleFailed": "切り替えに失敗しました",
+    "buildYourOwn": "プラグインを自作する",
+    "starter": "スターター",
+    "docs": "ドキュメント",
+    "starterPlugin": {
+      "name": "プロジェクト統計",
+      "badge": "スターター",
+      "description": "プロジェクトのファイル数、コード行数、ファイルタイプの内訳、最近のアクティビティを表示します。",
+      "install": "インストール"
+    },
+    "morePlugins": "詳細",
+    "enable": "有効にする",
+    "disable": "無効にする",
+    "installAriaLabel": "プラグインのgitリポジトリURL",
+    "tab": "タブ",
+    "runningStatus": "実行中"
   }
 }

src/i18n/locales/ko/settings.json

@@ -434,5 +434,41 @@
       "title": "Codex MCP 정보",
       "description": "Codex는 stdio 기반 MCP 서버를 지원합니다. 추가 도구와 리소스로 Codex의 기능을 확장하는 서버를 추가할 수 있습니다."
     }
+  },
+  "pluginSettings": {
+    "title": "플러그인",
+    "description": "커스텀 플러그인으로 인터페이스를 확장하세요. git에서 설치하거나 ~/.claude-code-ui/plugins/ 폴더에 직접 추가할 수 있습니다.",
+    "installPlaceholder": "https://github.com/user/my-plugin",
+    "installButton": "설치",
+    "installing": "설치 중…",
+    "securityWarning": "소스 코드를 검토했거나 신뢰할 수 있는 작성자의 플러그인만 설치하세요.",
+    "scanningPlugins": "플러그인 스캔 중…",
+    "noPluginsInstalled": "설치된 플러그인이 없습니다",
+    "pullLatest": "git에서 최신 버전 가져오기",
+    "noGitRemote": "git 리모트가 없음 — 업데이트 불가",
+    "uninstallPlugin": "플러그인 삭제",
+    "confirmUninstall": "다시 클릭하여 확인",
+    "confirmUninstallMessage": "{{name}} 플러그인을 삭제하시겠습니까? 이 작업은 되돌릴 수 없습니다.",
+    "cancel": "취소",
+    "remove": "삭제",
+    "updateFailed": "업데이트 실패",
+    "installFailed": "설치 실패",
+    "uninstallFailed": "삭제 실패",
+    "toggleFailed": "토글 실패",
+    "buildYourOwn": "나만의 플러그인 만들기",
+    "starter": "스타터",
+    "docs": "문서",
+    "starterPlugin": {
+      "name": "프로젝트 통계",
+      "badge": "스타터",
+      "description": "프로젝트의 파일 수, 코드 라인 수, 파일 유형별 분석 및 최근 활동을 확인합니다.",
+      "install": "설치"
+    },
+    "morePlugins": "더 보기",
+    "enable": "활성화",
+    "disable": "비활성화",
+    "installAriaLabel": "플러그인 git 저장소 URL",
+    "tab": "탭",
+    "runningStatus": "실행 중"
   }
 }

src/i18n/locales/ru/settings.json

@@ -104,7 +104,8 @@
     "appearance": "Внешний вид",
     "git": "Git",
     "apiTokens": "API и токены",
-    "tasks": "Задачи"
+    "tasks": "Задачи",
+    "plugins": "Плагины"
   },
   "appearanceSettings": {
     "darkMode": {
@@ -433,5 +434,41 @@
       "title": "О Codex MCP",
       "description": "Codex поддерживает MCP серверы на основе stdio. Вы можете добавлять серверы, которые расширяют возможности Codex дополнительными инструментами и ресурсами."
     }
+  },
+  "pluginSettings": {
+    "title": "Плагины",
+    "description": "Расширяйте интерфейс с помощью кастомных плагинов. Установите из git или добавьте папку в ~/.claude-code-ui/plugins/",
+    "installPlaceholder": "https://github.com/user/my-plugin",
+    "installButton": "Установить",
+    "installing": "Установка…",
+    "securityWarning": "Устанавливайте только те плагины, исходный код которых вы проверили или от авторов, которым вы доверяете.",
+    "scanningPlugins": "Сканирование плагинов…",
+    "noPluginsInstalled": "Плагины не установлены",
+    "pullLatest": "Получить обновления из git",
+    "noGitRemote": "Нет удаленного git-репозитория — обновление недоступно",
+    "uninstallPlugin": "Удалить плагин",
+    "confirmUninstall": "Нажмите еще раз для подтверждения",
+    "confirmUninstallMessage": "Удалить {{name}}? Это действие нельзя отменить.",
+    "cancel": "Отмена",
+    "remove": "Удалить",
+    "updateFailed": "Ошибка обновления",
+    "installFailed": "Ошибка установки",
+    "uninstallFailed": "Ошибка удаления",
+    "toggleFailed": "Ошибка переключения",
+    "buildYourOwn": "Создайте свой плагин",
+    "starter": "Шаблон",
+    "docs": "Документация",
+    "starterPlugin": {
+      "name": "Статистика проекта",
+      "badge": "шаблон",
+      "description": "Количество файлов, строк кода, разбивка по типам файлов и недавняя активность в вашем проекте.",
+      "install": "Установить"
+    },
+    "morePlugins": "Ещё",
+    "enable": "Включить",
+    "disable": "Выключить",
+    "installAriaLabel": "URL git-репозитория плагина",
+    "tab": "вкладка",
+    "runningStatus": "запущен"
   }
 }

src/i18n/locales/zh-CN/settings.json

@@ -434,5 +434,41 @@
       "title": "关于 Codex MCP",
       "description": "Codex 支持基于 stdio 的 MCP 服务器。您可以添加服务器，通过额外的工具和资源来扩展 Codex 的功能。"
     }
+  },
+  "pluginSettings": {
+    "title": "插件",
+    "description": "通过自定义插件扩展界面。从 git 安装或直接将文件夹放入 ~/.claude-code-ui/plugins/",
+    "installPlaceholder": "https://github.com/user/my-plugin",
+    "installButton": "安装",
+    "installing": "安装中…",
+    "securityWarning": "仅安装您已审查过源代码或信任作者的插件。",
+    "scanningPlugins": "正在扫描插件…",
+    "noPluginsInstalled": "未安装插件",
+    "pullLatest": "从 git 拉取最新内容",
+    "noGitRemote": "无 git 远程仓库 — 无法更新",
+    "uninstallPlugin": "卸载插件",
+    "confirmUninstall": "再次点击确认",
+    "confirmUninstallMessage": "移除 {{name}}？此操作无法撤销。",
+    "cancel": "取消",
+    "remove": "移除",
+    "updateFailed": "更新失败",
+    "installFailed": "安装失败",
+    "uninstallFailed": "卸载失败",
+    "toggleFailed": "切换失败",
+    "buildYourOwn": "构建您自己的插件",
+    "starter": "入门模板",
+    "docs": "文档",
+    "starterPlugin": {
+      "name": "项目统计",
+      "badge": "入门",
+      "description": "查看项目的文件数、代码行数、文件类型分布以及最近活动。",
+      "install": "安装"
+    },
+    "morePlugins": "更多",
+    "enable": "启用",
+    "disable": "禁用",
+    "installAriaLabel": "插件 git 仓库 URL",
+    "tab": "标签",
+    "runningStatus": "运行中"
   }
 }

vite.config.js

@@ -1,15 +1,20 @@
 import { defineConfig, loadEnv } from 'vite'
 import react from '@vitejs/plugin-react'
+import { getConnectableHost, normalizeLoopbackHost } from './shared/networkHosts.js'
 
-export default defineConfig(({ command, mode }) => {
+export default defineConfig(({ mode }) => {
   // Load env file based on `mode` in the current working directory.
   const env = loadEnv(mode, process.cwd(), '')
 
-  const host = env.HOST || '0.0.0.0'
+  const configuredHost = env.HOST || '0.0.0.0'
-  // When binding to all interfaces (0.0.0.0), proxy should connect to localhost
+  // if the host is not a loopback address, it should be used directly. 
-  // Otherwise, proxy to the specific host the backend is bound to
+  // This allows the vite server to EXPOSE all interfaces when the host 
-  const proxyHost = host === '0.0.0.0' ? 'localhost' : host
+  // is set to '0.0.0.0' or '::', while still using 'localhost' for browser 
-  const port = env.PORT || 3001
+  // URLs and proxy targets.
+  const host = normalizeLoopbackHost(configuredHost)
+  
+  const proxyHost = getConnectableHost(configuredHost)
+  const serverPort = env.SERVER_PORT || 3001
 
   return {
     plugins: [react()],
@@ -17,13 +22,13 @@ export default defineConfig(({ command, mode }) => {
       host,
       port: parseInt(env.VITE_PORT) || 5173,
       proxy: {
-        '/api': `http://${proxyHost}:${port}`,
+        '/api': `http://${proxyHost}:${serverPort}`,
         '/ws': {
-          target: `ws://${proxyHost}:${port}`,
+          target: `ws://${proxyHost}:${serverPort}`,
           ws: true
         },
         '/shell': {
-          target: `ws://${proxyHost}:${port}`,
+          target: `ws://${proxyHost}:${serverPort}`,
           ws: true
         }
       }