cc-viewer 1.2.5 → 1.2.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,8 +1,8 @@
1
1
  # CC-Viewer
2
2
 
3
- A request monitoring system for Claude Code that captures and visualizes all API requests and responses in real time. Helps developers monitor their Context for reviewing and debugging during Vibe Coding.
3
+ Claude Code request monitoring system that captures and visualizes all API requests and responses from Claude Code in real time (raw text, untruncated). Helps developers monitor their Context for reviewing and troubleshooting during Vibe Coding.
4
4
 
5
- [简体中文](./docs/README.zh.md) | [繁體中文](./docs/README.zh-TW.md) | [한국어](./docs/README.ko.md) | [日本語](./docs/README.ja.md) | [Deutsch](./docs/README.de.md) | [Español](./docs/README.es.md) | [Français](./docs/README.fr.md) | [Italiano](./docs/README.it.md) | [Dansk](./docs/README.da.md) | [Polski](./docs/README.pl.md) | [Русский](./docs/README.ru.md) | [العربية](./docs/README.ar.md) | [Norsk](./docs/README.no.md) | [Português (Brasil)](./docs/README.pt-BR.md) | [ไทย](./docs/README.th.md) | [Türkçe](./docs/README.tr.md) | [Українська](./docs/README.uk.md)
5
+ English | [简体中文](./docs/README.zh.md) | [繁體中文](./docs/README.zh-TW.md) | [한국어](./docs/README.ko.md) | [日本語](./docs/README.ja.md) | [Deutsch](./docs/README.de.md) | [Español](./docs/README.es.md) | [Français](./docs/README.fr.md) | [Italiano](./docs/README.it.md) | [Dansk](./docs/README.da.md) | [Polski](./docs/README.pl.md) | [Русский](./docs/README.ru.md) | [العربية](./docs/README.ar.md) | [Norsk](./docs/README.no.md) | [Português (Brasil)](./docs/README.pt-BR.md) | [ไทย](./docs/README.th.md) | [Türkçe](./docs/README.tr.md) | [Українська](./docs/README.uk.md)
6
6
 
7
7
  ## Usage
8
8
 
@@ -18,26 +18,26 @@ npm install -g cc-viewer
18
18
  ccv
19
19
  ```
20
20
 
21
- This command automatically detects your Claude Code installation method (NPM or Native Install) and configures itself.
21
+ This command automatically detects your local Claude Code installation method (NPM or Native Install) and adapts accordingly.
22
22
 
23
- - **NPM Install**: Injects interceptor script into `cli.js` of Claude Code.
24
- - **Native Install**: Detects `claude` binary, sets up a local transparent proxy, and configures a Zsh Shell Hook to route traffic through the proxy automatically.
23
+ - **NPM Install**: Automatically injects an interceptor script into Claude Code's `cli.js`.
24
+ - **Native Install**: Automatically detects the `claude` binary, configures a local transparent proxy, and sets up a Zsh Shell Hook to automatically forward traffic.
25
25
 
26
26
  ### Configuration Override
27
27
 
28
- If you need to use a custom API endpoint (e.g., corporate proxy), simply configure it in `~/.claude/settings.json` or set `ANTHROPIC_BASE_URL` environment variable. `ccv` will respect these settings and forward requests correctly.
28
+ If you need to use a custom API endpoint (e.g., corporate proxy), simply configure it in `~/.claude/settings.json` or set the `ANTHROPIC_BASE_URL` environment variable. `ccv` will automatically detect it and forward requests correctly.
29
29
 
30
30
  ### Silent Mode
31
31
 
32
- By default, `ccv` runs in silent mode when wrapping `claude`, ensuring your terminal output remains clean and identical to the original Claude Code experience. All logs are captured in the background and visible at `http://localhost:7008`.
32
+ By default, `ccv` runs in silent mode when wrapping `claude`, ensuring your terminal output stays clean and consistent with the native experience. All logs are captured in the background and can be viewed at `http://localhost:7008`.
33
33
 
34
- Once configured, use `claude` as usual. Open `http://localhost:7008` to view the monitoring interface.
34
+ Once configured, just use the `claude` command as usual. Visit `http://localhost:7008` to view the monitoring interface.
35
35
 
36
36
  ### Troubleshooting
37
37
 
38
38
  - **Mixed Output**: If you see `[CC-Viewer]` debug logs mixed with Claude's output, please update to the latest version (`npm install -g cc-viewer`).
