feat(skills): align skill cards with registry design and add local build detail page#2020
Merged
feat(skills): align skill cards with registry design and add local build detail page#2020
Conversation
Contributor
There was a problem hiding this comment.
Pull request overview
Aligns the Skills UI with the registry card/design patterns by introducing shared card and detail-page layout primitives, and adds a navigable detail page for local builds (/skills/builds/$tag).
Changes:
- Added a local build detail route/page and wired navigation to it from build cards (with encoded tag params).
- Extracted shared UI primitives (
CardSkillBase,SkillDetailLayout) and refactored existing skill/build/registry cards and the registry skill detail page to use them. - Extended
RegistryDetailHeaderto supportbackSearchso “Back” navigation can preserve the correct tab.
Reviewed changes
Copilot reviewed 12 out of 12 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| renderer/src/routes/skills_.builds.$tag.tsx | New route for local build details; fetches builds list and renders BuildDetailPage or not-found state. |
| renderer/src/route-tree.gen.ts | Generated route-tree update to include /skills/builds/$tag. |
| renderer/src/features/skills/components/skill-detail-page.tsx | Refactors registry skill detail page to use shared SkillDetailLayout. |
| renderer/src/features/skills/components/skill-detail-layout.tsx | New shared two-column detail layout built on RegistryDetailHeader. |
| renderer/src/features/skills/components/dialog-delete-build.tsx | Adds optional onSuccess callback after successful deletion. |
| renderer/src/features/skills/components/card-skill.tsx | Refactors installed-skill card to use CardSkillBase and stopPropagation for footer actions. |
| renderer/src/features/skills/components/card-skill-base.tsx | New shared card shell used by skill/build/registry cards. |
| renderer/src/features/skills/components/card-registry-skill.tsx | Refactors registry skill card to use CardSkillBase and unified footer button styling. |
| renderer/src/features/skills/components/card-build.tsx | Refactors build card to use CardSkillBase and navigates to build detail when tag exists. |
| renderer/src/features/skills/components/build-detail-page.tsx | New build detail page using SkillDetailLayout with metadata badges and actions. |
| renderer/src/features/skills/components/tests/card-build.test.tsx | Updates assertions to reflect new card content formatting (description + digest). |
| renderer/src/features/registry-servers/components/registry-detail-header.tsx | Adds backSearch prop and passes it through to the back link. |
…guard decodeURIComponent against URIError
peppescg
approved these changes
Apr 16, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The skills feature had three card variants with inconsistent layouts and no detail page for local builds. This PR aligns the visual design across all skill cards and adds a navigable detail page for local builds.
CardSkillBaseas a shared card shell for all skill card variants (installed, registry, local builds), matching the layout and interaction pattern of the MCP registry cards — clickable title with overlay, consistent hover/focus rings, optional subtitle, description, badges, and footer slotsCardRegistrySkill,CardSkill, andCardBuildto useCardSkillBase; card clicks navigate to detail pages, footer actions use stopPropagationSkillDetailLayoutas a shared two-column detail layout (header + Summary + right panel) reused by both the registry skill detail and the new build detail pagebackSearchprop to RegistryDetailHeader so skills can navigate back to the correct tabskills/builds/$tagwith version/tag/digest metadata, Install + Remove actions, and the Skill.md placeholder panel; encode tag param to handle slashes safelysecondary+rounded-fullper the Figma designKapture.2026-04-16.at.16.17.02.mp4