@kimuson/claude-code-viewer 0.5.2 → 0.5.4

package/README.md

@@ -138,6 +138,10 @@ The application reads Claude Code conversation logs from:
 
 **Note on Version Support**: Recent versions of Claude Code have adopted more aggressive summarization behavior. To accommodate users who prefer to pin to specific versions, Claude Code Viewer maintains compatibility with Claude Code v1.0.50 and later for the foreseeable future.
 
+### Environment Variables
+
+**NODE_ENV Consideration**: If you have `NODE_ENV=development` set in your environment (from other projects or system configuration), the application may not work correctly. Either set `NODE_ENV=production` or leave it unset when running Claude Code Viewer.
+
 ## Configuration
 
 ### Command-Line Options and Environment Variables
@@ -166,6 +170,7 @@ Settings can be configured from the sidebar in Claude Code Viewer.
 | Hide sessions without user messages | true | Claude Code creates logs for operations like `/compact` that aren't tied to actual tasks, which can create noise. When enabled, sessions without user messages are hidden. |
 | Unify sessions with same title | false | When resuming, Claude Code creates a new session with regenerated conversation logs. When enabled, only the latest session with the same title is displayed. |
 | Enter Key Behavior | Shift+Enter | Specifies which key combination sends messages. Options include Enter, Shift+Enter, and Command+Enter. |
+| Search Hotkey | Command+K | Select the hotkey to open search dialog. Options include Ctrl+K and Command+K. |
 | Permission Mode | Ask permission | Controls the approval logic when Claude Code requests tool invocations. By default, users approve requests through the UI. This feature requires Claude Code v1.0.82 or later; earlier versions automatically approve regardless of this setting. |
 | Theme | System | Toggles between Dark Mode and Light Mode. Default follows system settings. |
 | Notifications | None | Enables sound notifications when running session processes complete. Choose from multiple notification sounds with test playback functionality. |
@@ -224,6 +229,17 @@ Claude Code Viewer is designed with remote hosting in mind. To support remote de
 
 The application features a separated client-server architecture that enables remote hosting. **Basic password authentication is available** via the `--password` command-line option or `CCV_PASSWORD` environment variable. When set, users must authenticate with the configured password before accessing the application. However, this is a simple single-password authentication mechanism without advanced features like multi-user support, role-based access control, or OAuth integration. If you require more sophisticated authentication, carefully evaluate your security requirements and implement appropriate access controls at the infrastructure level (e.g., reverse proxy with OAuth, VPN, IP whitelisting).
 
+## Privacy and Network Communication
+
+Claude Code Viewer is designed with privacy in mind:
+
+- **Localhost-Only Communication**: The application runs a web client and API server on localhost, communicating exclusively between your browser and the local server
+- **Anthropic API Access**: Claude Code is invoked via the Claude Agent SDK, which handles communication to the Anthropic API. No other external services are contacted
+- **No Tracking or Telemetry**: The application does not collect crash reports, usage statistics, or any other telemetry. Tracking for Claude Code itself follows the settings configured in Claude Code's own configuration
+- **Network Isolation**: The application functions correctly even if network access is restricted to only the Anthropic API and the localhost port. There are no plans to add external network dependencies in the future
+
+If you have concerns about network access, you can verify that the application only communicates with the Anthropic API and localhost by monitoring network traffic.
+
 ## License
 
 This project is available under the MIT License.

package/dist/main.js