39
- - **Connection Refused**: Ensure `ccv` background process is running. Running `ccv` or `claude` (after hook installation) should start it automatically.
40
- - **Empty Body**: If you see "No Body" in the viewer, it might be due to non-standard SSE formats. The viewer now attempts to capture raw content as a fallback.
39
+ - **Connection Refused**: Make sure the `ccv` background process is running. Running `ccv` or `claude` (after hook installation) should start it automatically.
40
+ - **Empty Body**: If you see "No Body" in the Viewer, it may be due to non-standard SSE formats. The Viewer now supports capturing raw content as a fallback.
41
41
 
42
42
  ### Uninstall
43
43
 
@@ -54,77 +54,49 @@ ccv --version
54
54
  ## Features
55
55
 
56
56
  ### Request Monitoring (Raw Mode)
57
-
58
- - Real-time capture of all API requests from Claude Code, including streaming responses
59
- - Left panel shows request method, URL, duration, and status code
60
- - Automatically identifies and labels Main Agent and Sub Agent requests (with sub-types: Bash, Task, Plan, General)
61
- - Request list auto-scrolls to the selected item (centered on mode switch, nearest on manual click)
62
- - Right panel supports Request / Response tab switching
63
- - Request Body expands `messages`, `system`, `tools` one level by default
64
- - Response Body fully expanded by default
65
- - Toggle between JSON view and plain text view
66
- - One-click JSON content copy
57
+ <img width="1500" height="720" alt="image" src="https://github.com/user-attachments/assets/519dd496-68bd-4e76-84d7-2a3d14ae3f61" />
58
+ - Real-time capture of all API requests from Claude Code, ensuring raw text rather than truncated logs (this is important!!!)
59
+ - Automatically identifies and labels Main Agent and Sub Agent requests (sub-types: Bash, Task, Plan, General)
67
60
  - MainAgent requests support Body Diff JSON, showing a collapsible diff with the previous MainAgent request (only changed/added fields)
68
- - Diff section supports JSON/Text view switching and one-click copy
69
- - "Expand Diff" setting: when enabled, MainAgent requests auto-expand the diff section
70
- - Body Diff JSON tooltip is dismissible; once closed, the preference is persisted server-side and never shown again
71
- - Sensitive headers (`x-api-key`, `authorization`) are automatically masked in JSONL log files to prevent credential leakage
72
61
  - Inline token usage stats per request (input/output tokens, cache creation/read, hit rate)
73
62
  - Compatible with Claude Code Router (CCR) and other proxy setups — requests are matched by API path pattern as a fallback
74
63
 
75
64
  ### Chat Mode
76
65
 
77
- Click the "Chat mode" button in the top right to parse Main Agent's full conversation history into a chat interface:
78
-
79
- - User messages right-aligned (blue bubbles), Main Agent replies left-aligned (dark bubbles) with Markdown rendering
80
- - `/compact` messages auto-detected and displayed collapsed, click to expand full summary
81
- - Tool call results displayed inline within the corresponding Assistant message
82
- - `thinking` blocks collapsed by default, rendered as Markdown, click to expand; supports one-click translation
83
- - `tool_use` shown as compact tool call cards (Bash, Read, Edit, Write, Glob, Grep, Task each have dedicated displays)
84
- - Task (SubAgent) tool results rendered as Markdown
85
- - User selection messages (AskUserQuestion) shown in Q&A format
86
- - System tags (`<system-reminder>`, `<project-reminder>`, etc.) auto-collapsed
87
- - Skill loaded messages auto-detected and collapsed, showing skill name; click to expand full documentation with Markdown rendering
88
- - Skills reminder auto-detected and collapsed
89
- - System text auto-filtered, showing only real user input
90
- - Multi-session segmented display (auto-segmented after `/compact`, `/clear`, etc.)
91
- - Each message shows a timestamp accurate to the second, derived from API request timing
92
- - Each message has a "View Request" link to jump back to raw mode at the corresponding API request
93
- - Bidirectional mode sync: switching to chat mode scrolls to the conversation matching the selected request; switching back scrolls to the selected request
94
- - Settings panel: toggle default collapse state for tool results and thinking blocks
95
- - Global settings: toggle filtering of irrelevant requests (count_tokens, heartbeat) from the request list
66
+ Click the "Chat Mode" button in the top right to parse Main Agent's full conversation history into a chat interface:
67
+ <img width="1500" height="730" alt="image" src="https://github.com/user-attachments/assets/c973f142-748b-403f-b2b7-31a5d81e33e6" />
96
68
 
97
- ### Translation
98
69
 
