Skip to content

Commit c2b7657

Browse files
dkodrclaude
dkodr
and
claude
committed
Initial release of Claudeboard VS Code extension
- Cross-platform clipboard image upload support (Windows, Linux, macOS) - Remote-SSH integration for seamless uploads to remote servers - Configurable keyboard shortcuts and retention periods - Clipboard warm-up optimization for better first-use experience - Optional clipboard clearing after upload (default: disabled) - Service-based architecture with TypeScript strict mode 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
0 parents  commit c2b7657

17 files changed

Lines changed: 1862 additions & 0 deletions

‎.gitattributes‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# Auto detect text files and perform LF normalization
2+
* text=auto

‎.gitignore‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
# Compiled output
2+
out/
3+
*.js
4+
*.js.map
5+
6+
# Dependencies
7+
node_modules/
8+
9+
# Package files
10+
*.vsix
11+
12+
# VS Code workspace
13+
.vscode/
14+
15+
# OS files
16+
.DS_Store
17+
Thumbs.db
18+
19+
# Logs
20+
npm-debug.log*
21+
yarn-debug.log*
22+
yarn-error.log*
23+
24+
# Runtime data
25+
pids
26+
*.pid
27+
*.seed
28+
*.pid.lock
29+
30+
# Coverage directory used by tools like istanbul
31+
coverage/
32+
33+
# Temporary folders
34+
tmp/
35+
temp/

‎CHANGELOG.md‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
# Changelog
2+
3+
All notable changes to the "Claudeboard" extension will be documented in this file.
4+
5+
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
6+
7+
## [1.0.0] - 2025-01-24
8+
9+
### Added
10+
- Initial release
11+
- Cross-platform clipboard image upload (Windows, Linux, macOS)
12+
- Remote-SSH server integration
13+
- Configurable keyboard shortcuts
14+
- Automatic image cleanup with configurable retention period
15+
- Progress indicators and error handling
16+
17+
[1.0.0]: https://github.com/dkodr/claudeboard/releases/tag/v1.0.0

‎CLAUDE.md‎

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
# Claudeboard - VS Code Extension
2+
3+
## Project Overview
4+
A VS Code extension that shares images with Claude Code running on remote servers via Remote-SSH. Upload clipboard images instantly and get shareable file paths for seamless Claude Code workflows.
5+
6+
## Tech Stack
7+
- **Language:** TypeScript (strict mode)
8+
- **Framework:** VS Code Extension API
9+
- **Dependencies:** @types/vscode, @types/node, typescript
10+
- **Build:** TypeScript compiler
11+
- **Package:** vsce (Visual Studio Code Extension)
12+
- **Architecture:** Service-based with dependency injection
13+
14+
## Development Commands
15+
16+
### Build & Development
17+
```bash
18+
npm run compile # Compile TypeScript to JavaScript
19+
npm run watch # Watch for changes and auto-compile
20+
npm run clean # Remove compiled output
21+
```
22+
23+
### Testing & Validation
24+
```bash
25+
# No automated tests currently configured
26+
# Manual testing: F5 in VS Code to launch Extension Development Host
27+
```
28+
29+
### Packaging & Installation
30+
```bash
31+
npm run package # Create VSIX package
32+
npm run install-package # Install the generated VSIX
33+
code --install-extension *.vsix # Alternative install method
34+
```
35+
36+
## Release Workflow
37+
38+
### Version Management
39+
```bash
40+
# Update version in package.json and create git tag
41+
npm version patch # For bug fixes (1.0.0 → 1.0.1)
42+
npm version minor # For new features (1.0.0 → 1.1.0)
43+
npm version major # For breaking changes (1.0.0 → 2.0.0)
44+
```
45+
46+
### Git Workflow
47+
```bash
48+
# Daily development cycle
49+
git status
50+
git add .
51+
git commit -m "feat: Add new feature"
52+
git push origin main
53+
54+
# Release process
55+
npm version patch # Updates package.json and creates git tag
56+
git push origin main # Push commits
57+
git push --tags # Push tags
58+
npm run package # Create VSIX file
59+
```
60+
61+
## Key Features
62+
- **Cross-platform clipboard support:** Windows, Linux, macOS
63+
- **Remote-SSH integration:** Seamless uploads to remote servers
64+
- **Configurable keybinding:** Choose from multiple keyboard shortcuts
65+
- **Auto-cleanup:** Configurable retention period (0-365 days)
66+
- **Dual context:** Works in both editor and terminal
67+
- **Progress indicators:** Real-time upload feedback
68+
- **Secure by design:** Uses existing SSH connections
69+
70+
## Configuration
71+
The extension provides these settings:
72+
- `imageUploader.keybinding`: Keyboard shortcut (ctrl+alt+v, ctrl+shift+v, alt+v, ctrl+v, f12)
73+
- `imageUploader.retentionDays`: Image retention period (0-365 days, 0=never delete)
74+
75+
## Commands
76+
- `imageUploader.uploadFromClipboard.editor`: Upload from clipboard (editor)
77+
- `imageUploader.uploadFromClipboard.terminal`: Upload from clipboard (terminal)
78+
79+
## Extension Requirements
80+
- VS Code version: ^1.74.0
81+
- Extension kind: UI (runs in main VS Code process)
82+
- Activation: On startup (all contexts)
83+
84+
## Architecture
85+
- **Service-based design:** ClipboardService, FileManagerService, ProgressService, ConfigurationService
86+
- **Cross-platform abstractions:** Platform-specific clipboard implementations
87+
- **Type safety:** TypeScript strict mode with Result<T,E> pattern
88+
- **Resource management:** RAII pattern for guaranteed cleanup
89+
- **Command pattern:** Decoupled business logic with dependency injection
90+
91+
## Notes
92+
- No automated testing configured
93+
- Manual workflow preferred over GitHub Actions
94+
- Solo development project
95+
- Designed specifically for Claude Code workflows

