-
Notifications
You must be signed in to change notification settings - Fork 206
Add VS Code file explorer icon for Camel YAML files #1588
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Add VS Code file explorer icon for Camel YAML files #1588
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull request overview
This PR aims to add a custom file explorer icon for Camel YAML files (*.camel.yaml and *.camel.yml) in VS Code, similar to how docker-compose.yml files display custom icons.
Changes:
- Added
iconThemescontribution point in package.json - Created icon theme definition file (camel.json) with file extension mappings
- Added SVG icon file (camel-yaml.svg) with Camel-themed design
Reviewed changes
Copilot reviewed 2 out of 3 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| karavan-vscode/package.json | Adds iconThemes contribution point to register the Karavan icon theme |
| karavan-vscode/icons/camel.json | Defines icon theme with file extension to icon mappings |
| karavan-vscode/icons/camel-yaml.svg | Provides SVG icon design for Camel YAML files |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
karavan-vscode/icons/camel.json
Outdated
| "fileExtensions": { | ||
| "camel.yaml": "_camel-yaml", | ||
| "camel.yml": "_camel-yaml" |
Copilot
AI
Jan 17, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
According to VS Code's file icon theme specification, the fileExtensions object should map file extensions to icon IDs. However, for compound extensions like "file.camel.yaml", only the last extension part is used by VS Code (i.e., "yaml"). To match files with patterns like ".camel.yaml", you need to use the fileNames property instead, with patterns like ".camel.yaml" and "*.camel.yml". The current implementation will not correctly match these files.
| "fileExtensions": { | |
| "camel.yaml": "_camel-yaml", | |
| "camel.yml": "_camel-yaml" | |
| "fileNames": { | |
| "*.camel.yaml": "_camel-yaml", | |
| "*.camel.yml": "_camel-yaml" |
| ], | ||
| "iconThemes": [ | ||
| { | ||
| "id": "karavan", | ||
| "label": "Karavan", | ||
| "path": "icons/camel.json" | ||
| } |
Copilot
AI
Jan 17, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The iconThemes contribution point is designed to replace the entire file icon theme in VS Code, not to augment the existing theme with specific file icons. When a user selects the "Karavan" icon theme, all file icons will be replaced with this theme's definitions, and only files matching ".camel.yaml" and ".camel.yml" will have icons - all other files will have no icons.
The correct approach for adding custom icons for specific file extensions is to use the contributes.icons contribution point combined with contributes.languages or file associations. Alternatively, consider using the approach of declaring file icon associations as part of the language definition if you have language support for these files.
| ], | |
| "iconThemes": [ | |
| { | |
| "id": "karavan", | |
| "label": "Karavan", | |
| "path": "icons/camel.json" | |
| } |
Adds VS Code file explorer icon mapping for Camel YAML files to improve visual clarity in the file explorer.
aa511a0 to
c466a1a
Compare
This PR adds a dedicated Camel icon for
*.camel.yamland*.camel.ymlfiles in the VS Code file explorer, similar to docker-compose.yml behavior.Changes Made
iconThemescontribution in package.jsonTesting
Fixes
Fixes #719