99
- - Thinking blocks and assistant messages support one-click translation
100
- - Powered by Claude Haiku API, uses `x-api-key` authentication only (OAuth session tokens are excluded to prevent context pollution)
101
- - Automatically captures haiku model name from mainAgent requests; defaults to `claude-haiku-4-5-20251001`
102
- - Translation results are cached; click again to toggle back to the original text
103
- - Loading spinner animation shown during translation
104
- - (?) help icon on `authorization` header links to concept doc explaining context pollution
70
+ - Agent Team display is not yet supported
71
+ - User messages are right-aligned (blue bubbles), Main Agent replies are left-aligned (dark bubbles)
72
+ - `thinking` blocks are collapsed by default, rendered in Markdown, click to expand and view the thinking process; one-click translation supported (feature is still unstable)
73
+ - User selection messages (AskUserQuestion) are displayed in Q&A format
74
+ - Bidirectional mode sync: switching to Chat Mode auto-scrolls to the conversation corresponding to the selected request; switching back to Raw Mode auto-scrolls to the selected request
75
+ - Settings panel: toggle default collapse state for tool results and thinking blocks
76
+
105
77
 
106
- ### Token Stats
78
+ ### Statistics Tool
107
79
 
108
- Hover panel in the header area:
80
+ "Data Statistics" hover panel in the header area:
81
+ <img width="1500" height="729" alt="image" src="https://github.com/user-attachments/assets/b23f9a81-fc3d-4937-9700-e70d84e4e5ce" />
109
82
 
110
- - Token counts grouped by model (input/output)
111
- - Cache creation/read counts and cache hit rate
112
- - Cache rebuild statistics: grouped by reason (TTL, system/tools/model change, message truncation/modification, key change) with count and cache_creation tokens
113
- - Tool usage statistics: call counts per tool, sorted by frequency
114
- - Skill usage statistics: call counts per skill, sorted by frequency
83
+ - Displays cache creation/read counts and cache hit rate
84
+ - Cache rebuild statistics: grouped by reason (TTL, system/tools/model change, message truncation/modification, key change) showing count and cache_creation tokens
85
+ - Tool usage statistics: tools displayed by call frequency, sorted by count
86
+ - Skill usage statistics: skills displayed by call frequency, sorted by count
115
87
  - Concept help (?) icons: click to view built-in documentation for MainAgent, CacheRebuild, and each tool
116
- - Main Agent cache expiration countdown
117
88
 
118
89
  ### Log Management
119
90
 
120
91
  Via the CC-Viewer dropdown menu in the top left:
92
+ <img width="1200" height="672" alt="image" src="https://github.com/user-attachments/assets/8cf24f5b-9450-4790-b781-0cd074cd3b39" />
121
93
 
122
- - Import local logs: browse historical log files, grouped by project, opens in new window
123
- - Load local JSONL file: directly select and load a local `.jsonl` file (up to 500MB)
124
- - Download current log: download the current monitoring JSONL log file
94
+ - Import local logs: browse historical log files, grouped by project, opens in a new window
95
+ - Load local JSONL file: directly select and load a local `.jsonl` file (supports up to 500MB)
96
+ - Save current log as: download the current monitoring JSONL log file
125
97
  - Merge logs: combine multiple JSONL log files into a single session for unified analysis
126
- - Export user prompts: extract and display all user inputs with three view modes — Original (raw content), Context (with system tags collapsible), and Text (plain text only); slash commands (`/model`, `/context`, etc.) shown as standalone entries; command-related tags auto-hidden from prompt content
127
- - Export prompts to TXT: export user prompts (text only, excluding system tags) to a local `.txt` file
98
+ - View user Prompts: extract and display all user inputs, supporting three view modes — Raw mode (original content), Context mode (system tags collapsible), Text mode (plain text); slash commands (`/model`, `/context`, etc.) shown as standalone entries; command-related tags are auto-hidden from Prompt content
99
+ - Export Prompts to TXT: export user Prompts (plain text, excluding system tags) to a local `.txt` file
128
100
 
129
101
  ### Multi-language Support
130
102
 
package/cli.js CHANGED
@@ -292,8 +292,14 @@ async function runProxyCommand(args) {
292
292
 
293
293
  const args = process.argv.slice(2);
294
294
  const isUninstall = args.includes('--uninstall');
295
+ const isHelp = args.includes('--help') || args.includes('-h') || args[0] === 'help';
295
296
  const isVersion = args.includes('--v') || args.includes('--version') || args.includes('-v');
296
297
 
298
+ if (isHelp) {
299
+ console.log(t('cli.help'));
300
+ process.exit(0);
301
+ }
302
+
297
303
  if (isVersion) {
298
304
  try {
299
305
  const pkg = JSON.parse(readFileSync(resolve(__dirname, 'package.json'), 'utf-8'));