Thanks to visit codestin.com
Credit goes to github.com

Skip to content

feat: add Skills tab to Agent Behaviour settings #5287

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.

Sign up for GitHub

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

Jump to bottom
Merged
markijbema merged 3 commits into from
Jan 22, 2026
Merged

feat: add Skills tab to Agent Behaviour settings #5287

markijbema merged 3 commits into from
Jan 22, 2026

Conversation

@markijbema
Copy link
Contributor

@markijbema markijbema commented Jan 21, 2026

Summary

Added a Skills tab to the Agent Behaviour settings panel.

Changes

  • Skills tab in Agent Behaviour settings: New tab showing installed skills
  • Installed skills display: Shows both project-local and global skills with their descriptions and mode badges
  • Delete functionality: Trash icon button with confirmation dialog to remove installed skills
  • Tests included: Comprehensive test coverage for the InstalledSkillsView component (15 tests)

Files Changed

  • webview-ui/src/components/kilocode/settings/InstalledSkillsView.tsx - New component for displaying installed skills
  • webview-ui/src/components/kilocode/settings/__tests__/InstalledSkillsView.spec.tsx - Tests for the component
  • webview-ui/src/components/kilocode/settings/AgentBehaviourSettings.tsx - Added Skills tab
  • webview-ui/src/i18n/locales/en/kilocode.json - Added translation keys for skills UI
  • webview-ui/tsconfig.json - Added exclude for extension-specific shared code

@changeset-bot
Copy link

changeset-bot bot commented Jan 21, 2026 •
edited
Loading

🦋 Changeset detected

Latest commit: f162e2f

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
kilo-code Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@markijbema markijbema force-pushed the mark/skills-tab-agent-behaviour branch from b35ff95 to d4cecb6 Compare January 21, 2026 17:39
@markijbema markijbema force-pushed the mark/skills-tab-agent-behaviour branch from 38ee4de to 2628c12 Compare January 22, 2026 08:23
@markijbema markijbema marked this pull request as ready for review January 22, 2026 09:33
@kiloconnect
Copy link
Contributor

kiloconnect bot commented Jan 22, 2026

Code Review Summary

Status: No Issues Found | Recommendation: Merge

Overview

This PR adds a new "Skills" tab to the Agent Behaviour settings, allowing users to view and manage installed skills. The implementation is clean and well-structured:

  • Backend changes: Added postSkillsDataToWebview() method to ClineProvider and refreshSkills message handler in webviewMessageHandler.ts. Also added skill refresh logic after skill deletion.
  • Frontend changes: New InstalledSkillsView component with proper state management, message handling, and delete confirmation dialog.
  • Type definitions: Extended ExtensionMessage and WebviewMessage interfaces appropriately.
  • Localization: Added translations for all 22 supported languages.
  • Tests: Comprehensive test coverage for the new component.

Code Quality Notes

✅ Proper cleanup of event listeners in useEffect
✅ Null-safe handling with ?? operator
✅ Consistent use of translation keys
✅ Good separation of concerns with SkillsSection and SkillRow sub-components
✅ TypeScript types properly defined
✅ Test file follows project conventions

Files Reviewed (28 files)
  • .changeset/skills-tab-agent-behaviour.md
  • src/core/webview/ClineProvider.ts - 1 new method
  • src/core/webview/webviewMessageHandler.ts - 2 new handlers
  • src/shared/ExtensionMessage.ts - Type additions
  • src/shared/WebviewMessage.ts - Type additions
  • webview-ui/src/components/kilocode/rules/KiloRulesToggleModal.tsx - Skills tab integration
  • webview-ui/src/components/kilocode/settings/AgentBehaviourView.tsx - Skills tab integration
  • webview-ui/src/components/kilocode/settings/InstalledSkillsView.tsx - New component
  • webview-ui/src/components/kilocode/settings/__tests__/InstalledSkillsView.spec.tsx - New tests
  • webview-ui/src/i18n/locales/*/kilocode.json - 22 locale files updated
  • webview-ui/tsconfig.json - Exclude path addition

@markijbema markijbema enabled auto-merge January 22, 2026 09:43
@markijbema markijbema merged commit a624594 into main Jan 22, 2026
21 checks passed
@markijbema markijbema deleted the mark/skills-tab-agent-behaviour branch January 22, 2026 09:43
This was referenced Jan 22, 2026
Merged
Open
Open
Open
Open
Open
Closed
Closed
maywzh pushed a commit to maywzh/kilocode that referenced this pull request Jan 25, 2026
@markijbema
Merge pull request Kilo-Org#5287 from Kilo-Org/mark/skills-tab-agent-…
fe95ba7 
…behaviour

feat: add Skills tab to Agent Behaviour settings
maywzh pushed a commit to maywzh/kilocode that referenced this pull request Jan 25, 2026
@markijbema
Merge pull request Kilo-Org#5287 from Kilo-Org/mark/skills-tab-agent-…
31a6e8a 
…behaviour

feat: add Skills tab to Agent Behaviour settings
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@chrarnoldus chrarnoldus chrarnoldus approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@markijbema @chrarnoldus