feat: Claude Web UI POC with streaming and tool visualization
Initial implementation of a web-based Claude Code interface with: Backend (Node.js + Express + WebSocket): - Claude CLI spawning with JSON stream mode - Session management with resume support (--continue flag) - Session history API endpoint - Real-time WebSocket communication - --include-partial-messages for live streaming Frontend (React + Vite + Tailwind): - Modern dark theme UI (Discord/Slack style) - Live text streaming with content_block_delta handling - Markdown rendering with react-markdown + remark-gfm - Syntax highlighting with react-syntax-highlighter (One Dark) - Collapsible high-tech tool cards with: - Tool-specific icons and colors - Compact summaries (Read, Glob, Bash, Edit, etc.) - Expandable JSON details - Session history loading on resume - Project directory selection - Resume session toggle Docker: - Multi-container setup (backend + nginx frontend) - Isolated Claude config directory - Host network mode for backend Built collaboratively by Neko (VPS Claude) and Web-UI Claude, with Web-UI Claude implementing most frontend features while running inside the interface itself (meta-programming!). 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
10
frontend/public/claude.svg
Normal file
10
frontend/public/claude.svg
Normal file
@@ -0,0 +1,10 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
|
||||
<defs>
|
||||
<linearGradient id="grad" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#f97316;stop-opacity:1" />
|
||||
<stop offset="100%" style="stop-color:#ea580c;stop-opacity:1" />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<rect width="100" height="100" rx="20" fill="url(#grad)"/>
|
||||
<text x="50" y="68" font-family="Arial, sans-serif" font-size="50" font-weight="bold" fill="white" text-anchor="middle">C</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 510 B |
Reference in New Issue
Block a user