feat: Claude Code連携 #46
Conversation
URLを入力するとClaude Code CLIを使ってJSer.info風の説明文を自動生成する機能を追加。 - ClaudeCodeButton: URL横のボタンでClaude Code実行 - ClaudeCodePreview: 生成結果のプレビュー表示 - Cmd+Shift+Jで結果をEditorに挿入 - MCP設定によるjser-infoツールの利用 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
コメント欄への挿入時に既存テキストに追記するのではなく、 生成結果で全体を置き換えるように修正。 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
There was a problem hiding this comment.
Pull request overview
This PR integrates Claude Code functionality to automatically generate descriptive text from URLs. When a user enters a URL, the application can invoke Claude Code via CLI to fetch and generate content based on that URL.
Changes:
- Added Claude Code integration with automatic URL processing triggered by URL input changes
- Implemented UI components (button and preview) to control and display AI-generated results
- Added keyboard shortcut (Cmd+Shift+J) to insert generated content into the editor
Reviewed changes
Copilot reviewed 9 out of 9 changed files in this pull request and generated 7 comments.
Show a summary per file
| File | Description |
|---|---|
| src/browser/service-instance.js | Added getClaudeCodeConfig() function to retrieve Claude Code configuration with test environment detection |
| src/browser/component/Editor.js | Added onInsertClaudeCode prop and keyboard shortcut handler for Cmd+Shift+J |
| src/browser/component/ClaudeCodePreview.js | New component to display AI generation results with error/success states |
| src/browser/component/ClaudeCodeButton.js | New component providing UI button for Claude Code with auto-trigger on URL changes |
| src/browser/Store/ServiceStore.js | Added Claude Code state management including status tracking and action handlers |
| src/browser/App.js | Integrated Claude Code components and wired up action handlers |
| src/browser/Action/ServiceActionConst.js | Added Claude Code action constants |
| src/browser/Action/ServiceAction.js | Implemented Claude Code execution logic using child process spawn |
| css/index.css | Added styles for Claude Code button and preview components |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
src/browser/Action/ServiceAction.js
Outdated
|
|
||
| const { spawn } = require("child_process"); | ||
| const fs = require("fs"); | ||
| const path = require("path"); |
There was a problem hiding this comment.
The path module is imported but never used in this file. Consider removing the unused import.
| const path = require("path"); |
src/browser/Action/ServiceAction.js
Outdated
| this.dispatch(keys.claudeCodeStart, { url }); | ||
|
|
||
| // 設定からプロンプトを使用 | ||
| const prompt = `${config.prompt}\n\nURL: ${url}`; |
There was a problem hiding this comment.
The url parameter is directly interpolated into the prompt without validation or sanitization. While the URL is checked to start with 'http' in the calling code, this creates a potential command injection risk if the URL contains special characters. Consider validating or escaping the URL before using it in the prompt that will be passed to the spawned process.
- requireをimportに統一 - デバッグログを削除 - _extractDescriptionをインライン化 - 未使用のpath importを削除 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
getContentがundefinedを返す場合にdestructureエラーが 発生していた問題を修正。 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Uh oh!
There was an error while loading. Please reload this page.