@@ -7,7 +7,7 @@ import { Effect as Effect49 } from "effect";
 // package.json
 var package_default = {
   name: "@kimuson/claude-code-viewer",
-  version: "0.5.2",
+  version: "0.5.4",
   description: "A full-featured web-based Claude Code client that provides complete interactive functionality for managing Claude Code projects.",
   type: "module",
   license: "MIT",
@@ -51,9 +51,9 @@ var package_default = {
     prepare: "lefthook install"
   },
   dependencies: {
-    "@anthropic-ai/claude-agent-sdk": "0.1.30",
+    "@anthropic-ai/claude-agent-sdk": "0.2.2",
     "@anthropic-ai/claude-code": "2.0.24",
-    "@anthropic-ai/sdk": "0.67.0",
+    "@anthropic-ai/sdk": "0.71.2",
     "@effect/cluster": "0.55.0",
     "@effect/experimental": "0.57.11",
     "@effect/platform": "0.93.6",
@@ -62,7 +62,7 @@ var package_default = {
     "@effect/sql": "0.48.6",
     "@effect/workflow": "0.15.1",
     "@hono/node-server": "1.19.5",
-    "@hono/zod-validator": "0.7.4",
+    "@hono/zod-validator": "0.7.6",
     "@lingui/core": "5.5.1",
     "@lingui/react": "5.5.1",
     "@radix-ui/react-avatar": "1.1.10",
@@ -668,6 +668,7 @@ var LayerImpl4 = Effect5.gen(function* () {
         globalClaudeDirectoryPath,
         "commands"
       ),
+      claudeSkillsDirPath: path.resolve(globalClaudeDirectoryPath, "skills"),
       claudeProjectsDirPath: path.resolve(
         globalClaudeDirectoryPath,
         "projects"
@@ -1041,6 +1042,49 @@ var scanCommandFilesRecursively = (dirPath) => Effect10.gen(function* () {
     })
   );
 });
+var scanSkillFilesRecursively = (dirPath) => Effect10.gen(function* () {
+  const fs = yield* FileSystem5.FileSystem;
+  const path = yield* Path6.Path;
+  const scanDirectory = (currentPath, relativePath) => Effect10.gen(function* () {
+    const exists = yield* fs.exists(currentPath);
+    if (!exists) {
+      return [];
+    }
+    const skillFilePath = path.join(currentPath, "SKILL.md");
+    const skillFileExists = yield* fs.exists(skillFilePath);
+    const skillNames = [];
+    if (skillFileExists) {
+      const skillName = relativePath.replace(/\//g, ":");
+      if (skillName) {
+        skillNames.push(skillName);
+      }
+    }
+    const items = yield* fs.readDirectory(currentPath);
+    const results = yield* Effect10.forEach(
+      items,
+      (item) => Effect10.gen(function* () {
+        if (item.startsWith(".")) {
+          return [];
+        }
+        const itemPath = path.join(currentPath, item);
+        const info = yield* fs.stat(itemPath);
+        if (info.type === "Directory") {
+          const newRelativePath = relativePath ? `${relativePath}/${item}` : item;
+          return yield* scanDirectory(itemPath, newRelativePath);
+        }
+        return [];
+      }),
+      { concurrency: "unbounded" }
+    );
+    return [...skillNames, ...results.flat()];
+  });
+  return yield* scanDirectory(dirPath, "").pipe(
+    Effect10.match({
+      onSuccess: (items) => items,
+      onFailure: () => []
+    })
+  );
+});
 
 // src/server/core/claude-code/models/ClaudeCodeVersion.ts
 import { z as z19 } from "zod";
@@ -1093,10 +1137,8 @@ var parseMcpListOutput = (output) => {
 };
 
 // src/server/core/claude-code/models/ClaudeCode.ts
-import { query as agentSdkQuery } from "@anthropic-ai/claude-agent-sdk";
-import {
-  query as claudeCodeQuery
-} from "@anthropic-ai/claude-code";
+import * as agentSdk from "@anthropic-ai/claude-agent-sdk";
+import * as claudeCodeSdk from "@anthropic-ai/claude-code";
 import { Command, Path as Path7 } from "@effect/platform";
 import { Data, Effect as Effect11 } from "effect";
 import { uniq } from "es-toolkit";
@@ -1201,10 +1243,19 @@ var getAvailableFeatures = (claudeCodeVersion) => ({
     minor: 0,
     patch: 28
     // Sidechain conversations stored in agent-*.jsonl since v2.0.28
+  }) : false,
+  runSkillsDirectly: claudeCodeVersion !== null ? greaterThanOrEqual(claudeCodeVersion, {
+    major: 2,
+    minor: 1,
+    patch: 0
+  }) || greaterThanOrEqual(claudeCodeVersion, {
+    major: 2,
+    minor: 0,
+    patch: 77
   }) : false
 });
-var query = (prompt, options) => {
-  const { canUseTool, permissionMode, ...baseOptions } = options;
+var query3 = (prompt, options) => {
+  const { canUseTool, permissionMode, hooks, ...baseOptions } = options;
   return Effect11.gen(function* () {
     const { claudeCodeExecutablePath, claudeCodeVersion } = yield* Config;
     const availableFeatures = getAvailableFeatures(claudeCodeVersion);
@@ -1216,7 +1267,7 @@ var query = (prompt, options) => {
       }
     };
     if (availableFeatures.agentSdk) {
-      return agentSdkQuery({
+      return agentSdk.query({
         prompt,
         options: {
           systemPrompt: { type: "preset", preset: "claude_code" },
@@ -1240,10 +1291,15 @@ var query = (prompt, options) => {
       };
       return fn;
     })();
-    return claudeCodeQuery({
+    return claudeCodeSdk.query({
       prompt,
       options: {
-        ...options2,
+        ...baseOptions,
+        permissionMode: (
+          // fallback unsupported permission modes
+          permissionMode === "delegate" || permissionMode === "dontAsk" ? "bypassPermissions" : permissionMode
+        ),
+        hooks,
         canUseTool: fallbackCanUseTool
       }
     });
@@ -1300,16 +1356,25 @@ var LayerImpl9 = Effect13.gen(function* () {
   const getClaudeCommands = (options) => Effect13.gen(function* () {
     const { projectId } = options;
     const { project } = yield* projectRepository.getProject(projectId);
+    const features = yield* claudeCodeService.getAvailableFeatures();
     const globalCommands = yield* scanCommandFilesRecursively(
       (yield* context.claudeCodePaths).claudeCommandsDirPath
     );
     const projectCommands = project.meta.projectPath === null ? [] : yield* scanCommandFilesRecursively(
       path.resolve(project.meta.projectPath, ".claude", "commands")
     );
+    const globalSkills = features.runSkillsDirectly ? yield* scanSkillFilesRecursively(
+      (yield* context.claudeCodePaths).claudeSkillsDirPath
+    ) : [];
+    const projectSkills = features.runSkillsDirectly && project.meta.projectPath !== null ? yield* scanSkillFilesRecursively(
+      path.resolve(project.meta.projectPath, ".claude", "skills")
+    ) : [];
     return {
       response: {
         globalCommands,
         projectCommands,
+        globalSkills,
+        projectSkills,
         defaultCommands: ["init", "compact", "security-review", "review"]
       },
       status: 200
@@ -1605,7 +1670,8 @@ var LayerImpl12 = Effect17.gen(function* () {
     enterKeyBehavior: "shift-enter-send",
     permissionMode: "default",
     locale: DEFAULT_LOCALE,
-    theme: "system"
+    theme: "system",
+    searchHotkey: "command-k"
   });
   const setUserConfig = (newConfig) => Effect17.gen(function* () {
     yield* Ref5.update(configRef, () => newConfig);
@@ -1799,12 +1865,36 @@ import { Context as Context15, Effect as Effect20, Layer as Layer17, Ref as Ref7
 
 // src/server/core/session/constants/pricing.ts
 var MODEL_PRICING = {
+  "claude-opus-4.5": {
+    input: 5,
+    output: 25,
+    cache_creation: 6.25,
+    cache_read: 0.5
+  },
+  "claude-opus-4.1": {
+    input: 15,
+    output: 75,
+    cache_creation: 18.75,
+    cache_read: 1.5
+  },
+  "claude-sonnet-4.5": {
+    input: 3,
+    output: 15,
+    cache_creation: 3.75,
+    cache_read: 0.3
+  },
   "claude-3.5-sonnet": {
     input: 3,
     output: 15,
     cache_creation: 3.75,
     cache_read: 0.3
   },
+  "claude-haiku-4.5": {
+    input: 1,
+    output: 5,
+    cache_creation: 1.25,
+    cache_read: 0.1
+  },
   "claude-3-opus": {
     input: 15,
     output: 75,
@@ -1816,22 +1906,6 @@ var MODEL_PRICING = {
     output: 1.25,
     cache_creation: 0.3,
     cache_read: 0.03
-  },
-  "claude-instant-1.2": {
-    input: 1.63,
-    output: 5.51,
-    cache_creation: 2.0375,
-    // 1.63 * 1.25
-    cache_read: 0.163
-    // 1.63 * 0.1
-  },
-  "claude-2": {
-    input: 8,
-    output: 24,
-    cache_creation: 10,
-    // 8.0 * 1.25
-    cache_read: 0.8
-    // 8.0 * 0.1
   }
 };
 var DEFAULT_MODEL_PRICING = MODEL_PRICING["claude-3.5-sonnet"];
@@ -1839,6 +1913,18 @@ var DEFAULT_MODEL_PRICING = MODEL_PRICING["claude-3.5-sonnet"];
 // src/server/core/session/functions/calculateSessionCost.ts
 function normalizeModelName(modelName) {
   const normalized = modelName.toLowerCase();
+  if (normalized.includes("opus-4-5") || normalized.includes("opus-4.5")) {
+    return "claude-opus-4.5";
+  }
+  if (normalized.includes("opus-4-1") || normalized.includes("opus-4.1")) {
+    return "claude-opus-4.1";
+  }
+  if (normalized.includes("sonnet-4-5") || normalized.includes("sonnet-4.5")) {
+    return "claude-sonnet-4.5";
+  }
+  if (normalized.includes("haiku-4-5") || normalized.includes("haiku-4.5")) {
+    return "claude-haiku-4.5";
+  }
   if (normalized.includes("sonnet-4") || normalized.includes("3-5-sonnet") || normalized.includes("3.5-sonnet")) {
     return "claude-3.5-sonnet";
   }
@@ -1848,12 +1934,6 @@ function normalizeModelName(modelName) {
   if (normalized.includes("3-haiku") || normalized.includes("haiku-20")) {
     return "claude-3-haiku";
   }
-  if (normalized.includes("instant-1.2") || normalized.includes("instant-1")) {
-    return "claude-instant-1.2";
-  }
-  if (normalized.startsWith("claude-2")) {
-    return "claude-2";
-  }
   return "claude-3.5-sonnet";
 }
 function getModelPricing(modelName) {
@@ -3051,7 +3131,7 @@ var LayerImpl15 = Effect24.gen(function* () {
               userConfig,
               sessionId: task.def.baseSessionId
             });
-            return yield* query(generateMessages(), {
+            return yield* query3(generateMessages(), {
               resume: task.def.baseSessionId,
               cwd: sessionProcess.def.cwd,
               abortController: sessionProcess.def.abortController,
@@ -3062,6 +3142,9 @@ var LayerImpl15 = Effect24.gen(function* () {
         setNextMessage(input);
         try {
           for await (const message of messageIter) {
+            if (sessionProcess.def.abortController.signal.aborted) {
+              break;
+            }
             const fallbackMessage = fallbackSdkMessage(message);
             const result = await Runtime2.runPromise(runtime)(
               handleMessage(fallbackMessage)
@@ -3596,6 +3679,14 @@ var LayerImpl18 = Effect29.gen(function* () {
           {
             name: "sidechain-separation",
             enabled: claudeCodeFeatures.sidechainSeparation
+          },
+          {
+            name: "uuid-on-sdk-message",
+            enabled: claudeCodeFeatures.uuidOnSDKMessage
+          },
+          {
+            name: "run-skills-directly",
+            enabled: claudeCodeFeatures.runSkillsDirectly
           }
         ]
       },
@@ -5656,14 +5747,14 @@ var LayerImpl26 = Effect40.gen(function* () {
     yield* Ref12.set(indexCacheRef, { index, documents, builtAt: now });
     return { index, documents };
   });
-  const search = (query2, limit = 20, projectId) => Effect40.gen(function* () {
+  const search = (query4, limit = 20, projectId) => Effect40.gen(function* () {
     const { claudeProjectsDirPath } = yield* context.claudeCodePaths;
     const dirExists = yield* fs.exists(claudeProjectsDirPath);
     if (!dirExists) {
       return { results: [] };
     }
     const { index: miniSearch, documents } = yield* getIndex();
-    const searchResults = miniSearch.search(query2).slice(0, limit * 2);
+    const searchResults = miniSearch.search(query4).slice(0, limit * 2);
     const results = [];
     for (const result of searchResults) {
       if (results.length >= limit) break;
@@ -5673,7 +5764,7 @@ var LayerImpl26 = Effect40.gen(function* () {
       const score = doc.type === "user" ? result.score * 1.2 : result.score;
       const snippetLength = 150;
       const text = doc.text;
-      const queryLower = query2.toLowerCase();
+      const queryLower = query4.toLowerCase();
       const textLower = text.toLowerCase();
       const matchIndex = textLower.indexOf(queryLower);
       let snippet;
@@ -5713,8 +5804,8 @@ var SearchService = class extends Context32.Tag("SearchService")() {
 var LayerImpl27 = Effect41.gen(function* () {
   const searchService = yield* SearchService;
   const search = (options) => Effect41.gen(function* () {
-    const { query: query2, limit, projectId } = options;
-    if (query2.trim().length < 2) {
+    const { query: query4, limit, projectId } = options;
+    if (query4.trim().length < 2) {
       return {
         status: 400,
         response: {
@@ -5723,7 +5814,7 @@ var LayerImpl27 = Effect41.gen(function* () {
       };
     }
     const { results } = yield* searchService.search(
-      query2.trim(),
+      query4.trim(),
       limit,
       projectId
     );
@@ -6881,7 +6972,8 @@ var userConfigSchema = z27.object({
   enterKeyBehavior: z27.enum(["shift-enter-send", "enter-send", "command-enter-send"]).optional().default("shift-enter-send"),
   permissionMode: z27.enum(["acceptEdits", "bypassPermissions", "default", "plan"]).optional().default("default"),
   locale: localeSchema.optional().default("en"),
-  theme: z27.enum(["light", "dark", "system"]).optional().default("system")
+  theme: z27.enum(["light", "dark", "system"]).optional().default("system"),
+  searchHotkey: z27.enum(["ctrl-k", "command-k"]).optional().default("command-k")
 });
 var defaultUserConfig = userConfigSchema.parse({});