‎LICENSE‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2025 Dariusz Kuśnierek
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md‎

Lines changed: 182 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,182 @@
1+
# Claudeboard
2+
3+
Share images with Claude Code running on a remote server via Remote-SSH. Upload clipboard images instantly and get shareable file paths for seamless Claude Code workflows.
4+
5+
## ✨ Features
6+
7+
- 🖼️ **Instant clipboard upload** - Press `Ctrl+Alt+V` to upload any image from clipboard
8+
- 🌍 **Cross-platform support** - Works on Windows, Linux, and macOS
9+
- 🔗 **Smart path insertion** - Automatically pastes file paths in editor or terminal
10+
- 🌐 **Remote-SSH integration** - Seamlessly works with VS Code Remote-SSH
11+
- 🧹 **Configurable auto-cleanup** - Set retention period (0-365 days, 0 = never delete)
12+
- ⚡ **Real-time progress** - Visual feedback during upload process
13+
- 🔐 **Secure by design** - Uses your existing SSH connections
14+
- 🎯 **Dual context** - Works in both code editors and integrated terminals
15+
16+
## 🚀 Quick Start
17+
18+
### Step 1: Prerequisites
19+
- Install VS Code Remote-SSH extension
20+
- Connect to your remote server
21+
- Open a workspace folder on the remote server
22+
23+
### Step 2: Upload Images
24+
1. **Copy any image to clipboard** (screenshot, file copy, web image)
25+
2. **Press `Ctrl+Alt+V`** in VS Code editor or terminal
26+
3. **Watch the magic** - Image uploads instantly and path is pasted
27+
4. **Done!** Your image is now accessible at the inserted file path
28+
29+
💡 **Claude Code Tip**: The generated file paths can be directly shared with Claude Code for image analysis, making it perfect for discussing screenshots, diagrams, or visual debugging.
30+
31+
## 🌐 Upload Destination
32+
33+
### Remote Server Upload
34+
- **Location**: `.claude/claude-code-chat-images/` in workspace root
35+
- **Automatic cleanup**: Files older than 30 days are automatically deleted
36+
- **Git ignored**: Images are automatically excluded from git commits
37+
- **Secure**: Uses existing Remote-SSH connection, no additional authentication needed
38+
- **Returns**: Full file path (e.g., `/workspace/.claude/claude-code-chat-images/image_1234567890.png`)
39+
40+
## ⚙️ Configuration
41+
42+
Go to `File > Preferences > Settings` and search for "Claudeboard":
43+
44+
### Available Settings:
45+
46+
#### Keybinding
47+
Choose your preferred keyboard shortcut:
48+
- `Ctrl+Alt+V` (default)
49+
- `Ctrl+Shift+V`
50+
- `Alt+V`
51+
- `Ctrl+V` (may conflict with normal paste)
52+
- `F12`
53+
54+
#### Retention Period
55+
Control how long uploaded images are kept:
56+
- **Default**: 30 days
57+
- **Range**: 0-365 days
58+
- **Special**: Set to `0` to never delete images automatically
59+
60+
**Note**: The extension always inserts raw file paths for maximum compatibility.
61+
62+
## 📋 Requirements
63+
64+
- **VS Code 1.74.0** or newer
65+
- **VS Code Remote-SSH extension** (for remote server connections)
66+
- **Active remote connection** to your development server
67+
- **Workspace folder** opened on the remote server
68+
69+
### Platform Support
70+
- ✅ **Windows** - Full clipboard support via PowerShell
71+
- ✅ **Linux** - Clipboard support via `xclip` or `wl-clipboard`
72+
- ✅ **macOS** - Clipboard support via `pbpaste`
73+
74+
### Platform-Specific Dependencies
75+
- **Linux**: Install `xclip` (X11) or `wl-clipboard` (Wayland)
76+
- **macOS**: Uses built-in `pbpaste` (no additional setup)
77+
- **Windows**: Uses built-in PowerShell (no additional setup)
78+
79+
## 🎨 Supported Formats
80+
81+
- **PNG** (automatic conversion from clipboard)
82+
- **Automatic cleanup** after 30 days
83+
- **Workspace integration** with `.claude/` directory structure
84+
85+
## ⌨️ Keyboard Shortcuts
86+
87+
| Shortcut | Action | Context |
88+
|----------|--------|---------|
89+
| `Ctrl+Alt+V` | Upload image from clipboard | Editor & Terminal |
90+
| `Ctrl+V` | Normal paste (unaffected) | Editor & Terminal |
91+
92+
**Note**: You can change the upload shortcut in settings. `Ctrl+V` always works normally for text pasting.
93+
94+
## 📦 Installation
95+
96+
### From VS Code Marketplace (Recommended)
97+
1. Open VS Code
98+
2. Go to Extensions (`Ctrl+Shift+X`)
99+
3. Search for "Claudeboard"
100+
4. Click "Install"
101+
102+
### From .vsix file
103+
1. Download the latest `.vsix` file from [Releases](https://github.com/dkodr/claudeboard/releases)
104+
2. Open VS Code
105+
3. Press `Ctrl+Shift+P` and type "Extensions: Install from VSIX"
106+
4. Select the downloaded `.vsix` file
107+
108+
## 🐛 Troubleshooting
109+
110+
| Problem | Solution |
111+
|---------|----------|
112+
| "No remote connection detected" | Connect to remote server using Remote-SSH extension |
113+
| "No workspace folder available" | Open a folder on the remote server |
114+
| Image not detected | Make sure image is copied to clipboard (not just selected) |
115+
| PowerShell error | Check if PowerShell is available and ExecutionPolicy allows execution |
116+
| Upload timeout | Check Remote-SSH connection stability |
117+
| Paste error | Make sure cursor is in text editor or terminal |
118+
| File permission error | Check write permissions in workspace directory |
119+
120+
## 📁 File Organization
121+
122+
```
123+
workspace/
124+
├── .claude/
125+
│ └── claude-code-chat-images/
126+
│ ├── .gitignore # Automatically created
127+
│ ├── image_1234567890.png
128+
│ └── image_1234567891.png
129+
└── your-project-files/
130+
```
131+
132+
## 🛠️ Development
133+
134+
Want to contribute or build from source?
135+
136+
```bash
137+
# Clone repository
138+
git clone https://github.com/dkodr/claudeboard.git
139+
cd claudeboard
140+
141+
# Install dependencies
142+
npm install
143+
144+
# Development workflow
145+
npm run compile # Compile TypeScript
146+
npm run watch # Watch for changes
147+
npm run package # Create VSIX package
148+
149+
# Testing
150+
code . # Open in VS Code
151+
# Press F5 to launch Extension Development Host
152+
```
153+
154+
### Architecture
155+
- **TypeScript** with strict mode for type safety
156+
- **Service-based architecture** for maintainability
157+
- **Cross-platform clipboard abstractions**
158+
- **Result<T,E> pattern** for error handling
159+
- **RAII** for automatic resource cleanup
160+
161+
## 🤝 Contributing
162+
163+
If you want to help with development:
164+
1. Fork the repository
165+
2. Create a feature branch (`git checkout -b feature/amazing-feature`)
166+
3. Commit your changes (`git commit -m 'Add amazing feature'`)
167+
4. Push to the branch (`git push origin feature/amazing-feature`)
168+
5. Open a Pull Request
169+
170+
## 📄 License
171+
172+
MIT License - see [LICENSE](https://github.com/dkodr/claudeboard/blob/HEAD/LICENSE) for details.
173+
174+
## 🔗 Links
175+
176+
- [VS Code Remote-SSH](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-ssh) - Required extension
177+
- [VS Code Extensions](https://marketplace.visualstudio.com/vscode) - Marketplace
178+
- [GitHub Issues](https://github.com/dkodr/claudeboard/issues) - Report issues
179+
180+
---
181+
182+
**Made with ❤️ for Claude Code and VS Code Remote Development users**

‎icon.png‎

14.4 KB
Loading

0 commit comments

Comments
 (0)